CSS 顏色值的縮寫和字型的縮寫方法

2021-09-12 11:02:16 字數 2144 閱讀 8831

一、css顏色值的縮寫:

當設定的顏色是16進製制的色彩值時,如果每兩位的值相同,可以縮寫一半

例如:(1)p

可縮寫為:p

(2)p

可縮寫為:p

二、字型縮寫

例如:

body

可以縮寫為:

body

注意:1、在使用這一縮寫方式時,你至少需要指定font-size和font-family屬性,其

他的屬性(如 font-weight、font-style、font-variant、line-height)如未

指定將自動使用預設值。

2、在縮寫時 font-size 與 line-height 中間要加入「/」斜扛。

body

只是有字型大小、行間距、中文字型、英文本型設定。

font-style:italic;/*設定字型,italic為斜體,normal是顯示標準字型*/

font-variant:small-caps; /*把段落設定為小型大寫字母字型,normal

是預設值,顯示標準字型*/

font-weight:bold; /*定義粗體字元,normal為顯示標準字元*/

font-size:12px; /*設定字型的大小*/

line-height:1.6em; /*設定行間距,行高是1.6倍的文字大小,文字大小是

指父元素中設定的字型大小*/

font-family:"宋體",sans-serif;/*為段落設定字型*/

color:red;/*設定顏色*/

(1)font-variant

此屬性設定小型大寫字母的字型顯示文字,這意味著所有的小寫字母均會被轉換為大

寫,但是所有使用小型大寫字型的字母與其餘文字相比,其字型尺寸更小。

(2)font-weight

該屬性用於設定顯示元素的文字中所用的字型加粗。數字值 400 相當於 關鍵

字normal,700 等價於 bold。每個數字值對應的字型加粗必須至少與下乙個

最小數字一樣細,而且至少與下乙個最大數字一樣粗。

(3)font-style

該屬性設定使用斜體、傾斜或正常字型。斜體字體通常定義為字型系列中的乙個單

獨的字型。理論上講,使用者**可以根據正常字型計算乙個斜體字體。

(4)line-height

此屬性設定行間的距離(行高)。

注釋:不允許使用負值。

(5)font-family 規定元素的字型系列。

font-family 可以把多個字型名稱作為乙個「回退」系統來儲存。如果瀏覽器不支援

第乙個字型,則會嘗試下乙個。也就是說,font-family 屬性的值是用於某個元素

的字型族名稱或/及類族名稱的乙個優先表。瀏覽器會使用它可識別的第乙個值。

有兩種型別的字型系列名稱:

指定的系列名稱:具體字型的名稱,比如:"times"、"courier"、"arial"。

通常字型系列名稱:比如:"serif"、"sans-serif"、"cursive"、

"fantasy"、"monospace"

注意:使用某種特定的字型系列(geneva)完全取決於使用者機器上該字型系列是

列名作為

後路。

三、顏色值

在網頁中的顏色設定是非常重要,有字型顏色(color)、背景顏色(background-color)、邊框顏色(border)等,設定顏色的方式有多種

1.英文命令顏色

p2.rgb顏色

這個與photoshop中的rgb顏色是一致的,由r(red)、g(green)、b(blue)三種

顏色的比例來配色

pps:每一項的值可以是0~255之間的整數,也可以是0%~100%的百分數,

如:p3.十六進製制顏色

這種顏色設定方方法是現在普遍使用的方法,其原理其實也是rgb設定,但是

每一項的值由0~255變成了十六進製制00-ff

p

CSS縮寫優化CSS檔案的體積

web 可用性的關鍵指標是速度,更確切地說,是頁面能以多快的速度出現在訪問者的瀏覽器視窗裡。影響速度的因素有很多種,包括web伺服器的速度 訪問者的internet連線情況,以及瀏覽器必須 的檔案大小。儘管你無法控 務器和連線的速度,但是你可以控制構成 web頁面的檔案大小。為了讓 能夠更快,web...

縮寫(二) IT領域縮寫詞的發音

縮寫詞或縮略語在計算機和通訊領域非常普遍,如果發音不准,往往會給口頭交流造成一定的障礙,有時甚至會鬧笑話。通過 一般情況下,如果不知道怎麼讀乙個縮寫詞,可以逐個字母的讀。但是,it詞彙中有一些已經有約定俗成的讀法 一般是美語讀法 試舉一二 術語 802.11 發音 eight oh two dot ...

10 CSS的屬性縮寫

一些css屬性允許使用一串值代替許多屬性,值使用空格分開。margin,pdding和border width允許合併 margin top width,margin right width,margin bottom width等等,形式像這樣 property top right bottom ...