css 媒体查询
2017-08-10 16:14
393 查看
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>媒体查询</title> <style> /*@media screen and (min-width: 1118px){}*/ .box{ width: 100px; height: 100px; } /*1366*/ @media screen and (min-width:1024px) and (max-width:1439px){ .box{ background: #ff76bc; } } /*1440*/ @media screen and (min-width:1440px) and (max-width:1600px){ .box{ background: #0b486b; } } /*1920*/ @media screen and (min-width:1601px) and (max-width:1920px){ .box{ background: #e1b700; } } </style> </head> <body> </body> <div class="box"> </div> </html>
相关文章推荐
- 移动端开发笔记--css媒体查询
- 关于CSS媒体查询--电脑尺寸大全
- CSS基础教程 -- 媒体查询屏幕适配
- 移动设备上的媒体查询 CSS media queries for mobile device
- css-@media媒体查询多个样式表
- css媒体查询来兼容
- 你用过媒体查询,或针对移动端的布局/CSS 吗?
- css媒体查询
- CSS@media媒体查询,实现简单的响应式布局
- css媒体查询之width
- CSS基础教程 -- 媒体查询屏幕适配
- 移动设备上的媒体查询 CSS media queries for mobile device
- css媒体查询移动优先和pc优先
- HTML/CSS: 通过媒体查询增加网页在设备上的兼容性
- 【2017-11-9】CSS 中的媒体查询
- 你用过媒体查询,或针对移动端的布局/CSS 吗?
- css媒体查询iphone4和iphone5
- HTML/CSS: 媒体查询
- 前端之路——第七篇:整理目前疑问点/css必会伪类选择器/css媒体查询
- HTML+CSS编写静态网站-37 媒体查询初探