中文字幕日韩精品一区二区免费_精品一区二区三区国产精品无卡在_国精品无码专区一区二区三区_国产αv三级中文在线

網(wǎng)頁設(shè)計中的系統(tǒng)字體和顏色

2022-05-28    分類: 網(wǎng)站建設(shè)

網(wǎng)站建設(shè)的絕大部分都是關(guān)于文檔的樣式,不過它還提供了很多有用的界面樣式工具,而不僅僅面向文檔。例如,Mozilla開發(fā)人員使用一種名為XUL的語言創(chuàng)建Mozilla瀏覽器(以及許多Mozilla產(chǎn)品)的界面。XUL就利用CSS和類CSS聲明來提供導航按鈕、邊欄頁、對話框、狀態(tài)框以及chrome本身的其他部分。

類似地,可以重用用戶默認環(huán)境的某些方面來設(shè)置文檔的字體和顏色樣式,甚至可以對焦點強調(diào)和鼠標光標施加影響。CSS2的界面功能會讓用戶有更愉快的體驗,不過如果使用不當,也可能造成用戶更混亂。

系統(tǒng)字體和顏色

有時你可能希望在網(wǎng)頁設(shè)計時自己的文檔能盡可能地模仿用戶的計算環(huán)境。如果你在創(chuàng)建基于Web的應用,目標是讓Web組件看上去是用戶操作系統(tǒng)中的一部分,這就是一個顯而易見的例子。盡管CSS2不允許在自己的文檔中重用操作系統(tǒng)外觀的任何一個方面,不過有一組豐富的顏色和有限的字體可供選擇。

系統(tǒng)字體

假設(shè)已經(jīng)創(chuàng)建了一個元素(例如通過JavaScript實現(xiàn)),其功能相當于按鈕。可以讓這個控件看上去就像是用戶計算環(huán)境中的一個按鈕,從而滿足用戶對控件外觀的期望,相應地使控件更為有用。為了達到這個目的,只需編寫以下規(guī)則:

a.widget {font: caption;}

這會為class為widget的所有元素設(shè)置字體,使之與有標題控件(如按鈕)中的文本使用同樣的字體系列、字體大小、字體加粗、字體風格以及字體變形。

CSS2定義了6個系統(tǒng)字體關(guān)鍵字。分別描述如下:

caption

由標題控件使用的字體樣式,如按鈕和下拉控件。

icon

操作系統(tǒng)圖標標簽所用的字體樣式,如硬盤驅(qū)動器。文件夾和文件圖標。

menu

下拉菜單和菜單列表中文本使用的字體樣式。

message-box

對話框中文本使用的字體樣式。

small-caption

由標題小控件的標簽使用的字體樣式。

status-bar

窗口狀態(tài)條中文本使用的字體樣式。

有一點很重要,要認識到這些值只能用于font屬性,它們本身就是簡寫形式。例如,假設(shè)一個用戶的操作系統(tǒng)將圖標標簽顯示為10像素的Geneva字體,而且沒有加粗、沒有斜體,也沒有小型大寫字母效果。這意味著以下3個規(guī)則都是等價的,其結(jié)果如下所示:

body {font: icon;}

body {font: 10px Geneva;}

body {

font-weight: normal;

font-style: normal;

font-variant: normal;

font-size: 10px;

font-family: Geneva;

}

因此像icon這樣一個簡單值實際上包含了很多其他的值。這在網(wǎng)站建設(shè)中很特別,所以使用這些值比平常要稍微復雜一些。

舉例來說,假設(shè)你希望使用圖標標簽的字體樣式,不過還希望將這個字體加粗,盡管用戶系統(tǒng)中的圖標標簽本身可能不是粗體。為此,需要按以下順序聲明規(guī)則:

body {font: icon; font-weight: bold;}

如果聲明按這個順序?qū)?,第一個聲明會讓用戶代理將body元素的字體設(shè)置為與圖標標簽一致,然后利用第二個聲明修改該字體的加粗。如果把順序倒過來,font聲明的值會覆蓋以上第二個聲明的font-weight值(譯注1[1]),這就會丟掉加粗聲明。簡寫屬性(如font)也是用類似的方式處理。

你可能想知道,為什么這里沒有通用字體系列,因為在設(shè)計網(wǎng)頁時,通常都建議創(chuàng)作人員指定字體時要采用類似Geneva, sans-serif;的形式(以防用戶瀏覽器不支持所指定的字體)。CSS 不要求“添加”通用字體系列,不過在這種情況下也沒有這個必要。如果用戶代理想要“抽取”計算環(huán)境中顯示某種元素所用的字體系列,就絕對能保證這種字體對瀏覽器一定可用。

如果所需的系統(tǒng)字體樣式不可用或者無法確定,用戶代理可以在一組近似的字體樣式中猜測。例如,可以這樣近似small-caption:取caption的字體樣式,再縮小字體的大小。如果無法做出這樣的猜測,用戶代理就應當使用一種“用戶代理默認字體”。


新聞名稱:網(wǎng)頁設(shè)計中的系統(tǒng)字體和顏色
本文路徑:http://www.rwnh.cn/news37/160087.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供電子商務靜態(tài)網(wǎng)站、品牌網(wǎng)站建設(shè)域名注冊、搜索引擎優(yōu)化品牌網(wǎng)站設(shè)計

廣告

聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時需注明來源: 創(chuàng)新互聯(lián)

成都app開發(fā)公司
湘潭县| 泉州市| 嵊泗县| 无锡市| 奉化市| 榆林市| 资阳市| 凤翔县| 井冈山市| 巴塘县| 抚松县| 河北区| 元氏县| 高雄市| 广安市| 祁门县| 遵义市| 平遥县| 水城县| 靖宇县| 九台市| 侯马市| 平阴县| 上高县| 双辽市| 庐江县| 祁阳县| 康平县| 本溪市| 安多县| 邵阳市| 于田县| 鄱阳县| 临夏县| 静安区| 湖州市| 河北省| 洞头县| 永州市| 曲麻莱县| 莆田市|