<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8"/>
<style type="text/css">
</style>
</head>
<body>
<!--
文檔流：
文檔流處在網頁的最底層，他表示的是一個頁面中的位置，
我們所創建的元素默認在文檔流中
元素在文檔流的特點
塊元素：
1.塊元素只有在文檔流中會獨佔一行，塊元素會自上向下排列
2.塊元素在文檔流中的默認寬度是父元素的100%（auto）
3.塊元素在文檔流中的默認高度被內容撐開
內聯元素：
1.內聯元素在文檔流中只佔自身的大小，會默認從左向右排列
如果一行不足以容納內聯元素，會換到下一行，依舊自左向右
2.內聯元素的寬度高度默認都被內容撐開
-->
<!--
當元素的寬度爲auto時，此時指定內邊距不會影響可見框的大小
而是會自動修改寬度，以適應內邊距
-->
<div style="width: 100px; height: 100px ; background-color: pink;"></div>
<div style="width: 100px; height: 100px ; background-color: rgb(255, 236, 192);"></div>
<span style="background-color: pink;">我是一個span</span>
<span style="background-color: rgb(255, 236, 192);">我是一個span</span>
</body>
</html>
css10.文檔流
發表評論
所有評論
還沒有人評論，想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章
CSS19. 條件Hack&&屬性Hack
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"/> <style type="text/css"> .box1