标题创建

时间:2016-11-17 15:08:47

标签: html css

在我的脑海里,我想用“你的形象比我们的形象更重要”,重点是更重要。

我还希望用下划线和阴影来匹配红色背景(白色阴影)。如果它应该眨眼或淡入,我也在争论这个重点。

出于某种原因,我的css没有开展工作。 HTML代码:

    <!-- This is a HTML Document-->

    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <link rel="stylesheet" href="dld.css">
        <title>Dave's Logo Designs</title>
    </head>
    <header>
        <div id="header">
            <h1>Your Image is <em>More Important</em> Than Ours</h1>
        </div>
    </header>
    <body>
        <h1>Welcome to the official site of Dave's Logo Designs<h1>
    </body>
    </html>

CSS到目前为止:

    header {
        width: 100%;
        height: 200px;
    }
    header:h1 { 
        color: red;
        text-shadow: 0px 2px 2px white;
        font-size: 25px;
        font-family: impact;
    }
    header:em {
        color: white;
        font-weight: bold;
        text-decoration: underline;
        font-size: 30px;
        font-family: impact;
    }

什么都没有用。我的结局可能是愚蠢的。感谢您的帮助。

1 个答案:

答案 0 :(得分:0)

您应该将header标记放在body标记内。

<html>
    <head>
       <meta charset="utf-8">
       <meta name="viewport" content="width=device-width, initial-scale=1">
       <link rel="stylesheet" href="dld.css">
       <title>Dave's Logo Designs</title>
   </head>
   <body>
       <header>
           <div id="header">
               <h1>Your Image is <em>More Important</em> Than Ours</h1>
           </div>
       </header>
       <h1>Welcome to the official site of Dave's Logo Designs<h1>
   </body>
</html>

并且还会更改您的css选择器

header {
    width: 100%;
    height: 200px;
}

header h1 { 
    color: red;
    text-shadow: 0px 2px 2px white;
    font-size: 25px;
    font-family: impact;
}

header em {
    color: white;
    font-weight: bold;
    text-decoration: underline;
    font-size: 30px;
    font-family: impact;
}

请注意headerh1之间的空格。

它会像这样(添加深绿色背景以显示斜体文本为白色)。

enter image description here