愚人节html

2023-03-22 11:22:06 浏览数 (1)

以下是一个简单的HTML代码,用于创建愚人节祝福语:

代码语言:javascript复制
html
<!DOCTYPE html>  
<html lang="en">  
<head>  
    <meta charset="UTF-8">  
    <meta name="viewport" content="width=device-width, initial-scale=1.0">  
    <title>愚人节快乐</title>  
    <style>  
        body {  
            font-family: Arial, sans-serif;  
        }  
  
        .container {  
            width: 300px;  
            padding: 16px;  
            background-color: #f2f2f2;  
            margin: 100px auto;  
            border: 1px solid black;  
            border-radius: 4px;  
            box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.2);  
        }  
  
        h1 {  
            font-size: 36px;  
            line-height: 48px;  
            color: white;  
            text-align: center;  
            letter-spacing: normal;          
  }  
        button {  
            background-color: #4CAF50;  
            color: white;  
            padding: 14px 50px;  
            cursor: pointer;  
            border: none;  
            outline: none;  
            width: 100%;  
            transition: opacity 0.2s ease-in-out;  
        当点击“滚动标题”按钮时,将触发名为“titleScroll”的函数,该函数将在页面上滚动标题并将其更改为新的内容。请注意,此代码仅用于演示目的。您可以根据需要进行修改和扩展。
        p {  
            font-size: 18px;  
            line-height: 24px;  
            color: gray;  
            text-align: justify;  
            word-break: keep-all;  
        }      

0 人点赞