具體內容請查閱《CSS參考手冊》

一、CSS模塊介紹

1.1 CSS1中定義了網頁基本屬性

字體、顏色、補白、基本選擇器等

1.2 CSS2中在CSS1的基礎上添加了高級功能

浮動和定位、高級選擇器（子選擇器、通用選擇器）

1.3 CSS3遵循的是模塊化開發。發布時間并不是一個時間點，而是一個時間段

二、CSS3新特性

1) 強大的css選擇器 2) 新的顏色制式 3) 多欄布局的實現 4) 多背景圖效果 5) 文字陰影效果 6) 開放的網絡字體類型 7) 圓角 8) 邊框背景圖片 9) 盒子陰影 10) 媒體查詢

三、選擇器

3.1 元素選擇器

選擇符類型介紹版本

E	類型選擇符	以文檔語言對象類型作為選擇符	CSS1
#myid	id選擇符	以唯一標識符id屬性等于myid的E對象作為選擇符	CSS1
.myclass	class選擇符	以class屬性包含myclass的E對象作為選擇符	CSS1
*	通配選擇符	所有元素對象	CSS2

3.2 關系選擇器

選擇符類型介紹版本

E F	包含選擇器	選擇所有被E包含的F元素	CSS1
E>F	子選擇器	選擇所有作為E元素的子元素F	CSS2
E+F	相鄰選擇器	選擇緊貼在E元素之后的F元素	CSS2
E~F	兄弟選擇符	選擇E元素所有兄弟元素F	CSS3

3.3 偽類選擇器

選擇符類型介紹版本

E:link	鏈接偽類選擇器	設置超鏈接a在未被訪問前的樣式	CSS1
E:visited	鏈接偽選擇器	設置超鏈接a被訪問后的樣式	CSS1
E:hover	用戶操作偽類選擇器	設置鼠標懸停在元素E時的樣式	CSS1/CSS2
E:active	用戶操作偽類選擇器	設置元素被用戶激活時（鼠標點擊與釋放之間發生的事件）的樣式	CSS1/CSS2
E:focus	用戶操作偽類選擇器	設置元素成為輸入焦點時的樣式	CSS1/CSS2
E:lang()	:lang()作偽類選擇器	匹配使用特殊語言的E元素	CSS2

3.4 屬性選擇器

選擇符介紹版本

E[attr]	選擇包含attr屬性的E元素	CSS2
E[attr="val"]	選擇具有att屬性且屬性值等于val的E元素	CSS2
E[attr~="val"]	選擇具有att屬性且屬性值為一用空格分隔的字詞列表，其中一個等于val的E元素	CSS2
E[attr|="val"]	選擇具有att屬性且屬性值為以val開頭并用連接符"-"分隔的字符串的E元素，如果屬性值僅為val，也將被選擇	CSS2
E[attr^="val"]	選擇具有att屬性且屬性值為以val開頭的字符串的E元素	CSS3
E[attr$="val"]	選擇具有att屬性且屬性值為以val結尾的字符串的E元素	CSS3
E[att*="val"]	選擇具有att屬性且屬性值為包含val的字符串的E元素	CSS3

3.5 偽對象選擇器

選擇符介紹版本

E::first-leter	設置對象內的第一個字符的樣式	CSS3
E::first-line	設置對象內的第一行的樣式	CSS3
E::before	設置在對象前（依據對象樹的邏輯結構）發生的內容。用來和content屬性一起使用，并且必須定義content屬性	CSS3
E::after	設置在對象后（依據對象樹的邏輯結構）發生的內容。用來和content屬性一起使用，并且必須定義content屬性	CSS3

四、顏色

屬性介紹版本

color	指定顏色。請參閱顏色值	CSS1
opacity	檢索或設置對象的不透明度	CSS3

五、布局

屬性介紹版本

