css3中大于、小于,CSS3的媒体查询中max-width和min-width表示的值范围存在不确定性?...

尝试在使用css3媒体查询的时候,发现不管是max-width还是min-width 在表示范围的时候随着给定的数值不同会存在不确定性。

查阅 W3C官方文档 ,有这么一段话:

Most media features accept optional ‘min-’ or ‘max-’ prefixes to express "greater or equal to" and "smaller or equal to" constraints.

基本可以理解为

max-width 表示 小于等于

min-width 表示 大于等于

但是在谷歌开发者文档中又存在下面这样的定义,没有边界值,只取小于或大于:

bVblsqE?w=827&h=236

于是在FireFox中和Chrome中分别做了几组试验,在调试器改变视口尺寸,记录页面变化效果,得到以下数据

bVblsyr?w=609&h=574

媒体查询

body{

background-color:#0033FF;

}

@media screen and (min-width: 401px){

body{

background-color:#FFFF00;

}

}

my first @media

发现随着给定的数值不同,媒体查询所表示的范围也会变的不同,不是W3C所指的大于等于或者小于等于,发现并没有很明确的规律可循。

所以,有没有大牛可以解释一下?

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值