CSS之div和span标签
div和span是非常重要的標(biāo)簽，div的語義是division“分割”； span的語義就是span“范圍、跨度”。
這兩個(gè)東西，都是最最重要的“盒子”。
?
1????????????????<div> 2??????? ???????????????? <h3>中國主要城市</h3> 3??????? ???????????????? <ul> 4??????? ???????????????????????? <li>北京</li> 5??????? ???????????????????????? <li>上海</li> 6??????? ???????????????????????? <li>廣州</li> 7??????? ???????????????? </ul> 8????????????????</div> 9????????? 10????????????? <div> 11????? ???????????????? <h3>美國主要城市</h3> 12????? ???????????????? <ul> 13????? ???????????????????????? <li>紐約</li> 14????? ???????????????????????? <li>洛杉磯</li> 15????? ???????????????????????? <li>華盛頓</li> 16????? ???????????????????????? <li>西雅圖</li> 17????? ???????????????? </ul> 18????? ????????</div> |
div在瀏覽器中，默認(rèn)是不會(huì)增加任何的效果改變的，但是語義變了，div中的所有元素是一個(gè)小區(qū)域。
div標(biāo)簽是一個(gè)容器級(jí)標(biāo)簽，里面什么都能放，甚至可以放div自己
?
span也是表達(dá)“小區(qū)域、小跨度”的標(biāo)簽，但是是一個(gè)“文本級(jí)”的標(biāo)簽。
就是說，span里面只能放置文字、圖片、表單元素。 span里面不能放p、h、ul、dl、ol、div。
span里面是放置小元素的，div里面放置大東西的：
1??????? ???????????????????????? <p> 2??????? ???????????????????????????????? 簡介簡介簡介簡介簡介簡介簡介簡介 3??????? ???????????????????????????????? <span> 4??????? ????????????????????????????????????????? <a href="">詳細(xì)信息</a> 5??????? ????????????????????????????????????????? <a href="">購買</a> 6??????? ???????????????????????????????? </span> 7??????? ???????????????????????? </p> |
div標(biāo)簽是最最重要的布局標(biāo)簽：
1??????? ??????? <div class="header"> 2??????? ???????????????? <div class="logo"></div> 3??????? ???????????????? <div class="nav"></div> 4??????? ??????? </div> 5??????? ??????? <div class="content"> 6??????? ???????????????? <div class="guanggao"></div> 7??????? ???????????????? <div class="dongxi"></div> 8??????? ??????? </div> 9??????? ??????? <div class="footer"></div> |
所以，我們親切的稱呼這種模式叫做“div+css”。div標(biāo)簽負(fù)責(zé)布局，負(fù)責(zé)結(jié)構(gòu)，負(fù)責(zé)分塊。css負(fù)責(zé)樣式。
?
轉(zhuǎn)載于:https://blog.51cto.com/huyusheng/1925544
超強(qiáng)干貨來襲 云風(fēng)專訪：近40年碼齡，通宵達(dá)旦的技術(shù)人生總結(jié)
以上是生活随笔為你收集整理的CSS之div和span标签的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： S3C2440 IIS操作 uda134
- 下一篇： 史上最全的CSS hack方式一览