一行CSS實現各種響應式元素 – Fluidity

3月 31, 2014

評論

Sponsor

FLUIDITY是一個極微小的CSS樣式表，壓縮版只有一行代碼，大小只有115個字節，它能實現圖像、文本、Canvas、Table表格以及iFrame框架的響應式功能。好用且實用！

這個響應式非常適合用于一般企業站或文章內容上，如果需要表單、layout等支持就需要那些響應式框架了，但那些文件實現太大了，如Bootstrap就已經100KB+了，所以我覺得夠用就好，下面一起來看看介紹。

FLUIDITY

響應式圖像

響應式table

響應式canvas元素

響應式iframe框架

使用方法

使用這個CSS是十分簡單的。

STEP1:引入CSS文件

在head內嵌入fluidity的css文件。

STEP2:HTML代碼

響應式圖像代碼

響應式table代碼

響應式iframe框架代碼

fluidity.css

下面我們也來看看fluidity.css里面的內容，其實就是2行css樣式，十分簡單吧？

img, canvas, iframe, video, svg { max-width: 100%; }

.overflow-container { overflow-y: scroll; }

推薦：查看最受歡迎的 301 個設計網站 → http://hao.shejidaren.com

交流：為設計新人提供的設計交流群，請加入UI設計交流群，分享經驗、接單、求職、聊設計。

贊助商鏈接

贊助商鏈接

喜歡這篇文章嗎？歡迎分享到你的微博、QQ群，并關注我們的微博，謝謝支持。

版權：除非注明，本站文章均為原創文章，轉載請聯系我們授權，否則禁止轉載。

{ 發表評論 }

姓 名 (必填)

郵 件 (必填)

網 站