CSS基礎樣式

2021-08-14 18:30:58 字數 1691 閱讀 9552

css指層疊樣式表,它作用是控制頁面內容的外觀。這樣就可以將網頁的內容和表現形式分離。層疊的意思是 如果選擇器的權重相同,則後面元素的樣式會覆蓋前面樣式。

css樣式表由選擇器和宣告兩個部分組成,其中選擇器是通過名字來標識元素的,宣告用於定義元素的樣式。

a

樣式表比較常見的有三種引入方式

1.行內樣式

style="color:red">你好p>
2.內部樣式表

p 

style>

3.外部樣式表

"stylesheet"

type="text/css" href="my.css">

如果這三種方式都對某個內容增加了樣式,則優先順序順序是行內樣式表》內部樣式表》外部樣式表

css選擇器十分豐富,大致可以分為如下幾類,基礎選擇器,關係選擇器,屬性選擇器,偽類選擇器,偽物件選擇器。

css基礎選擇器

1.id選擇器

#id名稱

2.class選擇器

.class名稱
3.標籤選擇器

標籤名

優先順序 id選擇器》class選擇器》標籤選擇器》*

1.color 字型顏色

可以使用名稱,rgb,rgba,十六進製制來指定字型顏色

顏色名稱:

rgb: 即代表紅綠藍以這三種顏色拼出來。

rgba: 前面三個和rgb一樣,最後一位代表透明度。

十六進製制:

2.font-family 字型樣式

3.text-align 文字內容靠左,居中,靠右

4. background-color 背景色,預設是透明。如果同時設定背景,背景將覆蓋背景色之上

5. background-image 背景,通過url指定

body

style>

6.background-repeat 背景是否重複,預設值repeat

屬性值reapeat-x在橫向上平鋪, reapeat-y在縱向上平鋪,no-repeat不重複平鋪

7.background-size 背景大小,預設值(auto)真實大小

.img

前面是寬後面是高,只設定寬高度會自動匹配

8.background-position 相較於外部容器,背景的位置。預設值0% 0%相較於left和top

9.font-style 文字的字型樣式(正常或者斜體)

預設值normal 正常

italic 斜體

10.font-weight 字型的粗細

預設值normal 正常

lighter 細體效果和normal一樣

bold 粗體

bolder 也是粗體

數字也可以表示粗細,範圍100~900

11.font-size 字型的大小

通常通過畫素指定字型大小

CSS基礎樣式

顏色 單位 color 設定文字顏色 text align 設定文字對齊方式 letter spacing 字間距 line height 行高 text indent 首行縮排 text decoration 文字裝飾 text transform 大小寫轉換 text shadow 建立文字陰影...

css基礎樣式

5 float 6 position 定位 1.1給值方式 background 背景顏色 color 字型顏色 1.2 透明度 rgba 0 255 0 255 0 255 0 1 a代表透明度 0 1 0完全透明 1完全不透明 只針對當前設定顏色的內容透明opcity 0 1 標籤元素的透明度 ...

Css樣式基礎

1.css的語法 css的語法主要由兩個部分組成,乙個是選擇器,乙個是屬性 選擇器又分為以下幾種 1.元素選擇器 即html標籤去掉括號的就是元素 2.類選擇器 所謂的類就是說class 名稱 類的名稱是可以相同,也可以不同。呼叫的時候類名前面要加 3.id選擇器 名稱不能相同,具有唯一性。主要用於...