div+css：div标签负责布局，结构，分块；css负责样式。
div: division，分割。div在浏览器中，默认是不会增加任何的效果改变的，但语义变了。div是一个容器级标签，里面什么都能放，甚至可以放div本身。
<div style="background-color: lightblue";>
<h2>金曲奖最佳作词嘻</h2>
<h3>成名在望</h3>
<p>那黑的终点可有光</p>
<p>那夜的尽头可会亮</p>
<p>那成名在望 会有希望</p>
<p>又或是 无知的狂妄</p>
</div>
<div style="background-color: lightyellow";>
<h2>金曲奖年度最佳歌曲嘿</h2>
<h3>第二人生</h3>
<p>生命不是过程 而是美丽旅程</p>
<p>风景 有亮和暗 也有爱和恨</p>
<p>第一站叫天真 第二站叫青春</p>
<p>下一站的名字 等你去确认</p>
</div>span：表达“小区域、小跨度”的标签，但是是一个文本级的标签。span里面放置的是小元素，div里放置的是大元素，div标签是最重要的布局标签。
<h3>专辑</h3>
<p>自传</p>
<p>简介：……。
<span>
<a href="">详细信息</a>
<a href="">买不买啊</a>
</span>
</p>
<p>第二人生</p>
<p>简介：……。
<span>
<a href="">详细信息</a>
<a href="">买不买啊</a>
</span>
</p>
<p>后青春期的诗</p>
<p>简介：……。
<span>
<a href="">详细信息</a>
<a href="">买不买啊</a>
</span>
</p>
</p> <style type="text/css">
.header{
width: 980px;
height: 100px;
margin: 0 auto;
background-color: lightyellow;
margin-bottom: 10px;
}
.content{
width: 980px;
height: 500px;
margin: 0 auto;
background-color: skyblue;
margin-bottom: 10px
}
.footer{
width: 980px;
height: 150px;
margin: 0 auto;
background-color: lightgreen;
margin-bottom: 10px;
}
</style>
</head>
<body>
<div class="header">
<div class="logo">
logo
</div>
<div class="nav">
导航
</div>
</div>
<div class="content">
<div class="guanggao">
广告
</div>
<div class="goods">
商品
</div>
</div>
<div class="footer">
页脚
</div>
711
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
