所以,我练习了 HTML/CSS,想构建一个简单的子标题,与在 http://www.phppennyauctiondemo.com/ 上看到的完全一样(div id="sub-header",分类部分)。
我是这样做的:
<div id="sub-header">
<div class="sub-mid">
<ul id="nav">
<li><a href="">All items (1)</a></li>
<li><a href="">Shops and Coupons</a></li>
<li><a href="">Kids toys</a></li>
</ul>
</div>
</div>
#sub-header
{
background: url("/images/front_layout/header_sub_bg.gif") repeat-x;
height: 31px;
border-top:1px solid #708044;
border-bottom:1px solid #d4dde1;
}
#sub-header .sub-mid
{
width: 950px;
margin: 0 auto;
}
#nav
{
padding: 4px 0;
}
#nav li
{
padding: 0 3px;
border-right: 1px solid #B1C0C5;
float: left;
}
#nav li a
{
padding: 3px 8px;
color: #607E87;
text-shadow: 1px 1px 0 #FFFFFF;
height:15px;
display: block;
}
这看起来与它们的子标题(在 Firefox 中)完全一样。
但是当我查看他们的标记和 CSS 时,我在实际内容之前看到了更多的 div,然后我使用了更多的 CSS:
<div id="sub-header" class="clearfix">
<div align="center">
<div style="width:950px; text-align:left;">
<div id="select-categories">
<ul id="nav"> UL after 4 divs... </ul>
因为我不是专业的 Web 开发人员,而且我假设是专业人士构建了该页面 - 我的问题是他们为什么使用这么多 div 而没有做任何事情?
关于 CSS/HTML 有什么我不知道的吗?
最佳答案
使用那么多 div 是一种我们称之为“divitis”的疾病。它来自于让开发人员忘记他可以经常使用 ul、p 等元素来定位和设置样式而无需将它们包装在 div 中的病症。通常,您可以删除这些额外的 div 元素而不会造成任何伤害,除非可能需要重写 CSS 来解决这个问题。
还没有找到疫苗,只有时间和经验有帮助。
关于html - 标记和 CSS : why so many div's before the actual content?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/6693363/