签到
Home
Android
iOS
C++
Article
搜索
登录
注册
正确利用@media screen and制作响应式布局
Home
/
Article
MrLee
2015-6-25
5022
开始研究响应式web设计,CSS3 Media Queries是入门。 Media Queries,其作用就是允许添加表达式用以确定媒体的环境情况,以此来应用不同的样式表。换句话说,其允许我们在不改变内容的情况下,改变页面的布局以精确适应不同的设备。 那么,Media Queries是如何工作的?
screen
是媒体类型里的一种,CSS2.1定义了10种媒体类型
and
被称为关键字,其他关键字还包括
not
(排除某种设备),
only
(限定某种设备)
(min-width: 1366px)
就是媒体特性,其被放置在一对圆括号中。
举例说明:
[css]@media screen and (max-width:1366px){.right_link_box{float:left;width:100%}}[/css]
网上有些文章,没有讲解清楚甚至错了,只是简单说小于1366就执行括号里面的代码。很多朋友看到max-width不应该是大于吗?其实是这样的,max的意思是最大,max-width表示最大值为1366,也就是<=1366,不超过这个值!相反,如果是min-width表示最小值为1366,也就是>=1366都会执行。
本文链接:
https://it72.com/3576.htm
收藏
0
收藏的用户(
0
)
X
正在加载信息~
推荐阅读
Notepad++用插件TextFX批量删除换行
WordPress终极加速方案,无需插件,页面执行提升到0.0x秒
7.9日微软推出一个新的Windows10预览版
12306 密码泄露查询
解决Win10正式版注册表无法编辑
天很热,我经常喝水,一直忘记自己买个杯子
Notepad++ 16进制编辑功能
【软件多开】多用户远程桌面-RDPWrap
知名色情网站Brazzers 80万用户数据遭泄露
程序语言代码行数统计
最新回复
(
0
)
返回
站点信息
文章
2321
用户
1336
访客
12112155
每日一句
Kitchen steam blurs the window, painting warmth on the cold glass.
厨房的蒸汽晕染了窗,在寒冷的玻璃上画下温暖。
OpenCV质心跟踪
亲测!虚拟机VirtualBox安装MAC OS 10.12图文教程
jQuery的load方法Cannot read property 'indexOf' of undefined
HSV颜色检测
MPAndroidChart曲线非连续改装笔记
《闲来麻将》搭建教程
Android超简单时间轴的实现
使用Python构建一个简单的自动登录功能
解决android studio "found an invalid color"的问题
This function has none of DETERMINISTIC, NO SQL, or READS SQL DATA in its de
免费xiuno博客主题【最后更新:2019.5.20】
独家发布最新可用My-AutoPost——wordpress 采集器
C#实现后台最小化截图
仙剑奇侠传3d回合-PC端多开
如何在iPhone上移动多个应用程序
首发:Thinkpad T550黑苹果10.13.4安装教程
css样式之flex布局注意事项
Android屏幕共享及远程控制【免root】
MPAndroidChart曲线非连续改装笔记
ASUS TF810C平板电脑用U盘安装windows8.1系统
新会员
南北在南
Trya
龙祖
Yan
每天前进
/llx
。我是蓝
小满哥
Airh
南宁枫桥
同尘
Chil
好久不见
中国网建
UilT
蒋林斌(