display 設定或檢索物件是否及如何顯示。
display: none 隱藏物件
display：block 除了轉換為塊級元素之外，同時還有顯示元素的意思。
特點： 隱藏之後，不再保留位置。
width: 40px;
heigt: 100px;
}.one
.two
visibility：visible ;
物件可視 visibility：hidden; 物件隱藏
特點： 隱藏之後，繼續保留原有位置。
width: 40px;
heigt: 100px;
}.one
.two
visible 不剪下內容也不新增滾動條
hidden 不顯示超過物件尺寸的內容，超出的部分隱藏掉
scroll 不管超出內容否，總是顯示滾動條
auto 超出自動顯示滾動條，不超出不顯示滾動條
width: 100px;
height: 100px;
background:lightblue;
overflow: hidden;
}
顯示與隱藏總結
display 隱藏物件，不保留位置 配合後面js做特效，比如下拉列表，原先沒有，滑鼠經過，顯示下拉列表， 應用極為廣泛
visibility 隱藏物件，保留位置 使用較少
overflow 只是隱藏超出大小的部分 1. 可以清除浮動 2. 保證盒子裡面的內容不會超出該盒子範
所謂的介面樣式， 就是更改一些使用者操作樣式，以便提高更好的使用者體驗。
更改使用者的滑鼠樣式 (滾動條因為相容性非常差，我們不研究)
表單輪廓等。
防止表單域拖拽
設定或檢索在物件上移動的滑鼠指標採用何種系統預定義的游標形狀。
default 小白 預設
pointer 小手
move 移動
text 文字
not-allowed 禁止
style
="cursor
:default
">
我是小白li
>
style
="cursor
:pointer
">
我是小手li
>
style
="cursor
:move
">
我是移動li
>
style
="cursor
:text
">
我是文字li
>
style
="cursor
:not-allowed
">
我是文字li
> ul
>
outline : outline-color ||outline-style || outline-width
最直接的寫法是 ： outline: 0; 或者 outline: none;
滑鼠樣式 更改滑鼠樣式cursor 樣式很多，重點記住 pointer
輪廓線 表單預設outline outline 輪廓線，我們一般直接去掉，border是邊框
防止拖拽 主要針對文字域 resize
防止使用者隨意拖拽文字域，造成頁面布局混亂，我們resize:none
有寬度的塊級元素水平居中對齊，是margin: 0 auto;
讓元素中的文字居中對齊，是 text-align: center;
vertical-align 垂直對齊，它只針對於行內元素或者行內塊元素
vertical-align : baseline |top |middle |bottom
設定或檢索物件內容的垂直對其方式。
注意：vertical-align 不影響塊級元素中的內容對齊，它只針對於行內元素或者行內塊元素，
特別是行內塊元素， 通常用來控制/表單與文字的對齊。
基線對齊 vertical-align：baseline；
垂直居中 vertical-align：middle；
頂部對齊 vertical-align：top；
給img vertical-align:middle | top| bottom等等。 讓不要和基線對齊。
給img 新增 display：block; 轉換為塊級元素就不會存在問題了
/先強制一行內顯示文字/ white-space: nowrap;
/超出的部分隱藏/ overflow: hidden;
/文字用省略號替代超出的部分/ text-overflow: ellipsis;
CSS高階技巧
1.滑鼠樣式cursor 設定或檢索在物件上移動的滑鼠指標採用何種系統預定義的游標形狀。cursor default 小白 pointer 小手 move 移動 text 文字 2.溢位的文字隱藏 word break 自動換行 white space設定或檢索物件內文字顯示方式。通常我們使用於強制...
CSS高階技巧
所謂的介面樣式，就是更改一些使用者操作樣式，比如 更改使用者的滑鼠樣式，表單輪廓.防止表單域拖拽等。但是比如滾動條的樣式改動受到了很多瀏覽器的抵制。設定或檢索在物件上移動的滑鼠指標採用何種系統預定義的游標形狀。cursor default 小白 pointer 小手 move 移動 text 文字 ...
CSS高階技巧
在css中有三個顯示和隱藏的單詞比較常見，我們要區分開，他們分別是 display visibility 和 overflow。他們的主要目的是讓乙個元素在頁面中消失，但是不在文件原始碼中刪除。display 顯示 display 設定或檢索物件是否及如何顯示。display none 隱藏物件 與...