當前位置:編程學習大全網 - 編程語言 - css的基本語法結構及規範

css的基本語法結構及規範

壹、CSS簡介

CSS(Cascading Style Sheet)層疊樣式表,它是用來美化頁面的壹種語言,之前提到的W3C規範中的“樣式”。

作用:

1、美化界面。

2、頁面布局。

基本語法:

選擇器{

樣式規則

}

樣式規則:

屬性名1:屬性值1;

屬性名2:屬性值2;

屬性名3:屬性值3;

。。。

選擇器:是用來選擇標簽的,選出來以後給標簽加樣式。

從Hello World說起,

<p style="background-color:#FFF;color:#000;font-size:30px;">Hello World!</p>

這樣寫可以實現將原本的白底黑字Hello World! 改成樣式為 黑底白字的效果。但是這樣寫有壹定的缺點:

缺點1:內容、樣式、行為三者未分離,代碼糅雜,不符合W3C規範,難以維護。

缺點2:代碼冗余,不可復用。

二、如何引入CSS?

1)行內樣式

即上述的壹般形式,由於其存在的缺點,介紹下壹種樣式。

2)內嵌樣式,給p標簽加樣式,加在head標簽中

<style type="text/css">

p{

background-color:#FFF;

color:#000;

font-size:30px;

}

</style>

當本頁面的p標簽都需要相同的樣式時,這樣寫大大降低了代碼量,並讓其他編程人員壹眼分辨出來CSS樣式。

3)鏈接樣式(鏈入式)

在head標簽中加入

<link href="../css/my.css" type="text/css" rel="stylesheet"/>

將CSS文件和html文件分開來放,這樣增加了代碼的重用性,但是每個瀏覽器都要單獨讀取css文件中的樣式,比較慢,如果追求速度,內嵌樣式會更好。

4)導入樣式

<style type="text/css">

@import url("路徑名");

</style>

四種樣式的優先級:

如果壹個頁面中四種樣式同時存在,這四種都會對標簽起作用,但是重復樣式的屬性值,只有最後壹個有效。如果內嵌樣式和導入樣式放在壹起,則內嵌樣式起作用。

如果內嵌樣式和導入樣式分成兩個style定義,則在CSS樣式中的最後壹個style起作用。

附:css中註釋的格式,沒有單行註釋,所有的註釋均是/*註釋內容*/

  • 上一篇:西安編程課哪個機構最好
  • 下一篇:急求數控鋼筋調直切斷機操作規程
  • copyright 2024編程學習大全網