国产色在线视频-国产色综合一区二区三区-国产身材极品喷水 在线播放-国产深夜福利视频观看-国产深夜福利视频在线-国产深夜福利视频在线播放

網(wǎng)頁(yè)設(shè)計(jì)中設(shè)計(jì)自己的Reset.css,如何打造自己的Reset.css

2012/3/19 15:16:58   閱讀:2423    發(fā)布者:2423

  目前比較流行的有Eric Meyer的重置樣式和YUI的重置樣式。有趣的是,Eric的重置樣式也是源于YUI的。但同時(shí),糟糕的是,網(wǎng)上流傳的比較廣的(尤其是海內(nèi))都不是最新的版本。我個(gè)人的觀點(diǎn)是,假如你的設(shè)計(jì)本身就是白色背景,那么不要設(shè)置背景。 reset.css本意就是重置樣式,我始終建議把.clearfix放入layout.css,而把h1、h2之類的定義放進(jìn)typography.css。濫用不如不用,直接拿個(gè)現(xiàn)成的reset.css過(guò)來(lái)將導(dǎo)致后期各種離奇bug的發(fā)生

  設(shè)置成他們喜歡的背景色,好比淺藍(lán)色。本文就是來(lái)先容如何寫一個(gè)合適所有項(xiàng)目的通用的reset.css,以及先容在設(shè)置玩reset.css之后需要針對(duì)不同項(xiàng)目要首先要設(shè)置的內(nèi)容。上面兩個(gè)頁(yè)面里直接看到的都不是最新的,Eric專門為有一個(gè)reset.css頁(yè)面。

  原則上來(lái)說(shuō),也是不應(yīng)該設(shè)置文字顏色的。

  legend會(huì)默認(rèn)有自己的顏色(跟當(dāng)前的主題有關(guān))而不會(huì)繼續(xù)父元素的顏色(即便設(shè)了color:inherit;)。

  每每有新項(xiàng)目,第一步就是應(yīng)當(dāng)使用一個(gè)網(wǎng)站建設(shè)中reset.css來(lái)重置樣式。另有Condensed Meyer Reset簡(jiǎn)化Eric Meyer的樣式。一小部門中高水平的用戶,他們會(huì)自定義網(wǎng)頁(yè)默認(rèn)背景色。但不得不說(shuō),只會(huì)用“選項(xiàng)”來(lái)調(diào)背景色的用戶更多,不是么?而同時(shí),假如設(shè)計(jì)本身就有其他背景色,好比玄色、藍(lán)色、綠色之類的,OK,這些設(shè)計(jì)當(dāng)然可以設(shè)置背景色?;境R?jiàn)的瀏覽器都提供了這個(gè)簡(jiǎn)樸的功能。這里是重置樣式的地方,不是你設(shè)計(jì)的地方。

  從某些角度來(lái)說(shuō),可以想當(dāng)然地以為設(shè)置字體顏色人數(shù)遠(yuǎn)小于設(shè)置背景色的人數(shù);以及以為就算設(shè)置了背景色,人們看到legend元素是玄色的也不會(huì)覺(jué)得希奇。而那份簡(jiǎn)化版又把Eric的樣式簡(jiǎn)化回YUI的樣式了 。但是IE中的表單元素中l(wèi)egend這個(gè)對(duì)象比較特別,跟主題結(jié)合的比較緊密。而我們的背景色重置則會(huì)破壞用戶的選擇——盡管這樣能保證你的設(shè)計(jì)原汁原味的呈現(xiàn)給所有用戶。以上這些都可以作為參考資料來(lái)組織我們自己的reset。 OK,預(yù)備工作就差未幾了。但反過(guò)來(lái)說(shuō),把這個(gè)放到typography.css或者form.css里豈不是更好?不同的頁(yè)面設(shè)計(jì),其對(duì)legend的色彩要求很可能是不同的,放在reset.css里重復(fù)定義是沒(méi)有必要的。此外,我們還可以基于一些常見(jiàn)的框架,比較聞名的好比Blueprint或者Elements CSS Framework(這個(gè)的reset也是源自于Eric Meyer的)。請(qǐng)把你的設(shè)計(jì)放在更廣袤的土地上。因此,YUI在其reset中設(shè)置了legend {color: #000;}是無(wú)可厚非的。

  用戶自定義的更重要仍是你的設(shè)計(jì)更重要的題目。因此這條CSS規(guī)則可以作為在reset.css之后首先應(yīng)當(dāng)設(shè)置的規(guī)則。但請(qǐng)不要放進(jìn)reset.css里。當(dāng)然我知道,更高真?zhèn)€用戶會(huì)用Stylish之類的Firefox擴(kuò)展來(lái)自定義頁(yè)面。留意,本文把reset分成了兩個(gè)部門,一個(gè)是純r(jià)eset.css,可以用于任何項(xiàng)目。另一個(gè)是用于特定項(xiàng)目的“reset”,自定義修改的內(nèi)容,這些內(nèi)容可以放在layout.css、typography.css之類的文件中,他們共同導(dǎo)入到一個(gè)base.css形成一個(gè)項(xiàng)目的基礎(chǔ)樣式。我這里主要采用YUI,兼帶Eric的reset。所以最好仍是自己寫一個(gè)reset.css,并且要明白每一條reset都是用來(lái)做什么的。而YUI當(dāng)前版本(2.7.0)的reset.css實(shí)際地址里,比上面的頁(yè)面中還多一些東西。 詳細(xì)如何規(guī)劃網(wǎng)站CSS結(jié)構(gòu),不在文本討論之列,可以參考Smashing Magazine上的文章,海內(nèi)有差強(qiáng)人意的中文譯版。