bootstrap响应式布局及相关的visible-sm、hidden-xs等的使用
响应式布局:响应式工具不能用于table元素,而且 本身就不支持
响应式布局需要在
处添加如下语句:<meta name="viewport" content="width=device-width, initial-scale=1.0">
在css中添加如下内容 可以分别定制不同屏幕的显示样式:
/* 大屏幕 :大于等于1200px*/
@media (min-width: 1200px) { ... }
/*默认*/
@media (min-width: 980px){...}
/* 平板电脑和小屏电脑之间的分辨率 */
@media (min-width: 768px) and (max-width: 979px) { ... }
/* 横向放置的手机和竖向放置的平板之间的分辨率 */
@media (max-width: 767px) { ... }
/* 横向放置的手机及分辨率更小的设备 */
@media (max-width: 480px) { ... }
响应式布局辅助class:
以下这些可以通过媒体查询结合大型、小型和中型设备,实现内容对设备的显示和隐藏
上一篇:域名删除HSTS方法
下一篇:Typecho在文章中插入幻灯片的方法
文章评论 (0)