我的问题涵盖了所有我无法弄清楚为什么我的about div区域不使用我设置的颜色(白色)的问题。我在CSS中设置了它,由于某种原因,它无法正确应用。所有帮助将不胜感激
body {
width: 100%;
background: #444444;
}
/*Header styles*/
header {
width: 100%;
height: 77px;
background: #ffffff;
}
header #logo {
background: #444444;
display: inline-block;
width: 150px;
margin-left: 60px;
float: left;
}
header nav {
width: 40%;
height: 100%;
vertical-align: middle;
float: right;
margin-right: 60px;
}
header nav ul {
list-style-type: none;
margin: 0;
padding: 0;
}
header nav li {
height: 100%;
line-height: 77px;
display: inline-block;
margin-left: 55px;
}
header nav a {
color: #000000;
text-decoration: none;
text-transform: uppercase;
}
/*Homepage Styles*/
#homepage {
width: 100%;
background: #444444;
}
#homepage #banner-h {
margin-top: 56px;
height: 751px;
background: #ffffff;
}
#homepage #banner-h #bht {
height: 88px;
margin: auto;
color: #000000;
}
#aboutme {
height: 2400px;
}
.aboutsection {
height: 593 px;
border: 1px solid black;
background: #ffffff;
}
footer {
margin-top: 56px;
background: #ffffff;
width: 100%;
height: 166px;
}
footer #fom {
height: 90%;
text-align: center;
display: table;
width: 100%;
}
footer h1 {
display: table-cell;
vertical-align: middle;
}
/*# sourceMappingURL=style.css.map */
<!DOCTYPE html>
<head lang="en">
<meta charset="UTF-8">
<link rel="stylesheet" href="css/style.css"/>
<link rel="stylesheet" href="css/normalize.css"/>
<title></title>
</head>
<body>
<header>
<div id="logo">
<img src="img/logo/caseywoelfle.com.svg" width="150px" height="77">
</div>
<nav>
<ul>
<li><a href="index.html">home</a></li>
<li><a href="aboutme.html">about me</a></li>
<li><a href="portfolio.html">portfolio</a></li>
<li><a href="blog.html">blog</a></li>
<li><a href="contact.html">contact</a></li>
</ul>
</nav>
</header>
<div id="aboutme">
<div class="aboutsecton"><p>Test</p></div>
<div class="aboutsecton"><p>Test</p></div>
<div class="aboutsecton"><p>Test</p></div>
<div class="aboutsecton"><p>Test</p></div>
</div>
<footer>
<span id="fom">
<h1>find out more about me</h1>
</span>
</footer>
</body>
</html>
归结为一个简单的错字。您.aboutsection
在CSS选择器中使用,但div的类为aboutsecton
,缺少i
。
代替:
<div class="aboutsecion"><p>Test</p></div>
...它应该是:
<div class="aboutsection"><p>Test</p></div>
p / s:另外,由于高度声明中有额外的空格,因此高度声明无效。应该593px
不会593 px
。
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句