第六节 标准文档流
一.標準文檔流
? ?標準文檔流包括:塊級元素和行內元素。
(1). 塊級元素
? ?特點: 一個元素單獨一行,不與其他元素并行,可以設置其寬度和高度,如果不設置寬度,寬度默認為其父元素的100%。
?
(2). 行內元素
???特點:與其他元素并行,不能設置其寬度和高度,默認寬度為內容的寬度。
?
二.相互轉換
(1). 塊級元素→行內元素
加上?display:inline。
?
1 <!DOCTYPE html>2 <html>3 <head>4 <meta charset="UTF-8">5 <title></title>6 <style type="text/css">7 div {8 display: inline; 9 width: 150px; 10 height: 150px; 11 background-color: pink; 12 } 13 </style> 14 </head> 15 <body> 16 <div>我是一個塊級元素</div> 17 <div>我是一個塊級元素</div> 18 </body 19 </html>?
(2). 行內元素→塊級元素
加上?display:block。
?
<!DOCTYPE html> <html><head><meta charset="UTF-8"><title></title><style type="text/css">span{display: block;width: 150px;height: 150px;background-color: pink;}</style></head><body><span>我是一個行內元素</span><span>我是一個行內元素</span> </body </html>?
三.脫離標準文檔流的三種方法
? ?脫離標準文檔流有三種方法:浮動、絕對定位、固定定位。
? ?
?
詳見下兩章: 浮動、定位。
?
總結
- 上一篇: 《功夫熊猫:神龙骑士》中文预告首曝 7月
- 下一篇: 天美为虚幻4新作招兵买马 游戏类型为大世