天天看點

css link和@import差別用法html head <link>标簽

1、link文法結構

<link href="CSSurl路徑" rel="stylesheet" type="text/css" />

實際應用截圖:

css link和@import差別用法html head <link>标簽

2、@import文法結構

1)、在html中

<style type="text/css">

@import url(CSS檔案路徑位址);

</style>

css link和@import差別用法html head <link>标簽

@import在html中使用截圖

2)、在css中

直接使用

css link和@import差別用法html head <link>标簽

import在CSS代碼或CSS檔案中使用截圖

本質上兩者使用選擇差別不大,但為了軟體中編輯布局網頁html代碼,一般使用link較多,也推薦使用link。

<a href="http://www.divcss5.com/rumen/r431.shtml" target="_blank"></a>

什麼是link标簽?

css link和@import差別用法html head &lt;link&gt;标簽

link執行個體

type 規定被連結文檔的 MIME 類,這裡是值為text/css

這樣就構成了一個完整的link标簽

注意link标簽因為不像&lt;head&gt;&lt;/head&gt;、&lt;html&gt;&lt;/html&gt;是一對的,解釋還需一個斜杠的标簽,這裡link樣式是放在&lt;link&gt;内的。

使用link引用網頁收藏夾圖示

收藏夾标簽樣式如下圖

css link和@import差別用法html head &lt;link&gt;标簽

favicon ico圖示截圖

ICO圖示引人代碼如下:

link 标簽的内容結構解釋

href 值為外部資源位址這裡是收藏夾圖示位址

rel 定義目前文檔與被連結文檔之間的關系,這裡是外部icon圖示屬性

type 規定被連結文檔的 MIME 類,這裡是值為image/x-icon

本文轉自wiwi部落格51CTO部落格,原文連結http://blog.51cto.com/wiwili/1968979如需轉載請自行聯系原作者

wiwili