中文字幕二区_国产精品免费在线观看_黄色网站观看_人人草人人澡_日本真实娇小xxxx

您的位置: 首頁 > 技術(shù)文檔 > 網(wǎng)頁制作 > CSS的未來:一些試驗性CSS屬性
JScript 創(chuàng)建 .exe 或 .dll 文件 回到列表 不要告訴我你懂margin
 CSS的未來:一些試驗性CSS屬性

作者:vocal 時間: 2011-05-30 文檔類型:合作網(wǎng)站提供 來自:前端觀察

第 1 頁 CSS的未來:一些試驗性CSS屬性 [1]
第 2 頁 CSS的未來:一些試驗性CSS屬性 [2]
第 3 頁 CSS的未來:一些試驗性CSS屬性 [3]
第 4 頁 CSS的未來:一些試驗性CSS屬性 [4]
第 5 頁 CSS的未來:一些試驗性CSS屬性 [5]
第 6 頁 CSS的未來:一些試驗性CSS屬性 [6]
第 7 頁 CSS的未來:一些試驗性CSS屬性 [7]
第 8 頁 CSS的未來:一些試驗性CSS屬性 [8]

zoom: reset

通常來說,zoom是一個IE專用的屬性。但是webkit也開始支持它了,而且使用值reset,webkit可以實現(xiàn)不錯的效果(有趣的是,IE不支持這個值)。它讓你重設(shè)掉瀏覽器中正常的縮放行為——如果某個元素被聲明了zoom:reset,頁面上的其它元素在用戶放大頁面的時候都會跟著放大。

注:其實,我們常用來禁用chrome強制字體大小的時候用到的-webkit-text-size-adjust:none;也是可以實現(xiàn)類似的效果,不同的是,設(shè)置該屬性的元素內(nèi)的文字不會被放大/縮小,但是頁面上的其它元素則會變化——神飛

擴展閱讀: Safari Developer Library

-webkit-margin-collapse

這個屬性屬于限制級的,但是它還是非常值得關(guān)注。通常,兩個相鄰的元素的margin會折疊起來(collapse)。這意味著第一個元素的底部的邊距和第二個元素的頭部邊距會被合并到一起。

最常見的例子就是兩個相鄰的<p>元素會共享他們的margin值。想要控制這個表現(xiàn),我們可以使用-webkit-margin-collapse及其分拆后的-webkit-margin-top-collapse、-webkit-margin-bottom-collapse等屬性。默認值是collapse,值separate則停止共享margin值,也就是說,第一個元素的底部邊距和第二個元素的頭部邊距會正常疊加。

CSS的未來:一些試驗性CSS屬性

擴展閱讀: Safari Developer Library

-webkit-box-reflect

你還記得幾乎每個網(wǎng)站都把他們的網(wǎng)站logo或者頭部的文字做成倒影的那個年代嗎?謝天謝地,那個年代已經(jīng)過去了,但是如果你要在一些按鈕、導航、或者其他UI元素上更好的使用這個技術(shù),-webkit-box-reflect是更好的選擇。

這個屬性接受above、below、left和right四個關(guān)鍵詞,它們設(shè)置倒影的方向,它們和一個設(shè)置元素和它的倒影建的距離的數(shù)字一起使用。同時,蒙板圖片也是同樣支持的(看上面的-webkit-mask部分,不要搞混了哈)。倒影會自動生成并對布局沒有影響。下面的元素只用了CSS,第二個按鈕用了-webkit-box-reflect屬性。

CSS的未來:一些試驗性CSS屬性

示例

這個倒影會出現(xiàn)在它的父元素的下面并有5px的間距:

-webkit-box-reflect: below 5px;

這個倒影會投射到元素的右邊,沒有間距。然后,一個蒙板將會被應用(url(mask.png)):

-webkit-box-reflect: right 0 url(mask.png);

擴展閱讀: Safari Developer Library

出處:前端觀察
責任編輯:bluehearts

上一頁 CSS的未來:一些試驗性CSS屬性 [2] 下一頁 CSS的未來:一些試驗性CSS屬性 [4]

◎進入論壇網(wǎng)頁制作、WEB標準化版塊參加討論,我還想發(fā)表評論。

