css3之@media
时间：6年前 阅读：4508
1、
<!DOCTYPE html>
<html>
<head>
<meta charset="{CHARSET}">
<title></title>
<style type=text/css>
/*only screen 仅限于屏幕设备*/
/*min 小的*/
/*max最大，当宽度是800px以下的时候*/
@media only screen and (max-width: 800px){
body{
background: red;
}
h1{
color: blue;
}
}
/*最小宽度801，也就是说屏幕是801以上*/
/*@media only screen and (min-width: 801px){
body{
background: purple;
}
h1{
color: yellow;
}
}*/
/*801px到900px这个范围*/
@media only screen and (min-width: 801px) and (max-width: 1000px){
body{
background: purple;
}
h1{
color: yellow;
}
}
/*901px以上*/
@media only screen and (min-width: 1001px) {
body{
background: green;
}
h1{
color: white;
}
}
</style>
</head>
<body>
<h1>期权记，学好的</h1>
</body>
</html>
本站声明:网站内容来源于网络,如有侵权,请联系我们https://www.qiquanji.com,我们将及时处理。
微信扫码关注
更新实时通知
网友评论