CSS屬性大全

2021-04-27 01:31:32 字數 4240 閱讀 6076

[背景]屬性共有六項:

「背景顏色」(background-color),設定背景顏色。

「背景影象」(background-image),設定網頁背景影象。

「重複」(background-repeat),控制背景影象的平鋪方式,有不重複(no-repeat)、重複(repeat,沿水平、垂直方向平鋪)、橫向重複(repeat-x,影象沿水平方向平鋪)和縱向重複(repeat-y,沿影象垂直方向平鋪)等4種選擇。

「附加」(background-attachment),用於控制背景影象是否會隨頁面的滾動而一起滾動。有固定(fixd,文字滾動時,背景影象保質固定)和滾動(scroll,背景影象隨文字內容一起滾動)兩種選擇。

「水平位置」/「垂直位置」(background-position),確定背景影象的水平、垂直位置

。共有左對齊(left)、右對齊(right)、頂部(top)、底部(bottom)、居中(center)和值(自定義背景影象的起點位置,可使使用者對背景影象的位置做出更精確的控制)等6種選擇。

[型別]屬性共有九項:

「字型」(font-family),設定時,需考慮瀏覽器中有無該字型。

「大小」(font-size),注意度量單位。

「粗細」(font-weight),除了normal(正常)、bold(粗體)、bolder(特粗)、lighter(細體)外,還有9種以畫素為度量為單位的設定方式。

「樣式」(font-style),也就是字型。

「行高」(line-height),就是行距。注意,行距只能以是字型大小值為

「變形」(font-variant),可以將正常文字一半尺寸後大寫顯示,但ie目前不支援這項屬性。

