07 CSS背景和列表

2022-06-13 12:48:14 字數 2064 閱讀 5016

vertical-align(垂直對齊)

baseline:預設。元素放置在父元素的基線上。

super:垂直對齊文字的上標

sub:垂直對齊文字的下標。

text-top:把元素的頂端與父元素字型的頂端對齊

text-bottom:把元素的底端與父元素字型的底端對齊。

top:把元素的頂端與行中最高元素的頂端對齊

middle:把此元素放置在父元素的中部。

bottom:把元素的底端與行中最低的元素的頂端對齊。

length:長度單位

%:使用 "line-height" 屬性的百分比值來排列此元素。允許使用負值。

inherit:規定應該從父元素繼承 vertical-align 屬性的值。

background-repeat(背景重複)

repeat:重複

no-repeat:不重複

repeat-x:水平方向重複

repeat-y:垂直方向重複

background-attachment(背景 是否隨頁面內容 滾動而滾動)

scroll:背景隨頁面內容滾動

fixed:背景不會隨頁面內容滾動,fixed是相對於整個網頁來說的

background-possision(設定背景影象的起始位置)

left top

left center

left bottom

right top

right center

right bottom

center top

center center

center bottom 如果僅指定乙個關鍵字,其他值將會是"center"

x% y% 第乙個值是水平位置,第二個值是垂直。左上角是0%0%。右下角是100%100%。如果僅指定了乙個值,其他值將是50%。 。預設值為:0%0%

xpos ypos 第乙個值是水平位置,第二個值是垂直。左上角是0。單位可以是畫素(0px0px)或任何其他 css單位。如果僅指定了乙個值,其他值將是50%。你可以混合使用%和positions

inherit 指定background-position屬性設定應該從父元素繼承

background(縮寫)

background:[background-color] [background-image] [background-repeat] [background-attachment] [background-position]

//各值之間用空格分割,不分先後順序

list-style-type(有序、無序列表樣式)

有序列表

none:無標記

decimal:從1開始的整數

lower-roman:小寫羅馬數字

lower-alpha:小寫英文本母

upper-alpha:大寫英文本母

無序列表

none:無標記

disc:實心圓點

circle:空心圓點

square:實心方塊

把列表的序號改成小圖示

list-style-image : url() ;

list-style-position(文字 是否環繞 列表圖示)

outside:不環繞列表圖示(預設)

inside:環繞列表圖示

list-style(縮寫)

list-style : [list-style-type] [list-style-position] [list-style-image]

//值之間用空格分割,順序不固定,list-style-image會覆蓋list-style-type

CSS背景和列表

background color 設定元素的背景顏色 background image 把影象設定成背景 background position 設定背景影象的起始位置 background attachment 背景影象是否固定或者隨著頁面的其餘部分滾動 background repeat 設定背...

07 css的繼承性和層疊性

繼承性 物件導向語言都會存在繼承的概念,在物件導向語言中,繼承的特點 繼承了父類的屬性和方法。那麼我們現在主要研究css,css就是在設定屬性的。不會牽扯到方法的層面。繼承 給父級設定一些屬性,子級繼承了父級的該屬性,這就是我們的css中的繼承。記住 有一些屬性是可以繼承下來 color font ...

07 css的繼承性和層疊性

07 css的繼承性和層疊性 css有兩大特性 繼承性和層疊性 物件導向語言都會存在繼承的概念,在物件導向語言中,繼承的特點 繼承了父類的屬性和方法。那麼我們現在主要研究css,css就是在設定屬性的。不會牽扯到方法的層面。繼承 給父級設定一些屬性,子級繼承了父級的該屬性,這就是我們的css中的繼承...