课程: HTML: Tables

今天就学习课程吧！

今天就开通帐号，24,700 门业界名师课程任您挑！

Reformat a table for responsive layout

Reformat a table for responsive layout - HTML教程

课程: HTML: Tables

开始一个月试用 购买团队方案

Reformat a table for responsive layout

“

- [Instructor] While a side scroll bar is okay for some tables, there are still a ton of drawbacks in terms of reading a table on a mobile device, especially for a larger table. Let's instead use CSS to make this table appear more like a report than a table when we get to smaller screens. Normally, when building this kind of code, we do what's called mobile first. That means that the mobile version of the code is the default outside of the media queries, while the larger screen CSS is hidden inside a media query. However, when you're doing this type of work with a table, it actually works better to use desktop first. In other words, the desktop styles are outside of the media query and the mobile version of this display will be inside the media query. The reason why is you'll wind up writing less code in the end, and it will be more straightforward to understand what's going on. You can, in fact, build your table this way using a desktop first approach, even if the rest of your site…

内容