less – CSS 本應如此簡單
- By Ka Yue Yeung
- Published 7 February 2010
- css
- Unrated
- | No. of Views: 35
除了 *, _ 等, 還有其它的 Hack, 在各種瀏覽器的運作狀況如何呢?
CSS 的 overflow 屬性
- By HKPUG .NET
- Published 5 June 2009
- css
- Unrated
- | No. of Views: 249
CSS Tricks 網站上 Chris Coyier 有一篇文章介紹 CSS 的 overflow 屬性,文章說,Overflow 的值可以是:visible (預設)、hidden、scroll 及 auto,它還有兩個「姊妹」屬性 overflow-x 及 overflow-y,但不是所有瀏覽器都支援。
可是這怎樣可以達成呢?CSS 本身並沒有所謂 Object 概念,其主要靠的是 Cascade,將 CSS Rules 一路堆疊下去。在這裏可以模擬到一點「繼承」特點,在同一個 tag 上使用多個 class (其實是 composition)。不過要真正做到很有規則,就要靠「自律」:自訂一些規則、實踐方法去跟從。
迄今為止,在這一章中所舉到的例子都是通過在主要樣式表中改變極少的屬性來創建替代樣式表。難道我們真的需要創建一個新的樣式表版本來替代嗎,還是只改變那些需要改變的?
上述解決替代式樣式表的方法對那些使用支援樣式表流覽器的用戶很好用,但對其他用戶呢?Internet Explorer中擁有最大的用戶群,它不支援所有的替代樣式表。我們怎樣使那些用該流覽器的用戶和其他流覽器的用戶都可以選到最適合他們需求的樣式表呢?
解決方案
用rel="alternative stylesheet"連接你的可選擇性樣式表並給它一個描述性的主題。標題將在流覽器的功能表中顯示,所以使用描述性的主題,如“high contrast”或“large text”對用戶是有很大的幫助的。您還應該給您的默認樣式表一個標題,以區別於可選擇樣式表
打開現有的主要樣式表並保存為print.css ,使之成為您的列印樣式表。為您的檔與列印媒體類型鏈結樣式表,像這樣:
創建列印風格
如果您已經保存您現有的樣式表為print.css ,您可以使用它來決定哪些需要改變,以創建列印樣式表。解決方案
我們可以為訪客創建特殊的列印樣式表,如:
![]()
CSS允許我們隔開介紹網站檔的結構和內容。這也就意味著訪客不能改變網站的設計風格。要麼是因為他們技術有限,如一些PDF和手機用戶,要麼是他們自身的優勢所導致的,如造福視障用戶的螢幕讀卡機仍然可以存取內容。然而,我們仍然可以為那些使用可支援CSS流覽器的用戶創造出更美的設計。
當隔開內容和結構以及考慮如何最好的設計基本檔的結構時,也就意味著使用不支援CSS的螢幕讀卡機和流覽器的用戶會更容易地理解你的網站。但你還需要瞭解其他那些可以看到你網站的設計又有無障礙環境需要的用戶。僅使用CSS來完成佈局目標並不能使每個人都喜歡你的網站。舉個例子,那些遭受某種程度視力喪失的人可以閱讀可被放大的文本。本章還包括使用替代樣式表,針對不同媒體的樣式表和基於JavaScript幫助下的流覽器。