css構文規則画面適応およびエントリ適用優先度

5704 ワード

1.
!importantは、指定したスタイルエントリの適用優先度を向上させます.
div { color: #f00 !important; color: #000;}上記コードでは、IE 6および以下のブラウザdivのテキスト色は#000である!importantは後のルールを上書きしていません.他のブラウザのdivのテキスト色は#f 00です
 
2.画面を適応させる方法:
/*スタイルコードインポートスタイルファイル*/
1つ目の方法:

2つ目の方法:

以下css 800とする.cssのコード
1 #container{

2     width:760px;

3     height:300px;

4     border:1px solid red;

5     background-color:red;

6 }

 
以下css 1280とする.cssのコード
1 #container{

2     width:1004px;

3     height:300px;

4     border:1px solid red;

5     background-color:red;

6 }

以下css 1440とする.cssのコード
1 #container{

2     width:1320px;

3     height:300px;

4     border:1px solid red;

5     background-color:red;

6 }

 
3つ目の方法:
 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>