标签:
1.
!important 提升指定样式条目的应用优先权。
div {
color: #f00 !important;
color: #000;
}
在上述代码中,IE6及以下浏览器div的文本颜色为#000,!important并没有覆盖后面的规则;其它浏览器下div的文本颜色为#f00
2.可以让屏幕自适应的方法:
/* 样式代码导入 样式文件 */
第一种方式:
<link media="screen and (width:800px)" rel="stylesheet" href="style/css800.css">
<link media="screen and (width:1280px)" rel="stylesheet" href="style/css1280.css">
<link media="screen and (width:1440px)" rel="stylesheet" href="style/css1440.css">
第二种方式:
<style>
@import url(style/css800.css) screen and (min-width:800px);
@import url(style/css1280.css) screen and (min-width:1280px);
@import url(style/css1440.css) screen and (min-width:1440px);
</style>
如下为css800.css的代码
1 #container{ 2 width:760px; 3 height:300px; 4 border:1px solid red; 5 background-color:red; 6 }
如下为css1280.css的代码
1 #container{ 2 width:1004px; 3 height:300px; 4 border:1px solid red; 5 background-color:red; 6 }
如下为css1440.css的代码
1 #container{ 2 width:1320px; 3 height:300px; 4 border:1px solid red; 5 background-color:red; 6 }
第三种方式:
1 *{ 2 margin:0; 3 border:0; 4 padding:0; 5 } 6 #container{ 7 width:1240px; 8 height:300px; 9 background-color:red; 10 margin:0 auto; 11 } 12 13 /* 当屏幕的分辨率宽度小于等于1260px时,执行如下样式代码 */ 14 @media (max-width:1260px) { 15 #container{ 16 width:930px; 17 background-color:green; 18 } 19 } 20 21 /* 当屏幕的分辨率宽度小于等于800px时,执行如下样式代码 */ 22 @media (max-width:800px) { 23 #container{ 24 width:760px; 25 background-color:blue; 26 } 27 } 28 29 </style>
标签:
原文地址:http://www.cnblogs.com/lsr111/p/4395066.html