欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识！
您现在的位置是： 首页  >  web前端

web中媒体查询的方法

程序员文章站 2022-03-17 22:57:18
...
定位布局

媒体查询的代码：

<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <style> .a {
    border: 1px solid #000000;
    width: 100px;
    height: 100px;
    background-color: #000000;
}
@media only screen and (min-width: 300px) and (max-width: 640px) {
    .a {
    background-color: red;
}
} @media only screen and (min-width: 700px) {
    .a {
    background-color: green;
}
} @media only screen and (max-width:200px ) {
    .a {
    background-color: blue;
}
} </style> </head> <body> <p class="a"></p> </body></html>

以上就是web中媒体查询的方法 的详细内容，更多请关注其它相关文章！

相关标签： web 方法 查询

上一篇： PHP如何自定义扩展（二）之钩子功能

下一篇： php中如何使用ImageMagick生成base64图片（代码）

推荐阅读