屬性
含義屬性值
font-size
大小(預設:inherited,繼承父級大小)(畫素:px、百分比:%、倍數:em)(小:small、大:large、正常:medium)
font-weight
粗細(預設:normal、普通)(粗體:bold、有強調的意思、粗細700)(自定義:100-900)
font-family
字型(格式:「宋體」,「arial」;)新增多種字型,用逗號隔開、防止一些使用者沒有第一種字型,就會顯示第二種字型
font-style
樣式(預設:normal)(有斜體的字型設定斜體:italic)(所以字型斜體:oblique)
color
顏色三種樣式:(名稱:red)(16進製制的rgb值:#rrggbb)(rgba函式:rgba(255,0,0,0.5))紅,綠,藍,透明度
font
復合基本寫法:(style weight size family)必要寫法:(size family)
屬性含義
屬性值background-color
背景顏色
和文字樣式的三種寫法一樣
background-image
背景(路徑:url(路徑))
background-repeat
背景平鋪方式
(預設:repeat,平鋪滿)(水平平鋪:repeat-x)(垂直平鋪:repeat-y)(不平鋪:no-repeat)
background-position
背景位置
座標:(x y)、數字:(px/%)、水平:(left/center/right)左/中/右、垂直(top/bottom)上/下
background-attachment
背景圖隨滾動條的移動方式
(按元素進行偏移(預設):scroll)(按瀏覽器進行偏移:fixed)
background
復合基本寫法:(color image repeat position)
屬性含義
屬性值text-align
對齊方式
(預設左對齊:left)(居中:center)(右對齊:right)(兩端對齊:justify)
line-height
行高(預設:不是固定值,根據當前字型的大小變化)(數字:px或scale[相對於原來字型的比例])
text-indent
首行縮排
縮排:font-size的兩倍,或2em[em相對單位],永遠跟乙個字型設定的大小相同
text-decoration
文字裝飾
(預設:none)(下劃線:underline)(刪除線:line-through)(上劃線:overline)
text-transform
文字大小寫
針對英文(小寫:lowercase)(大寫:uppercase)(首字母大寫:capitalize)
letter-spacing
字間距word-spacing
詞間距針對英文
word-break
非常強烈的折行
break-all
word-wrap
不是那麼強烈的折行
break-word
direction
內聯內容方向
(左往右:ltr 表示:left-to-right) (右往左:rtl 表示:right-to-left)
writing-mode
文字排版方式
(預設值:horizontal-tb 表示:水平-top-bottom) (垂直,左至右:vertical-lr) (垂直,右至左:vertical-rl)
text-stroke
文字描邊
(描邊寬度:text-stroke-width) (描邊顏色:text-stroke-color)
z-index
堆疊順序
數字,數字越大,就處於越頂層
屬性含義
屬性值border-width
邊框大小
(畫素:px)(倍數:em)
border-color
邊框顏色
和文字樣式的三種寫法一樣
border-radius
圓角邊框
(畫素:px)(百分比:%)
border-style
邊框樣式
(預設,實線:solid)(虛線:dashed)(點線:dotted)
border-collapse
合併**邊框
(預設,分開:separated)(合併:collapse)
-單獨選擇一邊
(上:border-top)(右:border-right)(下:border-bottom)(左:border-left)
border
復合樣式
基本寫法:(大小,樣式,顏色)
● 層疊性
- 後來居上:後面的會替代前面的樣式
● 繼承性
- 子承父業:繼承父元素的某些樣式
屬性含義
屬性值display
元素顯示型別
(塊級元素:block)(行內元素:inline)(行內塊元素:inline-block)(不佔空間隱藏:none)
-塊級元素
block
-行內元素
inline
-行內塊元素
inline-block
-不佔空間隱藏
none
visibility
元素顯示和隱藏
(預設,顯示:visible)(佔空間隱藏:hidden)
css樣式總結
一 浮動及清除 1.float 屬性定義元素在哪個方向浮動。以往這個屬性總應用於影象,使文字圍繞在影象周圍,在 css 中,任何元素都可以浮動。浮動元素會生成乙個塊級框。值描述 left 元素向左浮動 right 元素向右浮動 none 不浮動 預設 inherit 繼承父類的float屬性 2.浮...
css樣式總結
1.div在div中上下居中 父元素 display flex align item center 2.flex布局 display flex flex wrap wrap justify content space between 3.文字劃線 text decoration none 沒有 bl...
css樣式總結
web前端開發css基礎樣式總結 顏色和單位的使用 顏色用顏色的名字表示顏色,比如 red 用16進製表示演示 比如 ff0000 用rgb數值表示顏色,rgb 紅,綠,藍 每個值都在0 255之間 一般都用16進製表示顏色 單位px 畫素,與解析度設定相關.相對於瀏覽器的百分之多少,可以對寬度wi...