Bootstrap -- css的media属性
下面一段代码是实现:设备最大宽度为767px,当设备宽度大于767px背景色就是#000,否则就是#f00,代码如下:
<!doctype html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Media Queries</title> <style> body{background:#000;} @media (max-width:767px){body{background:#f00;}} <!-- 设备最大宽度为767px,当设备宽度大于767px就是#000,否则就是#f00 --> </style> </head> <body> </body> </html>
下面我们稍微扩展下media:
CSS Media属性
screen:指计算机屏幕。
print:指用于打印机的不透明介质。
projection:指用于显示的项目。
braille:盲文系统,指有触觉效果的印刷品。
aural:指语音电子合成器。
tv:指电视类型的媒体。
handheld:指手持式显示设备(小屏幕,单色)
all:适合于所有媒体。
郑重声明:本站内容如果来自互联网及其他传播媒体,其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。