請(qǐng)問用clearfix清除浮動(dòng)錯(cuò)哪了
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="css/reset.css">
<link rel="stylesheet" href="css/index.css">
<title>學(xué)成網(wǎng)在線</title>
</head>
<body>
<!-- 頭部開始 -->
<div class="header">
<div class="content innerc">
<div class="logo fl">
<!-- 給a標(biāo)簽設(shè)置背景圖片 -->? ?
<h1><a >PHP13期</a></h1>
</div>
<div class="kecheng fl">
<ul class="">
<li><a href="#">首頁(yè)</a></li>
<li><a href="#">課程</a></li>
<li><a href="#">職業(yè)規(guī)則</a></li>
</ul>
</div>
</div>
</div>
<!-- 頭部結(jié)束 -->
</body>
</html>
/*初始化樣式*/
/*清除css默認(rèn)的樣式*/
*{
margin: 0;
padding: 0;
}
body{
font-size: 12px;
font-family:"宋體";?
}
/*去除小黑點(diǎn)*/
li{
list-style: none;
}
/*a標(biāo)簽集體美化*/
a{
text-decoration:none;
color: #444;?
}
a:hover{
text-decoration: underline;
color: #f00;
}
/*左浮動(dòng)*/
.fl{
float: left;
}
?/*右浮動(dòng)*/
?.fr{
? float: right;
?}
?/*清除浮動(dòng)*/
?.clearfix{
? content: "";
? display: block;
? height: 0;
? line-height: 0;
? visibility: hidden;
clear: both;
?}
?/*兼容寫法*/
?.clearfix{
? *zoom: 1;
?}
/*頭部開始的css代碼*/
.header{
width: 100%;
height: 101px;
background: #f3f6f8;
}
/*頭部結(jié)束的css代碼*/
/*版心開始*/
.innerc{
width: 1200px;
margin: 0 auto;
}
.content{
height: 101px;
/*background-color: #f00;*/
?}
?/*.logo{
? height: 101px;
? line-height: 101px;錯(cuò)誤的演示圖片垂直居中
?}*/
?.logo h1{
? padding-top: 30px;
?}
?.logo h1 a {
? /*margin-top: 30px;這句會(huì)導(dǎo)致整體下移*/
? display: block;
? width: 200px;
? height: 41px;
background-image: url(../images/logo.png);
text-indent:-9999px;/*隱藏a標(biāo)簽的文字內(nèi)容*/
?}
?.kecheng{
? padding-top: 30px;
? border:1px solid #000;
margin-left: 70px;
?}
?.kecheng ul li {
? float: left;
? margin-right: 44px;
? height: 40px;
? line-height: 40px;
? /*padding: 0 10px;*/
?}
?.kecheng ul li a {
font-size? ?: 18px;
display: block;
/*width: 100%;
height: 100%;*//*這注析內(nèi)容會(huì)導(dǎo)致下面padding出問題*/
padding: 0 10px;
border-bottom:#02a6ff 2px solid;
?}
2018-10-21
錯(cuò)沒錯(cuò)不知道，但是你沒用clearfix這個(gè)class啊