1. 尺寸屬性(Dimension)

height: 設置元素高度。

max-height: 設置元素的最大高度。

max-width: 設置元素的最大寬度。

min-height: 設置元素的最小高度。

min-width: 設置元素的最小寬度。

width: 設置元素的寬度。

2. 背景屬性(Background)

background: 在一個聲明中設置所有的背景屬性。

background-color: 設置元素的背景顏色。

background-image: 設置元素的背景圖像。

background-repeat: 設置是否及如何重復背景圖像。

background-position: 設置背景圖像的開始位置。

background-attachment: 設置背景圖像是否固定或者隨著頁面的其余部分滾動。

background-clip: 規定背景的繪制區域。

background-origin: 規定背景圖片的定位區域。

background-size: 規定背景圖片的尺寸。

3. 字體屬性(Font)

font: 在一個聲明中設置所有字體屬性。

font-family: 規定文本的字體系列。

font-size: 規定文本的字體尺寸。

font-style: 規定文本的字體樣式。

font-variant: 規定是否以小型大寫字母的字體顯示文本。

font-weight: 規定字體的粗細。

4. 文本屬性(Text)

color: 設置文本的顏色。

direction: 規定文本的方向/書寫方向。

letter-spacing: 設置字符間距。

line-height: 設置行高。

text-align: 規定文本的水平對齊方式。

text-decoration: 規定添加到文本的裝飾效果。

text-indent: 規定文本塊首行的縮進。

text-transform: 控制文本的大小寫。

white-space: 規定如何處理元素中的空白。

word-spacing: 設置單詞間距。

text-overflow: 規定當文本溢出包含元素時發生的事情。

text-shadow: 向文本添加陰影。

word-wrap: 允許對長的不可分割的單詞進行分割并換行到下一行。

5. 列表屬性(List)

list-style: 在一個聲明中設置所有的列表屬性。

list-style-image: 將圖象設置為列表項標記。

list-style-position: 設置列表項標記的放置位置。

list-style-type: 設置列表項標記的類型。 ?

6. 輪廓屬性(Outline)

outline: 在一個聲明中設置所有的輪廓屬性。

outline-color: 設置輪廓的顏色。

outline-style: 設置輪廓的樣式。

outline-width: 設置輪廓的寬度。

outline-offset: 設置輪廓的偏移。

7. 邊框屬性(Border)

border: 在一個聲明中設置所有的邊框屬性。

border-bottom: 在一個聲明中設置所有的下邊框屬性。

border-bottom-color: 設置下邊框的顏色。

border-bottom-style: 設置下邊框的樣式。

border-bottom-width: 設置下邊框的寬度。

border-color: 設置四條邊框的顏色。

border-left: 在一個聲明中設置所有的左邊框屬性。

border-left-color: 設置左邊框的顏色。

border-left-style: 設置左邊框的樣式。

border-left-width: 設置左邊框的寬度。

border-right: 在一個聲明中設置所有的右邊框屬性。

border-right-color: 設置右邊框的顏色。

border-right-style: 設置右邊框的樣式。

border-right-width: 設置右邊框的寬度。

border-style: 設置四條邊框的樣式。

border-top: 在一個聲明中設置所有的上邊框屬性。

border-top-color: 設置上邊框的顏色。

border-top-style: 設置上邊框的樣式。

border-top-width: 設置上邊框的寬度。

border-width: 設置四條邊框的寬度。

border-radius: 簡寫屬性, 設置所有四個border-*-radius屬性。

border-top-left-radius: 定義邊框左上角的形狀。

border-top-right-radius: 定義邊框右下角的形狀。

border-bottom-left-radius: 定義邊框左下角的形狀。

border-bottom-right-radius: 定義邊框右下角的形狀。

border-image: 簡寫屬性, 設置所有border-image-*屬性。

border-image-outset: 規定邊框圖像區域超出邊框的量。

border-image-repeat: 圖像邊框是否應平鋪(repeated)、鋪滿(rounded)或拉伸(stretched)。

border-image-slice: 規定圖像邊框的向內偏移。

border-image-source: 規定用作邊框的圖片。

border-image-width: 規定圖片邊框的寬度。

box-shadow: 向方框添加一個或多個陰影。

8. 外邊距屬性(Margin)

