CSS樣式基礎知識(下)

2021-10-23 20:29:59 字數 1915 閱讀 9206

(1) 預定的顏色:

(2)十六進製制顏色:如(#0f0f0f)

(3)rgb顏色(128,0,0)全紅

(4)在rgb的基礎上又新增了表示透明度的alpha

(5)hsl:用色調,飽和度,和透明度三個分量來表示顏色

(6)hsla:在hsl的基礎上又新增了表示透明度的alpha

預定義顏色

rgb顏色

16進製制顏色

background-color:背景顏色

background-image:背景

background-repeat:複製選項;

1.repeat在水平,垂直兩個方向複製

2.repeat-x/y在水平/垂直方向進行複製

3.no-repeat不複製

background-position:所在位置

上:top

下:bottom

左:left

右:right

background:

url(img/c.jpg) #87ceeb repeat-y right;

1.固定高度與寬度:height:200px

2.自適應高度: 高度會根據內容的增加而增加

3.指定最高度max-height:內容增加到指定高度的時候就不會再增加

4.指定最高度min-height:開始是高度固定,內容增加到一定地步時開始增加高度

visibility:hidden(僅僅隱藏內容,該元素所佔位置依然存在)

display:none(不僅隱藏內容,而且隱藏位置)

display:inline(將塊元素以內聯元素形式顯示,此時寬,高的等屬性對其無效)

display:inline -block(將塊級元素以內聯元素形式顯示並且具有塊級元素的特徵,寬,高屬性依然有效)

display:block(將內聯元素以塊級元素的形式展現)

margin:外邊距

margin-top(上)

margin-bottom (下)

margin-left(左)

margin-right(右)

使用方式

margin:30px,表示上下左右外邊距都設定30px

**margin-left:30px,**表示設定距離左方30px

margin:10px 20px 10px 20px分別設定上右下左四個邊距,順序按照順時針方向

margin:20px 30px分別設定上下邊距為20px,左右邊距為30px

padding:內邊距

與margin類似 上下左右邊距都有

border:邊框

CSS基礎知識(下)

稍微複雜的樣式表中都可能存在兩條甚至多條規則同時選擇乙個元素的情況。css通過一種叫作層疊 cascade 的機制來處理這種衝突。層疊機制的原理是為規則賦予不同的重要程度。最重要的是作者樣式表,即由 開發者所寫的樣式。其次是使用者樣式表,使用者可以通過瀏覽器的設定選項,為網頁應用自己的樣式。排在最後...

CSS樣式表 基礎知識

css cascading style sheets,層疊樣式表 作用是美化html網頁。注釋 注釋語法 2.1.1 樣式表分類 1 內聯樣式表 和html聯合顯示,控制精確,但是可重用性差,冗餘多。例 內聯樣式表 2 內嵌樣式表 作為乙個獨立區域內嵌在網頁裡,必須寫在head標籤裡邊。3 外部樣式...

CSS基礎知識介紹 通過CSS控制文字樣式

定義文字顏色通過css設定字型 font family font variantfont family font size font variant 設定字型的變形 font weight font style 3.字型粗細與斜體 font weight font style font weight...