隱私權聲明
本公司關心使用者隱私權與個人資訊,並遵守本公司的網站隱私政策,使用者若有任何問題,可以參考本公司的「網站隱私政策」,或利用電子郵件或連絡電話詢問本公司.
2015
05
25

響應式表格

關鍵字:網頁設計程式設計APP開發設計網頁設計作品PHP程式設計

為了因應行動裝置大量增加而出現的響應式網站,能夠在不同的裝置上提供最佳的視覺體驗,畫面的設計也十分彈性,對於現在架設網站的趨勢來說已經是非常普遍了,但有一些資訊的呈現,會因為響應式的考量而受到一些限制,像是最常見的就是表格問題了,該怎麼讓表格在手機這麼小的螢幕上,也能完好的呈現?讓使用者有良好的閱讀體驗。最近發現了兩個很不錯的網站,都是製作響應式表格的方法,在這裡提出來跟大家分享:
使用卷軸的方式:
http://gergeo.se/RWD-Table-Patterns/
就算在螢幕小的瀏覽器上,還是能夠使用捲軸清楚的比對資料,還可以選擇目前想看的資料有哪些,想隱藏的有哪些,還滿貼心的
(不過需掛上bootstrap的css、js)

表格變換的方式:
https://css-tricks.com/examples/ResponsiveTables/responsive.php
直接變換表格的型態,讓表格適用於較小的裝置

參考網址:
http://gergeo.se/RWD-Table-Patterns/
https://css-tricks.com/examples/ResponsiveTables/responsive.php
你可能有興趣的作品案例
傑立資訊傑立資訊事業有限公司
Powered by AWS Cloud Computing

電話:(02)2739-9096 | 傳真:(02)2739-6637 | 客服:[email protected] | 臺北市信義區和平東路3段257號6樓map

© 2019 傑立資訊 All rights reserved.| 網站隱私政策

線上詢價