CSS語法總結(jié)

changfeng1050 發(fā)布于2019-08-01 15:59 / 2198人閱讀

摘要：在學(xué)習(xí)的過程中，了解并掌握的語法是至關(guān)重要的，在這里總結(jié)一下相關(guān)的語法。一寫法代碼選擇器屬性名屬性值二寫在什么地方有三種方式，分別為行內(nèi)樣式，內(nèi)部樣式，外部樣式。

在學(xué)習(xí)CSS的過程中，了解并掌握CSS的語法是至關(guān)重要的，在這里總結(jié)一下相關(guān)的語法。

一、CSS寫法：

css 代碼

選擇器{
    屬性名：屬性值 
}

二、寫在什么地方：

有三種方式，分別為：行內(nèi)樣式，內(nèi)部樣式，外部樣式。

行內(nèi)樣式

直接寫在HTML標(biāo)簽內(nèi)，寫于style屬性當(dāng)中




    
    Document

內(nèi)部樣式

寫在頭部標(biāo)簽內(nèi)，置于style標(biāo)簽內(nèi)部




    
    Document

外部樣式

在head中用link標(biāo)簽引入，置于CSS文件中




    
    Document

css 代碼

.exp{
    height: 30px;
    width: 20px;
    background-color: #123456;
    box-shadow: 0 0 1px #132478;
}

三、注釋：

css 代碼

.exp{
    background: #123444;    /*背景色，注釋用此符號*/
    height: 90px;
    width: 80px;    //CSS中的注釋不能用此符號，和HTML有所不同
}

注：

在寫法上，瀏覽器的私有屬性放在前面，標(biāo)準(zhǔn)屬性放在后面。
私有屬性需要加前綴：加-webkit-，加-moz-，加-ms-，加-o-。

四、屬性值語法：

五、組合符號： 1、空格數(shù)量與順序必須保持一致

 <"font-size"> <"font-family">
 合法值：
 12px arial
 不合法值：
 12px   或者 arial 12px

2、&& 數(shù)量必須一致，順序隨意

 &&
 合法值：
 green 2px  或者  2em blue
 不合法值：
 blue  或者  5em

3、|| 必須出現(xiàn)一個，順序無關(guān)

 underline||overline||linethrough||blink
 合法值：
 underline  或者  overline underline

4、| 只能出現(xiàn)一個

 |transparent
 合法值：
 #123456  或者  transparent
 不合法值：
 #aabb33 transparent

5、[] 分組作用，作為整體

 bold [thin||]     合法值：
 bold thin  或者  bold 3px

七、數(shù)量符號： 1、無

     只能出現(xiàn)一次
 合法值：
 1px  或者  10em
 不合法值：
 1px 3em 5px

2、+ 可以出現(xiàn)一次或多次

 [,]+
 合法值：
 #fff,red,yellow  或者  blue,red 50%,black
 不合法值：
 #123456

3、？可出現(xiàn)，也可不出現(xiàn)

 inset？&&
 合法值：
 inset #123445  或  #abcd33

4、{} 基本元素可以出現(xiàn)幾次（最少出現(xiàn)幾次，最多出現(xiàn)幾次）

 {2,4}    最少出現(xiàn)兩次，最多出現(xiàn)四次
 合法值：
 1px 3em  或者  1px 3px 5em
 不合法值：
 3px

5、* 可以出現(xiàn)0次，1次或者多次

 [,]*
 合法值：
 1s     出現(xiàn)0次
 1s,5ms    出現(xiàn)1次

6、# 出現(xiàn)1次或多次，中間用”,"隔開

 #    相當(dāng)于    [,]*
 合法值：
 2s,4s,8s
 不合法值：
 2s 4s

八、@規(guī)則語法： 1、@標(biāo)識符 xxx; 2、@標(biāo)識符 xxx{} 常用的：

@media 響應(yīng)式布局
@keyframe 描述動畫的中間步驟
@font-face 引入外部字體

GPU云服務(wù)器云服務(wù)器年終總結(jié) 網(wǎng)絡(luò)總結(jié) 方法總結(jié) 函數(shù)總結(jié)

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://specialneedsforspecialkids.com/yun/50243.html

發(fā)表評論

登陸后可評論

0條評論

changfeng1050

男|高級講師

我要關(guān)注我要私信

TA的文章

【Pygame實戰(zhàn)】開心——消消樂，你樂，我樂，大家樂~

閱讀 2177·2021-11-25 09:43
ThinkPHP5實驗室預(yù)約管理系統(tǒng)

閱讀 2261·2021-11-24 09:39
.NET GC 實時監(jiān)控 dotnet-gcmon 介紹

閱讀 1550·2021-11-22 12:02
【數(shù)據(jù)結(jié)構(gòu)】鏈?zhǔn)蕉鏄浣Y(jié)構(gòu)的實現(xiàn)

閱讀 2990·2021-11-17 09:33
掃雷小游戲

閱讀 3415·2021-11-15 11:38
制作粉色少女系列?生日快樂祝福網(wǎng)頁?（HTML+CSS+JS）

閱讀 2732·2021-10-13 09:40
如何購買虛擬主機-該怎么選擇合適自己的云虛擬主機？

閱讀 1072·2021-09-22 15:41
一站式前端資源上傳工具

閱讀 1691·2019-08-30 10:58

国产xxxx99真实实拍_久久不雅视频_高清韩国a级特黄毛片_嗯老师别我我受不了了小说

資訊專欄INFORMATION COLUMN

上云采購季！| 2核2G4M爆款云服務(wù)器低至59元/年，更有多臺、長期優(yōu)惠，快來選購！

CSS語法總結(jié)

相關(guān)文章