好程式設計師前端教程css中可被繼承和不可被繼承的屬性

好程式設計師發表於2019-03-22

好程式設計師前端教程css中可被繼承和不可被繼承的屬性
一.無繼承性的屬性

1.display:規定元素應該生成的框的型別

2.文字屬性:vertical-align:垂直文字對齊

text-decoration:規定新增到文字的裝飾

text-shadow:文字陰影效果

white-space:空白符的處理

unicode-bidi:設定文字的方向

3.盒子模型的屬性:width,height,margin,margin-top,margin-right,margin-bottom,margin-left,border,border-style,border-top(right,bottom,left)-style

border-top(right,bottom,left)-width,border-top(right,bottom,left)-color,border-top,border-right,border-bottom,border-left,

padding,padding-top,padding-right,padding-bottom,padding-left

4.背景屬性:background,background-color,background-image,background-repeat,background-position,background-attachment

5.定位屬性:float,clear,position,top,right,bottom,left,min-width,min-height,max-width,max-height,overflow,clip,z-index

6.生成內容屬性:content,content-seset,content-increment

7.輪廓樣式屬性:outline,outline-style,outline-width,outline-color

8.頁面樣式屬性:size,page-break-before,page-break-after

9.聲音樣式屬性:pause,pause-before,pause-after,cue,cue-before,cue-after,play-during

二.有繼承性的屬性

1.字型系列屬性:font:組合字型

font-family:規定元素的字型系列

font-weight:設定字型的粗細

font-size:設定字型的尺寸

font-style:設定字型的風格

font-variant:設定小型大寫字母的字型顯示文字,這意味著所有的小寫字母均會被轉換為大寫,但是所有使用小型大寫字型的字母與其餘文字相比,其字型尺寸更小

font-stretch:對當前的font-family進行伸縮變形,所有主流瀏覽器都不支援

font-size-adjust:為某個元素規定一個aspect值,這樣就可以保持首選字型的x-height

2.文字系列屬性:text-indent:文字縮排

text-align:文字水平對齊

line-height:行高

word-spacing:增加或減少文單詞間的空白(即字間隔)

letter-spacing:增加或減少字元間的空白(字元間距)

text-transform:控制文字大小寫

direction:規定文字的書寫方向

color:文字顏色

3.元素可見性:visibility

4.表格佈局屬性:caption-side,border-collapse,border-spacing,empty-cells,table-layout

5.列表佈局屬性:list-style,list-style-image,list-style-type,list-style-position

6.生產內容屬性:quotes

7.游標屬性:cursor

8.頁面樣式屬性:page,page-break-inside,Windows,orphans

9.聲音樣式屬性:speak、speak-punctuation、speak-numeral、speak-header、speech-rate、volume、voice-family、pitch、pitch-range、stress、richness、、azimuth、elevation

三.所有元素可繼承屬性

1.元素可見性:visibility

2.游標屬性:cursor

四.內聯元素可以繼承的屬性

1.字型系列屬性

2.除text-indent,text-align之外的文字系列屬性

五.塊級元素可以繼承的屬性

1.text-indent,text-align


來自 “ ITPUB部落格 ” ,連結:http://blog.itpub.net/69913864/viewspace-2639095/,如需轉載,請註明出處,否則將追究法律責任。

相關文章