優先級: 外部樣式 < 內部樣式表 < 內聯樣式表;
優先級,即:同名的選擇器右邊的會覆蓋左邊
1.內部樣式表
CSS Code復制內容到剪貼板
- <head>
- <style>
- /*內部樣式表,一般用於覆蓋公用樣式*/
- #headTip {
- color: 0xff5;
- }
- </style>
- </head>
2.使用link標簽,在文檔中聲明使用外接資源,最常用的一種方式。
css外部樣式表指定編碼的@CHARSET="utf-8"; 需要放在第一行。
XML/HTML Code復制內容到剪貼板
- <head>
- <link href="./my-common.css" rel="stylesheet" media="screen" type="text/css"/>
- </head>
3.@方式,引入css,注意這個是異步加載的,在整個html加載之後才加載,會導致頁面閃爍。不推薦使用。
CSS Code復制內容到剪貼板
- <head>
- <style>
- @import 'my-common.css';
- </style>
- </head>
4.內聯樣式表,優先級最高最直白,但不能復用不容易維護。
XML/HTML Code復制內容到剪貼板
- <body>
- <input type="text" style="color:0x550;font-size:30px;"/>
- </body>
以上就是小編為大家帶來的淺談css的四種書寫方式(必看篇) 全部內容了,希望大家多多支持~