9、顯示與隱藏

u? display屬性：

(1)none：隱藏元素，不會再占有頁面的任何空間，即不會影響布局。

(2)inline：默認值。將元素[顯示]為內聯元素???? （與HTML元素本身無關系）

(3)block：將元素[顯示]為塊極元素?????? ???????(與HTML元素本身無關系)

(4)inline-block：將元素顯示為行內塊級元素

即 設置寬度和高度有效(符合塊級元素)；可以水平排列即不會獨占一行(符合內聯元素)

?

u? visibility屬性：

(1)visible：默認值

(2)hidden：隱藏元素，占有頁面的空間位置

?

10、內容溢出(overflow)

內容溢出：當文本內容過多時，可能顯示會超出當前元素的區域

解決 ---overflow屬性：

(1) visible 默認值，表示不處理

(2) hidden 將溢出部分的內容進行隱藏,溢出的文本內容無法查看

(3) scroll 將溢出部分的內容隱藏，提供了滾動條，且滾動條效果始終都顯示

(4) auto (最好方式) 自動: 當內容溢出時，提供滾動條；當內容沒有溢出時，不提供滾動條

11、文檔流

概念：垂直方向從上到下的順序排列(分成一行一行)，水平方向從左到右的順序排列

【默認情況下，排列的順序不能改變】

u 塊級元素(每個元素獨占一行)：

在文檔流中自上向下排列（垂直方向排列）；

在文檔流中默認的寬度是父元素100%；且默認的高度是所有子元素的高度總和

u 內聯元素(每個元素不會獨占一行)：

在文檔流中自左向右水平排列（水平方向排列）；

寬度和高度都由內容確定

注: 如果在一行中不能容納所有的元素，則會換到下一行，繼續自左向右排列。

【元素離開文檔流而存在，分別是 浮動、絕對定位、固定定位】

總結

以上是生活随笔為你收集整理的CSS基础知识（display和visibility、overflow、文档流）的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。