首頁技術(shù)文章正文

CSS是什么?CSS 樣式語法規(guī)范

更新時(shí)間:2021-12-07 來源:黑馬程序員 瀏覽量:

IT培訓(xùn)班

CSS是層疊樣式表( Cascading Style Sheets ) 的簡稱,有時(shí)我們也會(huì)稱之為CSS 樣式表或級(jí)聯(lián)樣式表。 CSS 是也是一種標(biāo)記語言,最早CSS的出現(xiàn),是為了補(bǔ)充HTML在頁面布局上的局限性,主要的使用場(chǎng)景就是美化網(wǎng)頁,用于設(shè)置HTML 頁面中的文本內(nèi)容(字體、大小、對(duì)齊方式等)、圖片的外形(寬高、邊框樣式、邊距等)以及版面的布局和外觀顯示樣式。CSS 讓我們的網(wǎng)頁更加豐富多彩,布局更加靈活自如。
CSS 最大價(jià)值: 由HTML 專注去做結(jié)構(gòu)呈現(xiàn),樣式交給CSS,實(shí)現(xiàn)了結(jié)構(gòu)( HTML ) 與樣式( CSS ) 相分離,讓前端開發(fā)更簡單。
使用HTML時(shí),需要遵從一定的規(guī)范,CSS也是如此。要想熟練地使用CSS對(duì)網(wǎng)頁進(jìn)行修飾,首先需要了解CSS樣式規(guī)則。CSS 規(guī)則由兩個(gè)主要的部分構(gòu)成:選擇器以及一條或多條聲明。
  • 選擇器是用于指定CSS樣式的HTML標(biāo)簽,花括號(hào)內(nèi)是對(duì)該對(duì)象設(shè)置的具體樣式
  • 屬性和屬性值以“鍵值對(duì)”的形式出現(xiàn)
  • 屬性是對(duì)指定的對(duì)象設(shè)置的樣式屬性,例如字體大小、文本顏色等
  • 屬性和屬性值之間用英文“:”分開
  • 多個(gè)“鍵值對(duì)”之間用英文“;”進(jìn)行區(qū)分
所有的樣式,都包含在 <style>標(biāo)簽內(nèi),表示是樣式表。 <style>一般寫到 </head>上方。
<head>
<style>
   h4 {
    color: blue;
    font-size: 100px;
   }
</style>
</head>
<head>
<style>
   h4 {
    color: blue;
    font-size: 100px;
   }
</style>
</head>
CSS的代碼風(fēng)格

1. 樣式格式書寫

①緊湊格式

h3 { color: deeppink;font-size: 20px;}

②展開格式

h3 {
    color: pink;
    font-size: 20px;
}

強(qiáng)烈推薦第二種格式,因?yàn)楦庇^。
2. 樣式大小寫

h3 {
    color: pink;
}
H3 {
    COLOR: PINK;
}

強(qiáng)烈推薦樣式選擇器,屬性名,屬性值關(guān)鍵字全部使用小寫字母,特殊情況除外。
3. 空格規(guī)范

H3 {
    color: pink; 
}

注意:①屬性值前面,冒號(hào)后面,保留一個(gè)空格
           ②選擇器(標(biāo)簽)和大括號(hào)中間保留空格
以下代碼書寫風(fēng)格不是強(qiáng)制規(guī)范,在實(shí)際開發(fā)中,符合實(shí)際開發(fā)書寫方式為前提。




猜你喜歡:

CSS如何裝飾文本、定義文本屬性?

H5和CSS3的新特性有哪些?

CSS 三大特性:層疊性、繼承性、優(yōu)先級(jí)

css unicode字體是什么?

黑馬程序員web前端開發(fā)培訓(xùn)

分享到:
在線咨詢 我要報(bào)名
和我們?cè)诰€交談!