一、div和span標(biāo)簽
- 什么是div
- 作用: 一般是用于配合css完成網(wǎng)頁的基本布局。
- 什么是span
- 作用：一般配合css修改網(wǎng)頁中的一些局部信息。
- div 和 span 的區(qū)別
- div會單獨占領(lǐng)一行，span不會單獨占領(lǐng)一行。
- div是一個容器級別的標(biāo)簽，span 是文本級別的標(biāo)簽。
- 容器級和文本級的標(biāo)簽的區(qū)別？
- 容器級的標(biāo)簽中可以嵌套其他所有的標(biāo)簽，但是文本級的標(biāo)簽中只能嵌套文字/超鏈接/圖片。
- 注意點：那些標(biāo)簽是文本級的，那些標(biāo)簽是容器級的，我們可以不用去記憶的，在企業(yè)開發(fā)中一般情況下要嵌套的都是嵌套在div 中，或者按照組標(biāo)簽來嵌套。
二、CSS元素的顯示模式
1、什么是CSS的顯示模式
- 在HTML中將所有的標(biāo)簽分為兩類，分別是容器級別和文本級別，在css中，也將所有的標(biāo)簽分為兩類，分別是塊級別元素和行內(nèi)元素。
- 什么是塊級元素，什么是行內(nèi)元素？
塊級別元素(容器級)：p/div/ h/ ul/ol/dl/li/dt/dd
行內(nèi)元素（文本）：span/buis/strong/em/ins/del
- 塊級元素和行內(nèi)元素的區(qū)別？
塊級元素：
- 獨占一行；
- 如果沒有設(shè)置寬度，那么默認(rèn)和父元素一樣寬；
- 如果設(shè)置了寬度，那么就根據(jù)設(shè)置的來顯示；
行內(nèi)元素：
- 不會獨占一行；
- 如果沒有設(shè)置寬度，那么默認(rèn)和內(nèi)容一樣寬；
- 行內(nèi)元素是不可以設(shè)置寬度和高度的。
行內(nèi)塊級元素：
1.為了能夠讓元素既能夠不獨占一行，又可以設(shè)置寬度和高度，那么就出現(xiàn)了行內(nèi)塊級元素。例如 img
二、CSS元素顯示模式的轉(zhuǎn)換
1、如何轉(zhuǎn)化CSS 元素的顯示模式?
- 設(shè)置元素的display屬性
2、display 的取值
- block：塊級
- inline：行內(nèi)
- inline-block: 行內(nèi)轉(zhuǎn)換
3、快捷鍵：
di : display:inline
db: display:block
dib:display:inline-block
