css入門教程資料(2)

2021-09-24 12:00:59 字數 1948 閱讀 6083

三.層疊樣式表的格式

一般來說,樣式表的宣告分為選擇符(selector)和塊{}(block),塊裡包含屬性(properties)和屬性的取值(value),基本格式如下:

選擇符

其它格式1:

選擇符1,選擇符2,選擇符3

有時候多個選擇符將使用相同的設定,為了簡化**,我們可以一次性為它們設定樣式,並在多個選擇符之間加上「,」來分隔它們。

當有多個屬性的時候,必須在兩個屬性之間用「;」來分隔。

其它格式2:

選擇符1 選擇符2

和格式1非常相似,只是在選擇符之間少加了「,」,但作用卻大不相同。表示如果選擇符2包括的內容同時包括在選擇符1裡的時候,所設定的樣式規則才起作用。

四.層疊樣式表的分類

為了使網頁的格式不過分的單調,必需讓相同的選擇符也能分類,並能按照不同的類別來進行不同的樣式設計。基本格式如下:

選擇符.類別名

類別名將可以在html的識別符號裡引用:

< 識別符號 class=類別名》網頁內容

五.層疊樣式表的偽類

除了上述的分類方式外,為了使分類的使用更靈活多樣,又產生了偽類的概念。類和偽類有什麼樣的區別呢?

一般地說,選擇符可以和多個類採用**的形式來設定,這樣雖然能夠為同乙個選擇符建立多種不同的樣式,但**的形式同時也限制了設定的類為其它的選擇符所使用。偽類的產生就是為了解決這個問題,每個預宣告的偽類都可以被所有的html識別符號引用,當然有些塊級內容的設定除外。基本格式如下:

.偽類名

偽類可以被任何識別符號在html裡引用。

《識別符號 class=偽類名》網頁內容

六.控制字型的樣式

控制字型的樣式包括控制字型型別、字型大小、字型風格、字型粗細四個部分。

1.字型型別

平時在使用word之類的字處理軟體的時候,經常需要調整字型的顯示,比如說「arial」、「impact」、「verdana」等字型都是筆者使用的較多的。

基本格式如下:

font-family: 字型名稱

注意:

·當指定多種字型時,用「,」分隔每種字型名稱。

·當字型名稱包含兩個以上分開的單詞時,用「」把該字型名稱括起來。

·當樣式規則外已經有「」時,用『』代替「」。

2.字型大小

基本格式如下:

font-size: 字型大小引數

字型大小的取值範圍:

·以point為單位:點單位在所有的瀏覽器和操作平台上都適用

·以em為單位:指字母要素的尺寸,和point相同距離

·以pixes為單位:畫素可以使用於所有的操作平台,但可能會因為瀏覽者的螢幕解析度不同,而造成顯示上的效果差異

·以in(英吋)為單位

·以cm(厘公尺)為單位

·以mm(公釐)為單位

·以pc(印表機的字型大小)為單位

·以ex(x-height)為單位

·smaller:比當前文字的預設大小更小一號

·larger:比當前文字的預設大小更小大號

·使用比例關係

·xx-small

·x-small

·small

·medium

·large

·x-large

·xx-large

3.字型風格

字型風格只能控制各種斜體字的顯示。

基本格式如下:

font-style: 斜體字的名稱

4.字型粗細

字型粗細控制粗體字的顯示,取值範圍從數字100~900,瀏覽器預設的字型粗細為400。另外可以通過引數lighter和bolder使得字型在原有基礎上顯得更細或更粗些。

基本格式如下:

font-weight: 字型粗細

css入門教程資料(2)

三 層疊樣式表的格式一般來說,樣式表的宣告分為選擇符 selector 和塊 block 塊裡包含屬性 properties 和屬性的取值 value 基本格式如下 選擇符 其它格式1 選擇符1,選擇符2,選擇符3 有時候多個選擇符將使用相同的設定,為了簡化 我們可以一次性為它們設定樣式,並在多個選...

css入門教程資料(2)

三 層疊樣式表的格式一般來說,樣式表的宣告分為選擇符 selector 和塊 block 塊裡包含屬性 properties 和屬性的取值 value 基本格式如下 選擇符 其它格式1 選擇符1,選擇符2,選擇符3 有時候多個選擇符將使用相同的設定,為了簡化 我們可以一次性為它們設定樣式,並在多個選...

CSS入門教程

css是 cascading style sheets 的簡稱,中文翻譯為 串接樣式表 也有人翻譯為 樣式表 css用以作為網頁的排版和風格設計,在web標準建站中,對css的熟悉和使用是相當重要的乙個內容。css的作用是彌補html的不足,讓網頁的設計更為靈活。這個文章只是為您介紹css的基礎應用...