Web開發期待的CSS的一些功能
2024-07-11 08:21:27
供稿:網友
著名的 web 設計網站 css-tricks.com 最近組織了一次調查,請15名頂尖的 web 設計師對 css 提出自己的期望,15名設計師包括 jon hicks, wolfgang bartelme, mint 的 shaun inman 以及 stuff and nonsense 的 andy clarke。
調查結果顯示,最被期待的 css 功能是 css 圓角,其它期待的功能包括跨瀏覽器漸變與陰影,類似 photoshop 的層融合效果,更一致的聲明簡化語法以及對條件判斷的本地支持。這些期待中一部分已經包含在未來的 css-3 中,但更多的仍然只是一些夢想。
webmonkey 的編輯們將這個 wishlist 發表在他們的網站并讓 webmonkey 的讀者投票選出最熱門的項目,以下是按投票多少排列的 css wishlist 部分列表(只選取最熱門的項目)。
css 圓角
by webmonkey
標準的,直接基于 css 的圓角是很多人的期待,這樣,就不必再費盡心機只為了顯示一個圓角。
垂直居中
by michael lascarides
針對 block 對象的更容易的垂直居中設置。(div + css 讓人既愛且恨的一個重要原因就是垂直居中,讓一個對象垂直居中顯示在 block 容器中,且兼容所有主流瀏覽器簡直就是一個噩夢 - 譯者)
兼容所有主流瀏覽器的 css 2.1 與 css 3
by erik
能兼容所有主流瀏覽器的 css 2.1 與 css 3 是 erik 的夢想,但其中的某些功能在某些瀏覽器中總是磕磕絆絆。
更好的嵌入字體
by webmonkey
不要 sfir, 不要圖片,要真正的字體。
css 變量
by jeffrey jordan way, via css-tricks.com
能定義諸如色彩值一類的變量
更好地支持 100% height
by jlr
設置了 100% height 的容器的頂部和底部真正附著在頁首和頁尾,頁面中間部分匹配內容并準確顯示滾動條。搜索“100% height css”能找到各種解決方法,但事情原本不該這么復雜。
可重復使用變量
by neal lindsay
比如:
@var mycolor = #0080ff
h1 { color: mycolor; }
div.containbox { border: 1px mycolor; }
瀏覽器一致性與定義順序
by jml
瀏覽器一致性非常重要。某些 css 在某些瀏覽器被忽略或部分忽略使 css 只有借助 javascript 才能正常使用。同時,對里面的 css 定義應該可以覆蓋全局定義。
一句話復原
by chris pitzer
很多設計者要寫40多行代碼才能清除瀏覽器默認 css 定義,應當有一個簡單的聲明一次性將所有 css 復原,比如:
body { clear-default-styles:true; }
圖形旋轉與反轉
by stephen bell
在設置圖形圓角效果時候,我們需要同一個圓角圖片的4個旋轉版本來實現。應該有一個簡單的聲明實現旋轉,如:
img .horiz { rotate:90; }
成組的 css 簡化定義
by volkan görgülü, via css-tricks.com
如:
#foo h1, #foo h2, #foo h3
改為:
#foo [h1, h2, h3]
漸變
by anonymous
以避免一條線一條線地實現漸變。
定位計算
by anonymous
不使用 javascript 而是直接在 css 中實現:
left: id1.left + id1.width + 2px;
網格布局
by kurt krumme
table 布局曾經流行一時,因為 table 布局更接近網格布局的原理。css 的設置者們為什么要推出一個不倫不類的 box 模型?
div + css 在 web 設計界已經紅得發紫,盡管 div 有眾多缺陷(比如垂直居中,比如在 ie 中的眾多 bug),如果哪個設計師膽敢使用 table,被人查出源代碼,是會被恥笑的。然而譯者從不畏懼使用 table + css,且愿意告戒那些盲目追隨 div 并被折磨得半死的人,至少在目前,table 是被各種瀏覽器支持得最完美的容器對象。
使用 image 作 border
by anonymous
應當可以用 image 作為 border,如:
border-right: url('image.png')
支持多個背景圖
by brad
這個 css 功能非常有用,有了這個功能,完美實現 css 圓角就變得十分簡單了。
所有瀏覽器支持統一標準
by anonymous
這里特指 ie<8 的版本。css 有成型的標準,但有些瀏覽器一定要搞一些自己的東西出來。
以上來自cb。大師們的期望果然很獨特,相當多的期望也非常有用,如果實現了,web開發就是多么輕松愉快的一件事情啊!比如變量、清除定義和定位計算,是我認為非常有用的。目前ie下可以用一些ie特有的表達式,但用起來太復雜。
還是期望css3更好更強大。也期望各個瀏覽器盡快支持css3