【发布时间】:2013-08-23 10:20:43
【问题描述】:
我正在使用 Twitter Bootstrap 来响应式网站,但我不明白两者之间的区别
@media screen and (min-width: 768px)
@media(最小宽度:768px)
“屏幕”与否?有什么帮助吗?
【问题讨论】:
标签: css twitter-bootstrap
我正在使用 Twitter Bootstrap 来响应式网站,但我不明白两者之间的区别
@media screen and (min-width: 768px)
@media(最小宽度:768px)
“屏幕”与否?有什么帮助吗?
【问题讨论】:
标签: css twitter-bootstrap
http://www.w3.org/TR/CSS21/media.html#at-media-rule
@media screen 是电脑屏幕,所以
第一条规则仅适用于分辨率宽度至少为 768 像素的计算机屏幕。
第二条规则仅适用于宽度 >=768px 的设备,包括具有足够高分辨率的平板电脑、手机、打印机等。
【讨论】:
screen 是一种媒体类型,表示该规则将在计算机屏幕上使用。没有它,这只是一般规则,适用于所有媒体类型。
【讨论】:
浏览器将自己标识为“屏幕”类别。
规格 适用于特定媒体类型(“屏幕”)的设备,屏幕主要用于彩色计算机屏幕。所以它大致识别现代设备桌面智能手机等
因此它适用于不同分辨率的彩色计算机屏幕,例如
仅屏幕和(最小宽度:480px)
只有屏幕和(最小宽度:768px)
仅屏幕和(最小宽度:992px)
只有屏幕和(最小宽度:1280px)
【讨论】: