Div和Span標簽
Div: 一般用于配合css完成網(wǎng)頁的基本布局
Span: 一般用于配合css修改網(wǎng)頁中的一些局部信息
div和span有什么區(qū)別?
1.div會單獨的占領一行,而span不會單獨占領一行
2.div是一個容器級的標簽, 而span是一個文本級的標簽
容器級的標簽和文本級的標簽的區(qū)別?
容器級的標簽中可以嵌套其它所有的標簽
常見容器級的標簽: div h ul ol dl li dt dd ...
文本級的標簽中只能嵌套文字/圖片/超鏈接
常見文本級的標簽:span p buis strong em ins del ...
注意點:
不用刻意去記憶哪些標簽是文本級的哪些標簽是容器級, 在企業(yè)開發(fā)中一般情況下要嵌套都是嵌套在div中, 或者按照組標簽來嵌套(ul>li, ol>li , dl>dt+dd)
CSS元素顯示模式
在HTML中HTML將所有的標簽分為兩類, 分別是容器級和文本級
在CSS中CSS也將所有的標簽分為兩類, 分別是塊級元素和行內元素(其實還有一類, 行內塊級)
什么是塊級元素, 什么是行內元素?
塊級元素會獨占一行枪向; 行內元素不會獨占一行
常見容器級的標簽: div h ul ol dl li dt dd ...
常見文本級的標簽: span p buis stong em ins del ...
常見塊級元素: p div h ul ol dl li dt dd
常見行內元素: span buis strong em ins del
塊級元素和行內元素的區(qū)別?
塊級元素: 1. 獨占一行
2. 如果沒有設置寬度, 那么默認和父元素一樣寬
3. 如果設置了寬高, 那么就按照設置的來顯示
行內元素: 1. 不會獨占一行
2. 如果沒有設置寬度, 那么默認和內容一樣寬
3. 行內元素是不可以設置寬度和高度的
行內塊級元素
1. 為了能夠讓元素既能夠不獨占一行, 又可以設置寬度和高度, 那么就出現(xiàn)了行內塊級元素
2. 不獨占一行, 并且可以設置寬高
CSS元素顯示模式轉換
轉換CSS元素的顯示模式方法: 設置元素的display屬性
display取值: block 塊級烤咧; inline 行內剃幌; inline-block 行內塊級
快捷鍵:
di ? ? ?display: inline;
db ? ? display: block;
dib ? ?display: inline-block