收集的22款給力的HTML5和CSS3幫助工具
我要評論1. CSS3 Selectors Test
在打開這個地址時,它會自動測試你當(dāng)前使用瀏覽器所支持的css屬性,然后用一個列表的形式給展示出來；你可以點擊列表中列出的每個項目來查看結(jié)果，包括一個小例子和相應(yīng)的解釋內(nèi)容。
2. CSS3 Please!
CSS3 Please!，制作人：Paul Irish and Jonathon Neal。目的在于允許你在線編輯其中任意的數(shù)值，然后你可以看右面大大的效果展示，每更改一下數(shù)值，就會產(chǎn)生相應(yīng)的全部代碼。
3. CSS3 Generator
允許你定制自己的CSS3效果。
4. CSS3 Transforms
你可以采用CSS3旋轉(zhuǎn)，縮放等處理HTML元素，研究CSS3的改動。 (Opera 10.5, Firefox 3.5 以及 Safari 4 和更高)
5. CSS3 Gradient Generator
這是一個可以在線修改css3漸變色彩的地方,無論是背景圖還是邊框都可以改變。
6. Border Radius
允許你設(shè)置圓角邊框。
7. Modernizr
Modernizr 是一個小而簡單的 JavaScript 庫,可以幫助你在現(xiàn)有的老式瀏覽器中充分利用新的web技術(shù)(CSS3,HTML5)。
這個簡單的CSS編輯器可以幫助你理解WebKit內(nèi)核瀏覽器對CSS3的支持情況。
9. CSS3 Previews
許多新的CSS3功能的預(yù)覽和演示。
10. CSS Template Layout Module
學(xué)習(xí)流行的CSS3模型和CSS3布局。
11. 5 Techniques to Acquaint You With CSS 3
學(xué)習(xí)CSS3最流行的新特性。
12. Web Browser CSS Support
這個文檔是一個標(biāo)準(zhǔn)的網(wǎng)絡(luò)瀏覽器對CSS的支持列表，非常詳細(xì)。
13. Font Drag
Font Dragr 是 HTML5/CSS3 驅(qū)動的用來測試自定義web字體的web應(yīng)用。允許你拖放你的ttf、otf、svg和woff格式字體，你可以查看他們的表現(xiàn)。
14. CSS3 Cheat Sheet
提供下載一份W3C中關(guān)于css3所包含完整的css屬性，選擇器類型和css3的允許的值列表的pdf文件。
一個純粹的JS CSS選擇器引擎。
16. Web Designers’ Browser Support Checklist
現(xiàn)實瀏覽器對HTML5和CSS3的支持。
17. CSS3 Color Names
CSS3 支持 147 種不同的顏色名字 (17個標(biāo)準(zhǔn)色加上130)。 這里列出了這些支持的所有顏色名字,RGB值和十六進制值。
18. HTML5 Visual Cheat Sheet
HTML 5 Visual Cheat Sheet 是一個有用的網(wǎng)頁設(shè)計者和開發(fā)表?；旧鲜且粋€簡單的所有html標(biāo)簽的清單。
19. HTML5 Demos And Previews
你可以查看HTML5演示，新的功能和瀏覽器的支持情況。
20. The Power Of HTML5 and CSS3
這份文章覆蓋了HTML5和CSS3的組合優(yōu)勢。
21. HTML5 Cheat Sheet
HTML5功能和有用的信息。
22. HTML5 Gallery
HTML5演示集合。
相關(guān)文章
CSS3 最強二維布局系統(tǒng)之Grid 網(wǎng)格布局
CS3的Grid網(wǎng)格布局是目前最強的二維布局系統(tǒng),可以同時對列和行進行處理,將網(wǎng)頁劃分成一個個網(wǎng)格,可以任意組合不同的網(wǎng)格,做出各種各樣的布局，本文介紹CSS3 最強二維布局系2025-02-27- 本文介紹了如何使用CSS3的transform屬性和動畫技巧實現(xiàn)波浪式圖片墻,通過設(shè)置圖片的垂直偏移量,并使用動畫使其周期性地改變位置,可以創(chuàng)建出動態(tài)且具有波浪效果的圖片墻,同2025-02-27
CSS3模擬實現(xiàn)一個雷達(dá)探測掃描動畫特效(最新推薦)
文章介紹了如何使用CSS3實現(xiàn)一個雷達(dá)探測掃描的效果,包括夜色背景、蜘蛛網(wǎng)盤、掃描體的轉(zhuǎn)動效果、尾巴陰影以及被掃描到的光點,通過HTML和CSS的配合,實現(xiàn)了豐富的動畫效果,2025-02-21- CSS3的Flexbox是一種強大的布局模式,通過設(shè)置display:flex可以輕松實現(xiàn)對齊、排列和分布網(wǎng)頁元素,它解決了傳統(tǒng)布局方法中的對齊、間距分配和自適應(yīng)布局等問題,接下來通過本2025-02-19
css3 實現(xiàn)icon刷新轉(zhuǎn)動效果
本文給大家介紹css3 實現(xiàn)icon刷新轉(zhuǎn)動效果，文章開頭給大家介紹了webkit-transform、animation、@keyframes這三個屬性，結(jié)合實例代碼給大家介紹的非常詳細(xì)，感興趣的朋友一2025-02-19- CSS3過渡屬性用于實現(xiàn)元素從一種樣式平滑過渡到另一種樣式,通過設(shè)置transition-property過渡屬性、transition-duration過渡時長transition-timing-function過渡函數(shù)和trans2025-02-19
CSS3實現(xiàn)動態(tài)旋轉(zhuǎn)加載樣式的示例代碼
本文介紹了如何使用CSS3創(chuàng)建一個簡單的動態(tài)旋轉(zhuǎn)加載樣式,通過定義一個帶有類名“l(fā)oader”的HTML元素,并使用CSS樣式和@keyframes規(guī)則來實現(xiàn)旋轉(zhuǎn)動畫,你可以根據(jù)需要調(diào)整樣式2025-02-19- 這篇文章主要介紹了如何使用CSS3的transition屬性實現(xiàn)平滑的過渡動畫，本文通過實例代碼給大家介紹的非常詳細(xì)，感興趣的朋友一起看看吧2025-02-13
CSS3中使用flex和grid實現(xiàn)等高元素布局的示例代碼
本文介紹了使用CSS3中的Flexbox和Grid布局實現(xiàn)等高元素布局的方法,通過簡單的兩列實現(xiàn)、每行放置3列以及全部代碼的展示,展示了這兩種布局方式的實現(xiàn)細(xì)節(jié)和效果，感興趣的朋2025-02-11- CSS3和SVG的結(jié)合使用為網(wǎng)頁設(shè)計帶來了創(chuàng)新的動態(tài)視覺效果,本文通過一個圓形進度條的動畫特效示例,展示了如何利用CSS3的動畫功能和SVG的矢量圖形能力來創(chuàng)建豐富的用戶交互體2024-10-24
