移动前端——通过CSS3 Media Queries实现相应式布局

发布时间:2020-06-28 18:07:22 作者:溢爱yun
来源:网络 阅读:446

一、关于Media Queries模块

   

     Media Queries模块,该模块允许添加媒体查询表达式,用以指定媒体类型,然后根据媒体类型来选择用该使用的样式。


二、Media Queries的使用方法


    @media 设备类型 and (设备特性) {样式代码}

        ——设备类型——常用all(所有设备)/screen(电脑显示器)/handheld(便携设备)

        ——设备特性——常用浏览器的宽度如:min-width:**px / max-width:**px;


三、关于safari


    由于safari在显示页面时是将窗口宽度作为980px进行显示的,因此在使用Media Queries模块时需在head内加入<meta name="viewport" content="width=device-width">,使页面按照相应的媒体类型样式显示。

 

 


推荐阅读:
  1. CSS3 媒体特性与Responsive设计属性
  2. CSS3中媒体特性的示例分析

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

css3 移动前端 ue

上一篇:部署zabbix监控mysql (一) 安装zabbix

下一篇:mysql不能连接服务器怎么办

相关阅读

您好,登录后才能下订单哦!

密码登录
登录注册
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》