「大小寫」(text-transform),這項屬效能輕而易舉地控制字母大小寫,有首字大寫(capitalize、大寫(uppercase)、小寫(lowercase)和無(none,使所有繼承文字和變形引數被忽略,文字將以正常形式顯示)等4種。

「修飾」(text-decoration),用於控制鏈結文字的顯示形態,有下劃線(underline)、無下劃線(overline)、刪除線(line-through)、閃爍(blink)和無(none ,使上述效果均不會發生)等5種修飾方式。但ie4不支援文字閃爍。

[區塊]屬性共有六項:

「單詞間距」(word-spacing),主要用於控制文字間相隔的距離。有正常(normal)和值(自定義間隔值)兩種選擇方式。當選擇值時,可用的單位有英吋(in)、厘公尺(cm)、公釐(mm)、點數(pt)、12pt字(pc)、字型高(em)、字型x有高(ex)畫素(px)。

「字母間距」(letter-spacing),其作用與字元間距類似,也有正常(normal)和值(自定義間隔值)兩種選擇方式。

「垂直對齊」(vertical-align),控制文字或影象相對於其母體元素的垂直位置。如將乙個2×3畫素的gif影象同其母體元素文字的頂部垂直對齊,則該gif影象將在該行文字的頂部顯示。共有基線(baseline,將元素的基準線同母體元素的基準線對齊)、下標(sub,將元素以下標的形式顯示),上標(super,將元素以上標的形式顯示)、頂部(top ,將元素頂部同最高的母體元素對齊)、文字頂對齊(text-top,將元素的頂部同母體元素文字的頂部對齊)、中線對齊(middle,將元素的中點同母體元素的中點對齊)、底部(bottom,將元素的底部同最低的母體元素對齊)及值(自定義)等9種選擇。

「文字對齊」(text-align),設定塊的水平對齊方式。共有左對齊(left)、右對齊(right)、居中(center)和均分(justify)等4種選擇。

「文字縮排」(text-indent),控制塊的縮排程度。

「空白間距」(white-space),在html中,空格是被省略的;在css中則使用屬性(white-space)控制空格的輸入。共有正常(normal)、保留(pre)和不換行(nowrap)等3種選擇。

[邊框]的屬性有3項:

「寬」(border-width),控制邊框的寬度,其中分為4個屬性:border-top-width頂邊框的寬度、border-right-width右邊框的寬度、border-bottom-width底邊框的寬度、border-left-width左邊框的寬度。

「顏色」(border-color),設定各邊框的顏色。若要使邊框的四邊顯示不同的顏色,可在設定中分別列出。如,

p 瀏覽器將四種顏色依次理解為:上邊框、右邊框、底邊框和左邊框(自上開始順時針)。

「樣式」(border-style),設定邊框的樣式,共有無(none)、虛線(dotted)、點劃線線(dotted)、點劃線(dashed)、實線(solid)、雙線(double )、槽狀(grove)、脊狀(ridge)、凹陷(inset)和凸起(outset)等9種。

「盒子」屬性共有6項:

「寬」(width),確定盒子本身的寬度,可以使盒子的寬度不依靠它所包含的內容多少。

「高」(height),確定盒子本身的高度。

「浮動」(float),設定塊元素的浮動效果。

「清除」(clear),用於清除設定的浮動效果。

「邊距」(margin),控制圍繞邊框的邊距大小。其中包含4個屬性:margin-top控制上邊距的寬度、margin-right控制右邊距的寬度、margin-bottom控制下邊距的寬度、margin-left控制左邊距的寬度。

「邊界」(padding),確定圍繞塊元素的空格填充數量,其中包含4個屬性「padding-top控制上留白的寬度、padding-right控制右留白的寬度、padding-bottom控制下留白寬度、padding-left控制左留白的寬度。

[列表]屬性共有3項:

「型別」(list-style-type),確定列表每一項前使用的符號,共有圓點(disc)、圓圈(circle)、方形(square)、數字(decimal)、小寫羅馬數字(lower-roman )、大寫羅馬數字(upper-roman)、小寫字母(lower-alpha)和大寫字母(upper-alpha)等8種。

「專案影象」(list-style-image),其作用是將列表前面的符號換為圖形。

「位置」(list-style-position),用於描述列表位置,有內(outside)和外(inside)兩種選擇。

[定位]屬性共有6項:

「型別」(position),用於確定定位的型別,共有絕對(absolute)、相對(relative)和靜態(static)等3種選擇。

「z軸」(z-index),用於控制網頁中塊元素的疊放順序,可為元素設定重疊效果。該屬性的引數值使用純整數,值為0時,元素在最下層,適用於絕對定位或相對定位的元素。

「顯示」(visibility)使用該屬性可將網頁中的元素隱藏,共有繼承(inherit,繼承母體要素的可視性設定)、可見(visible)和隱藏(hidden)等3種選擇。

「溢位」(overflow),在確定了元素的高度和寬度後,如果元素的面積不能全部顯示元素中的內容時,該屬性做一日和尚撞一天鐘起作用了。其中共有可見(visible,擴大面積以顯示所有內容)、隱藏(hidden,隱藏超出範圍的內容)、滾動(scroll,在元素的右邊顯示乙個滾動條)和自動(auto,當內容超出元素面積時,顯示滾動條)等4種選擇。

「定位」,當為元素確定了絕對定位型別後,該組屬性決定元素在網頁中的具體位置。該組屬性包含4個子屬性,分別是「左」(屬性名為「left」,控制元素左邊的起始位置)、「上」(屬性名為「top」,控制元素上面的起始位置)、 「寬」或「高」(與「盒子」類屬性面板中「寬」或「高」的屬性作用相同)。

「剪輯」(clip),當元素被指定為絕對定位型別後,該屬性可以把元素區域切成各種形狀,但目前提供的只有方形一種。屬性值為rect(top right bottom left),即:

rect(top right bottom left),屬性值的單位為任何一種長度單位。

[擴充套件]屬性共有兩部分:

「分頁」,其中兩個屬性的作用是為列印的頁面設定分頁符。 「之前」(page-break-before);「之後」(page-break-after)。

「視覺效果」,其中兩個屬性的作用是為網頁中的元素施加特殊效果。 「游標」(cusor),可以指定在某個元素上要使用的游標形狀,共有15種選擇方式,分別代表滑鼠在windows作業系統中的各種形狀。另外它還可以指定指標圖示的url位址;「濾鏡」(fiter),可以為網頁中元素施加各種奇妙的濾鏡效果,共包含有16種濾鏡。

CSS 屬性大全

css 屬性 字型樣式 font style 序號中文說明 標記語法 1字型樣式 2字型型別 3字型大小 4字型風格 5字型粗細 6字型顏色 7陰影顏色 8字型行高 9字 間 距 10單詞間距 11字型變形 12英文轉換 13字型變形 14字型 文字樣式 text style 序號中文說明 標記語法...

CSS屬性大全整理

1 文字屬性 font size 大小 font family 字型型別 2 文字屬性 color 顏色 text decoration 下劃線 屬性值 none underline text align 對齊方式 屬性值 left center right hello css click me 3...

CSS核心屬性大全

css cascading style sheets層疊樣式表 語法 選擇符 外部樣式表鏈結方式 或者 inport url 路徑名 不常用,沒那個好 內聯樣式表優先順序最高 li 去掉無序列表的列表符號 a去掉超連結下劃線,寫導航的時候會用到,所以提前寫 包含選擇器選擇符1 選擇符2 偽類選擇器a...