在網(wǎng)頁設(shè)計中,網(wǎng)站建設(shè)布局領(lǐng)域,列表是很有意思的一個方面。列表中的項其實就是塊框,不過比起平常稍微多了一點,多出的這部分不屬于文檔布局,而只是“掛”在一邊。對于一個有序列表,額外的這部分包含一系列遞增的數(shù)字(或字母),這些數(shù)字(或字母)由用戶代理計算,并且主要由用戶代理格式化,而不是由創(chuàng)作人員完成。按文檔結(jié)構(gòu)的“指示”,用戶代理會生成這些數(shù)字并提供基本表示。
這種內(nèi)容生成在CSS1中是無法描述的,所以CSS1也無法控制,不過CSS2引入了一些特性,可以描述這種列表項編號,因此,現(xiàn)在css允許創(chuàng)作人員定義自己的計數(shù)模式和格式,而且可以將這些計數(shù)器與任何元素關(guān)聯(lián),而不只是有序列表。另外,利用這種基本機制還有可能向文檔中插入其他類型的內(nèi)容,包括文本串。屬性值,甚至外部資源。所以,完全可以使用css在設(shè)計中插入鏈接圖標、編輯符號等,而不必創(chuàng)建額外的標記。
要了解所有這些列表選項在網(wǎng)頁設(shè)計中如何加以利用,先來討論基本的列表樣式,然后再討論內(nèi)容和計數(shù)器的生成。
從某種意義上講,不是描述性文本的任何內(nèi)容都可以認為是列表。人口普査、太陽系,家譜、餐館菜單,甚至你的所有朋友都可以表示為一個列表或者是列表的列表。由于形式如此多樣,這使得列表相當(dāng)重要,所以說,網(wǎng)站建設(shè)中列表樣式不太豐富確實是一大憾事。
要影響一個列表的樣式,最簡單(同時支持最充分)的辦法就是改變其標志類型。例如,在一個無序列表中,列表項的標志(marker)是出現(xiàn)在各列表項旁邊的圓點。在有序列表中,標志可能是一個字母、數(shù)字或另外某種計數(shù)體系中的一個符號。甚至可以將標志替換為圖像。所有這些都可以使用不同的列表樣式屬性完成。
要修改用于列表項的標志類型,可以使用屬性list-style-type。
list-style-type
CSS2.1 值:
disc | circle | square | decimal | decimal-leading-zero | lower-roman | upper-roman | lower-greek | lower-latin | upper-latin | armenian | georgian | none | inherit
CSS2 值:
disc | circle | square | decimal | decimal-leading-zero | upper-alpha Ilower-alpha | upper-roman | lower- roinan | lower-greek | hebrew | armenian | georgian | Gjk-ideographic | hiragana | katakana | hiragana-iroha | none | inherit
初始值:
disc
應(yīng)用于:
display 值為list-item的元素
繼承性:有
計算值:根據(jù)指定確定
沒錯,這里的關(guān)鍵字確實不少,其中一些在CSS2中引入,但是在CSS2.1中已經(jīng)去除。
list-style-type屬性(以及所有其他與列表相關(guān)的屬性)只能應(yīng)用于display值為list-item的元素,不過CSS無法區(qū)別有序列表項和無序列表項。因此,完全可以設(shè)置一個有序列表使用實心圓而非數(shù)字作為列表項標志。實際上,list-style-type的默認值就是disc,所以可以得出結(jié)論,如果沒有顯式地聲明其他列表類型,所有列表(有序或無序)對各列表項都會使用實心圓作為標志。這是合理的,不過最終要由用戶代理來決定。盡管用戶代理沒有預(yù)定的規(guī)則,如{list-style-type: decimal;},但它可能會禁止對無序列表使用有序標志,反之亦然。不過不能依賴于此,所以一定要當(dāng)心。
對于hebrew和georgian等CSS2值,CSS2規(guī)范并沒有明確地指出這些計數(shù)體系如何工作,也沒有說明用戶代理應(yīng)當(dāng)如何處理。這種不確定性導(dǎo)致這些值在網(wǎng)站建設(shè)時未能廣泛實現(xiàn)。
如果想完全禁止顯示標志,只能使用值none。none會導(dǎo)致用戶代理在原本放標志的位置上不顯示任何內(nèi)容,不過它不會中斷有序列表中的計數(shù)。
當(dāng)前文章標題:網(wǎng)頁設(shè)計中的列表類型
當(dāng)前URL:http://51zuanshi.com.cn/news/wzzz/3030.html