相關(guān)文章
5 個簡單實用的 CSS 屬性
css基礎(chǔ)教程屬性篇之四
css基礎(chǔ)教程屬性篇之三
css基礎(chǔ)教程屬性篇之二
css基礎(chǔ)教程屬性篇之一
作者文章 更多作者文章
firebug net面板詳解
CSS自定義滾動條樣式
Opera 11.10 增強對CSS3等的支持
微軟正式發(fā)布IE9
CSS3 target偽類簡介
關(guān)鍵字搜索 常規(guī)搜索 推薦文檔
熱門搜索:CSS Fireworks 設(shè)計比賽 網(wǎng)頁制作 web標準 用戶體驗 UE photoshop Dreamweaver Studio8 Flash 手繪 CG
站點最新 站點最新列表
周大福“敬•自然”設(shè)計大賽開啟
國際體驗設(shè)計大會7月將在京舉行
中國國防科技信息中心標志征集
云計算如何讓安全問題可控
云計算是多數(shù)企業(yè)唯一擁抱互聯(lián)網(wǎng)的機會
阿里行云
云手機年終巨獻,送禮標配299起
阿里巴巴CTO王堅的"云和互聯(lián)網(wǎng)觀"
1499元買真八核 云OS雙蛋大促
首屆COCO桌面手機主題設(shè)計大賽
欄目最新 欄目最新列表
淺談JavaScript編程語言的編碼規(guī)范
如何在illustrator中繪制臺歷
Ps簡單繪制一個可愛的鉛筆圖標
數(shù)據(jù)同步算法研究
用ps作簡單的作品展示頁面
CSS定位機制之一:普通流
25個最佳最閃亮的Eclipse開發(fā)項目
Illustrator中制作針線縫制文字效果
Photoshop制作印刷凹凸字體
VS2010中創(chuàng)建自定義SQL Rule
>> 分頁 首頁 前頁 后頁 尾頁 頁次:3/81個記錄/頁 轉(zhuǎn)到 頁 共8個記錄

藍色理想版權(quán)申明:除部分特別聲明不要轉(zhuǎn)載,或者授權(quán)我站獨家播發(fā)的文章外,大家可以自由轉(zhuǎn)載我站點的原創(chuàng)文章,但原作者和來自我站的鏈接必須保留(非我站原創(chuàng)的,按照原來自一節(jié),自行鏈接)。文章版權(quán)歸我站和作者共有。

轉(zhuǎn)載要求:轉(zhuǎn)載之圖片、文件,鏈接請不要盜鏈到本站,且不準打上各自站點的水印,亦不能抹去我站點水印。

特別注意:本站所提供的攝影照片,插畫,設(shè)計作品,如需使用,請與原作者聯(lián)系,版權(quán)歸原作者所有,文章若有侵犯作者版權(quán),請與我們聯(lián)系,我們將立即刪除修改。

您的評論
用戶名:  口令:
說明:輸入正確的用戶名和密碼才能參與評論。如果您不是本站會員,你可以注冊 為本站會員。
注意:文章中的鏈接、內(nèi)容等需要修改的錯誤,請用報告錯誤,以利文檔及時修改。
不評分 1 2 3 4 5
注意:請不要在評論中含與內(nèi)容無關(guān)的廣告鏈接,違者封ID
請您注意:
·不良評論請用報告管理員,以利管理員及時刪除。
·尊重網(wǎng)上道德,遵守中華人民共和國的各項有關(guān)法律法規(guī)
·承擔一切因您的行為而直接或間接導致的民事或刑事法律責任
·本站評論管理人員有權(quán)保留或刪除其管轄評論中的任意內(nèi)容
·您在本站發(fā)表的作品,本站有權(quán)在網(wǎng)站內(nèi)轉(zhuǎn)載或引用
·參與本評論即表明您已經(jīng)閱讀并接受上述條款
推薦文檔 | 打印文檔 | 評論文檔 | 報告錯誤  
專業(yè)書推薦 更多內(nèi)容
網(wǎng)站可用性測試及優(yōu)化指南
《寫給大家看的色彩書1》
《跟我去香港》
眾妙之門—網(wǎng)站UI 設(shè)計之道
《Flex 4.0 RIA開發(fā)寶典》
《贏在設(shè)計》
犀利開發(fā)—jQuery內(nèi)核詳解與實踐
作品集 更多內(nèi)容

雜⑦雜⑧ Gold NORMANA V2