美文网首页
自适应网站

自适应网站

作者: 无忧草_ee81 | 来源:发表于2019-06-12 09:17 被阅读0次

    什么是自适应网站?

    指的是网页通过不同尺寸不同终端设备访问可以自适应显示,根据屏幕大小、宽度自动调整布局,自适应也可以叫响应式。自适应、响应式是HTML5新技术。

    为什么需要自适应网页设计?

    时代在进步,不断涌现的各种新型设备(手机/平板电脑)、平台和浏览器都需要你的网站的网页能够兼容显示。自适应网页设计代表了一种必然的设计趋势。

    注意:自适应网站浏览器硬性要求IE9及以上

    为了确保适当的绘制和触屏缩放,需要在 <head> 之中添加 viewport 元数据标签。

    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    

    栅格系统

    栅格参数
    实例

    布局容器

    • .container 类用于固定宽度并支持响应式布局的容器。
    <div class="container">
      ...
    </div>
    
    • .container-fluid 类用于 100% 宽度,占据全部视口(viewport)的容器。
    <div class="container-fluid">
      ...
    </div>
    

    相关文章

      网友评论

          本文标题:自适应网站

          本文链接:https://www.haomeiwen.com/subject/omxkfctx.html