display	設置或檢索對象是否及如何顯示	CSS2/CSS3
float	該屬性的值指出了對象是否及如何浮動	CSS1
clear	該屬性的值指出了不允許有浮動對象的邊	CSS1
visibility	設置或檢索是否顯示對象。與display屬性不同，此屬性為隱藏的對象保留其占據的物理空間	CSS2
overflow	復合屬性。檢索或設置對象處理溢出內容的方式	CSS2/CSS3
overflow-x	檢索或設置對象處理橫向溢出內容的方式	CSS2/CSS3
overflow-y	檢索或設置對象處理縱向溢出內容的方式	CSS2/CSS3

六、多列

屬性介紹版本

columns	設置或檢索對象的列數和每列的寬度。復合屬性	CSS3
column-width	設置或檢索對象每列的寬度	CSS3
column-count	設置或檢索對象的列數	CSS3
column-gap	設置或檢索對象的列與列之間的間隙	CSS3
column-rule	設置或檢索對象的列與列之間的邊框。復合屬性	CSS3
column-rule-width	設置或檢索對象的列與列之間的邊框厚度	CSS3
column-rule-style	設置或檢索對象的列與列之間的邊框樣式	CSS3
column-rule-color	設置或檢索對象的列與列之間的邊框顏色	CSS3
column-span	設置或檢索對象元素是否橫跨所有列	CSS3
column-fill	設置或檢索對象所有列的高度是否統一	CSS3
column-break-before	設置或檢索對象之前是否斷行	CSS3
column-break-after	設置或檢索對象之前是否斷行	CSS3
column-break-inside	設置或檢索對象內部是否斷行	CSS3

七、背景

屬性介紹版本

background	復合屬性。設置或檢索對象的背景特性	CSS1/CSS3
background-origin	設置或檢索對象的背景圖像顯示的原點	CSS3
background-clip	檢索或設置對象的背景向外裁剪的區域	CSS3
background-size	檢索或設置對象的背景圖像的尺寸大小	CSS3

八、文本

屬性介紹版本

text-indent	檢索或設置對象中的文本的縮進	CSS1/CSS3
letter-spacing	檢索或設置對象中的字符之間的最小，最大和最佳間隙	CSS1/CSS3
word-spacing	檢索或設置對象中的單詞之間的最小，最大和最佳間隙	CSS1/CSS3
text-align	設置或檢索對象中內容的水平對齊方式	CSS1/CSS3
vertical-align	設置或檢索對象內容的垂直對其方式	CSS1/CSS2
white-space	設置或檢索對象內空格的處理方式	CSS1
line-height	檢索或設置對象的行高。即字體最底端與字體內部頂端之間的距離	CSS1
tab-size	檢索或設置對象中的制表符的長度	CSS3
word-wrap	設置或檢索當內容超過指定容器的邊界時是否斷行	CSS3
word-break	設置或檢索對象內文本的字內換行行為	CSS3
overflow-wrap	設置或檢索當內容超過指定容器的邊界時是否斷行	CSS3
text-justify	設置或檢索對象內調整文本使用的對齊方式	CSS3
text-decoration	復合屬性。檢索或設置對象中的文本的裝飾	CSS1/CSS3
text-decoration-line	檢索或設置對象中的文本裝飾線條的位置	CSS3
text-decoration-color	檢索或設置對象中的文本裝飾線條的顏色	CSS3
text-decoration-style	檢索或設置對象中的文本裝飾線條的形狀	CSS3
text-decoration-skip	檢索或設置對象中的文本裝飾線條必須略過內容中的哪些部分	CSS3
text-underline-position	檢索或設置對象中的下劃線的位置	CSS3
text-shadow	設置或檢索對象中文本的文字是否有陰影及模糊效果	CSS3

九、邊框

屬性介紹版本

border	復合屬性。設置對象邊框的特性	CSS1
border-radius	設置或檢索對象使用圓角邊框	CSS3
box-shadow	設置或檢索對象陰影	CSS3
border-image	設置或檢索對象的邊框樣式使用圖像來填充	CSS3

轉載于:https://www.cnblogs.com/moonlightL/p/7446878.html

總結

以上是生活随笔為你收集整理的CSS内容简单归纳的全部內容，希望文章能夠幫你解決所遇到的問題。

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