为什么不是'；我的身体里没有显示任何基本的html内容吗？_Html_Css_Header

为什么不是'；我的身体里没有显示任何基本的html内容吗？

html css

为什么不是'；我的身体里没有显示任何基本的html内容吗？,html,css,header,Html,Css,Header,我已经开始制作一个基本的porfolio页面，我开始制作一个简单的标题，我希望它位于页面空白区域的顶部中心，它看起来是隐藏的，或者根本不存在。有人能看出我做错了什么吗？链接至网站：以下是我关注的HTML部分： <div class="header"><h1>Portfolio</h1></div> 在css中，您将“header”作为id，而不是类，使用点符号表示类 .header { text-align:center;

我已经开始制作一个基本的porfolio页面，我开始制作一个简单的标题，我希望它位于页面空白区域的顶部中心，它看起来是隐藏的，或者根本不存在。有人能看出我做错了什么吗？链接至网站：

以下是我关注的HTML部分：

    <div class="header"><h1>Portfolio</h1></div>

在css中，您将“header”作为id，而不是类，使用点符号表示类

.header {
    text-align:center;
    width: 80%;
    float: left;
    background-color: black;

}

添加

页边距：自动将中间的DIV中心。它会自动为两边提供均匀的间距。
您有多个闭合的头部标记，但尚未为头部定义类别
<!doctype html>
<html>
<head>
<style>

.header {
    text-align:center;
    width: 80%;
    float: left;
    background-color: black;

}
</style>
<meta charset="UTF-8">
<title>Chloe Hammond - Digital Portfolio</title>
<link href="stylesheet2.css" rel="stylesheet" type="text/css" />
<link href='http://fonts.googleapis.com/css?family=Bad+Script|Kaushan+Script|Poiret+One'  rel='stylesheet' type='text/css'>


<!--METADATA-->
<meta name="description" content="A digital portfolio page showcasing Chloe Hammond's most recent projects from her New Media degree course at the University of Leeds. "/>

<meta name="keywords" content="chloe, hammond, portfolio, digital, new, media, experience, contact, work, university, student, leeds, intern, internship, freelance"/>
</head>



<body>
<div id="sidebar"> 
    <h2><ul>
        <li><a href="index2.html">Home</a></li>
        <li class="current"><a href="portfolio.html">Portfolio</a>
        <ul>
            <li><a href="design.html">Design</a></li>
            <li><a href="photo.html">Photo</li>
            <li><a href="motion.html">Motion</li>
            <li><a href="web.html">Web</li>
         </ul>
         </li>
        <li><a href="about2.html">About</a></li>
        <li><a href="contact2.html">Contact</a></li> 
    </ul></h2>
    </div>

   <div class="header"><h1>Portfolio</h1></div>

    <div class="social-sidebar-buttons">   

     <a href="http://www.facebook.com/chloe.hammond.7"><img src="facebook2.png" target="_blank" alt="Connect with Chloe on Facebook"/></a>                                              
  <a href="https://twitter.com/ChloeHammondx" title="twitter"><img src="twitter2.png" target="_blank" alt="Connect with Chloe on Twitter" /></a>

<a href="https://instagram.com/chloelouisehammond/" title="Instagram"><img src="instagram2.png" target="_blank" alt="View Chloe's Instagram feed" /></a>

<a href="mailto:chloehammond@live.co.uk" title="email"><img src="mailto2.png" target="_blank" alt="Email Chloe" /></a> 
    </div> 

</div>



</body>
</html>


.标题{
文本对齐：居中；
宽度：80%；
浮动：左；
背景色：黑色；
}
克洛伊·哈蒙德-数字组合








文件夹
好吧。。您定义了一个类，但设置了一个id选择器的样式
1.）拆下下面的螺栓
#header { ... }

2.）替换为
.header { ... }

3.）您需要定义一个高度，您可以保留与错位的#标题相关联的现有样式，但下面还有一些附加建议：
.header { 
     height: 100px; // define height
     margin: 0 auto; // center if you want
 }

这读起来更像是一个发现差异的游戏，而不是一个答案。没问题，我一直在做同样的事情。只是提醒一下：使用投票按钮旁边的复选标记来标记一个被接受的答案是很有帮助的。
.header { 
     height: 100px; // define height
     margin: 0 auto; // center if you want
 }