Web Design
Mobile Internet
Brand Design
Innovative
News
Encyclopedias

如何發(fā)揮CSS 2.0的作用

Date:2014-07-29 Aource:尚品中國(guó) Type:網(wǎng)站百科
Word Size:small  medium  big

css應(yīng)用是本文要討論的重點(diǎn),也是向Web標(biāo)準(zhǔn)過(guò)渡的重要一環(huán)。相對(duì)于結(jié)構(gòu)設(shè)計(jì)來(lái)講,表現(xiàn)層的樣式設(shè)計(jì)變化更豐富,也更難掌握。對(duì)于千變?nèi)f化的網(wǎng)頁(yè)設(shè)計(jì),如何將設(shè)計(jì)編碼成機(jī)器能夠識(shí)別的樣式語(yǔ)言,也是CSS的1作重點(diǎn)。Css豐富的樣式表現(xiàn)也對(duì)設(shè)計(jì)者提出了更高的要求。這里針對(duì)向Web標(biāo)準(zhǔn)過(guò)渡的要求,先對(duì)CSS的編寫(xiě)提出一些建議與要求,而在后面章節(jié)才詳細(xì)探討這些內(nèi)容。

1.合理的CSS文件結(jié)構(gòu)
雖然CSS做到了樣式設(shè)計(jì)與內(nèi)容的分離,但CSS文件本身也應(yīng)該擁有良好的層次結(jié)構(gòu)及規(guī)范,目的是進(jìn)一步改替樣式設(shè)計(jì)的可維護(hù)性。CSS本身支持Import導(dǎo)入功能,針對(duì)大型網(wǎng)站設(shè)計(jì),不妨使用分離的CSS文件來(lái)組織樣式,比如將字體樣式專(zhuān)門(mén)使用font.css文件來(lái)編寫(xiě),表單設(shè)計(jì)則放到form.css文件中。通過(guò)合理地組織這些文件.可以帶來(lái)后期維護(hù)的便利性,也方便網(wǎng)站程序能夠根據(jù)瀏覽器版本或終端設(shè)備進(jìn)行文件調(diào)用,進(jìn)一步提升CSs跨平臺(tái)的應(yīng)川能力。

2.繼承與重用的優(yōu)勢(shì)
使用CSs的優(yōu)勢(shì)就在于其良好的重用特性,一段CSs設(shè)計(jì)代碼可以供多個(gè)區(qū)域同時(shí)使用。除了龜用功能外,CSs還可以實(shí)現(xiàn)類(lèi)似于而向?qū)ο蟪绦蛟O(shè)計(jì)中的繼承機(jī)制,通過(guò)繼承機(jī)制能夠進(jìn)一步地完善網(wǎng)站的樣式結(jié)構(gòu)。比如在CSs對(duì)應(yīng)的XHTML中,侮一級(jí)的標(biāo)簽總是首先使用其本身標(biāo)簽的樣式設(shè)計(jì),接著使用父級(jí)標(biāo)簽的樣式,這樣部分代碼就可以分別放在各級(jí)別中,它們互相發(fā)揮作用;統(tǒng)一代碼則放在最上一級(jí)標(biāo)簽里。通過(guò)這種具有繼承機(jī)制的功能運(yùn)用,我們能夠進(jìn)一步地減小樣式設(shè)計(jì)中的代碼量,并進(jìn)一步改稗設(shè)計(jì)方法。

3.設(shè)計(jì)跨平臺(tái)的代碼
CSS也有美中不足,由于不同品牌瀏覽器及不同版本之間的演染方式不同,各白對(duì)CSS的解析也存在著一定差異。一些老版本的瀏覽器(如IE4.0及IE5.0等),還有眾多不愿升級(jí)的用戶(hù)在使用,另外就是PC機(jī)F與MAC機(jī)下瀏覽器產(chǎn)品的不問(wèn).等等情況。針對(duì)這些原因,CSS設(shè)計(jì)也應(yīng)當(dāng)其有一定的跨平臺(tái)兼容特性,編碼時(shí)應(yīng)盡量減少生僻屬性的使用,如果想兼容舊版本的瀏覽器,也應(yīng)當(dāng)注意留有一定的CSS hack代碼。

4.具有良好可用性的Css樣式設(shè)計(jì)
可用性隨著計(jì)算機(jī)人機(jī)交互技術(shù)的發(fā)展不斷擴(kuò)充其內(nèi)容與形式??捎眯缘哪繕?biāo)是使我們的交互式產(chǎn)品(軟件、網(wǎng)站)對(duì)用戶(hù)的需求提供最大限度的滿(mǎn)足,使得產(chǎn)品更容易被用戶(hù)使用,它從根本.上改變用戶(hù)與產(chǎn)品交互的主觀過(guò)程,提升產(chǎn)品價(jià)值,為產(chǎn)品及用戶(hù)帶來(lái)雙方面的利益。CSS作為樣式設(shè)計(jì)代碼,也包含著可用性的設(shè)計(jì)內(nèi)容。
CSS樣式的設(shè)計(jì)意味著你對(duì)網(wǎng)站整體風(fēng)格的把握需要重新考慮,從視覺(jué)設(shè)計(jì)上為了達(dá)到最大限度的重用與合理的紡構(gòu),需要統(tǒng)一的字體、字號(hào)及排版形式,這些統(tǒng)一性的設(shè)計(jì)都有助于視覺(jué)設(shè)計(jì)卜可用性的提升。對(duì)于網(wǎng)站上的細(xì)節(jié)表現(xiàn),比如鏈接改變提示、鏈接區(qū)域、導(dǎo)航的操作感等,也都是CSS在可用性上設(shè)計(jì)的目標(biāo),最終目的就是希望通過(guò)良好的設(shè)計(jì),創(chuàng)造出更好的交互式網(wǎng)站.以便用戶(hù)使用,為網(wǎng)站及用戶(hù)創(chuàng)造價(jià)值。

5,使用基干DOM的腳本語(yǔ)言來(lái)編寫(xiě)交互
DOM的產(chǎn)生同樣是為了實(shí)現(xiàn)腳本語(yǔ)言的跨平臺(tái)與跨瀏覽器應(yīng)用。DOM (Document Object Model,文檔對(duì)象模型)是由W3C制定的一種與瀏覽器無(wú)關(guān)的接口,它能夠?qū)W(wǎng)頁(yè)中的標(biāo)準(zhǔn)組件(如HTML標(biāo)簽)做出技術(shù)性的統(tǒng)一規(guī)范,便腳本語(yǔ)言能夠訪問(wèn)的這些組件,前提是瀏覽器支持這種基于DOM的定義規(guī)范。
就目前來(lái)說(shuō),大部分瀏覽器都支持標(biāo)準(zhǔn)的DOM。使用符合DOM的腳本語(yǔ)言,基本上不再需要檢側(cè)瀏覽器的不同版本而去編寫(xiě)幾套不同的代碼,只要符合DOM的瀏覽器,相同的代碼就能夠完成所有可支持的操作.目前的javaScript是符合DOM標(biāo)準(zhǔn)的腳本語(yǔ)言.有關(guān)DOM的詳細(xì)資料,可以訪問(wèn)W3C的DOM專(zhuān)欄:http://www.w3.org/dom。
?

Please contact our consultant

+86 10-60259772

Please provide your contact number. The project manager of shangpin China will contact you as soon as possible.