margin: 在一個聲明中設置所有外邊距屬性。

margin-bottom: 設置元素的下外邊距。

margin-left: 設置元素的左外邊距。

margin-right: 設置元素的右外邊距。

margin-top: 設置元素的上外邊距。

9. 內邊距屬性(Padding)

padding: 在一個聲明中設置所有內邊距屬性。

padding-bottom: 設置元素的下內邊距。

padding-left: 設置元素的左內邊距。

padding-right: 設置元素的右內邊距。

padding-top: 設置元素的上內邊距。

10. 表格屬性(Table)

border-collapse: 規定是否合并表格邊框。

border-spacing: 規定相鄰單元格邊框之間的距離。

caption-side: 規定表格標題的位置。

empty-cells: 規定是否顯示表格中的空單元格上的邊框和背景。

11. 定位屬性(Positioning)

display: 規定元素應該生成的框的類型。

position: 規定元素的定位類型。

top: 設置定位元素的上外邊距邊界與其包含塊上邊界之間的偏移。

right: 設置定位元素右外邊距邊界與其包含塊右邊界之間的偏移。

bottom: 設置定位元素下外邊距邊界與其包含塊下邊界之間的偏移。

left: 設置定位元素左外邊距邊界與其包含塊左邊界之間的偏移。

overflow: 規定當內容溢出元素框時發生的事情。

z-index: 設置元素的堆疊順序。

float: 規定框是否應該浮動。

clear: 規定元素的哪一側不允許其他浮動元素。

visibility: 規定元素是否可見。

clip: 剪裁絕對定位元素。

cursor: 規定要顯示的光標的類型(形狀)。

vertical-align: 設置元素的垂直對齊方式。

12. Color屬性

opacity: 規定元素的不透明級別。

13. 2D/3D 轉換屬性(Transform)

transform: 向元素應用2D或3D轉換。

14. 過渡屬性(Transition)

transition: 簡寫屬性, 用于在一個屬性中設置四個過渡屬性。

transition-property: 規定應用過渡的CSS屬性的名稱。

transition-duration: 定義過渡效果花費的時間。

transition-timing-function: 規定過渡效果的時間曲線。

transition-delay: 規定過渡效果何時開始。

15. CSS3 動畫屬性(Animation)

@keyframes: 規定動畫。

animation: 所有動畫屬性的簡寫屬性, 除了animation-play-state屬性。

animation-name: 規定 @keyframes 動畫的名稱。

animation-duration: 規定動畫完成一個周期所花費的秒或毫秒。

animation-timing-function: 規定動畫的速度曲線。

animation-delay: 規定動畫何時開始。

animation-iteration-count: 規定動畫被播放的次數。

animation-direction: 規定動畫是否在下一周期逆向地播放。

animation-play-state: 規定動畫是否正在運行或暫停。

animation-fill-mode: 規定對象動畫時間之外的狀態。

16. 多列屬性(Multi-column)

column-count: 規定元素應該被分隔的列數。

column-gap: 規定列之間的間隔。

column-rule: 設置所有column-rule-*屬性的簡寫屬性。

column-rule-color: 規定列之間規則的顏色。

column-rule-style: 規定列之間規則的樣式。

column-rule-width: 規定列之間規則的寬度。

column-span: 規定元素應該橫跨的列數。

column-width: 規定列的寬度。

columns: 規定設置column-width和column-count的簡寫屬性。

17. 用戶界面屬性(User-interface)

appearance: 允許您將元素設置為標準用戶界面元素的外觀。

box-sizing: 允許您以確切的方式定義適應某個區域的具體內容。

icon: 為創作者提供使用圖標化等價物來設置元素樣式的能力。

nav-down: 規定在使用arrow-down導航鍵時向何處導航。

nav-index: 設置元素的tab鍵控制次序。

nav-left: 規定在使用arrow-left導航鍵時向何處導航。

nav-right: 規定在使用arrow-right導航鍵時向何處導航。

nav-up: 規定在使用arrow-up導航鍵時向何處導航。 ?

resize: 規定是否可由用戶對元素的尺寸進行調整。

總結

以上是生活随笔為你收集整理的050_学习的CSS属性的全部內容，希望文章能夠幫你解決所遇到的問題。

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