本文目錄導讀：

1. 使用CSS導入語句
2. 使用HTML的link元素
3. 使用CSS的@media查詢

在網(wǎng)頁設計中，CSS外鏈的復用是一個重要的技巧，可以極大地提高開發(fā)效率和代碼的可維護性，如何實現(xiàn)CSS外鏈的復用呢？

使用CSS導入語句

在HTML文件中，可以使用@import語句導入其他CSS文件。

@import url('style.css');

這行代碼將導入名為style.css的CSS文件，通過這種方法，我們可以將多個CSS文件的內(nèi)容合并到一個HTML文件中，實現(xiàn)樣式的復用。

使用HTML的link元素

在HTML文件中，可以使用<link>元素來鏈接到外部CSS文件。

<link rel="stylesheet" href="style.css">

這行代碼將鏈接到名為style.css的CSS文件，與@import語句類似，這種方法也可以實現(xiàn)樣式的復用。

使用CSS的@media查詢

CSS的@media查詢可以用于根據(jù)不同的設備或視口大小應用不同的樣式。

@media (max-width: 600px) {
  body {
    background-color: lightblue;
  }
}

這段代碼將在視口寬度小于或等于600px的設備上應用背景顏色為lightblue的樣式，通過這種方法，我們可以為不同的設備或視口大小提供不同的樣式，實現(xiàn)樣式的復用和適應性。

CSS外鏈的復用可以通過使用CSS導入語句、HTML的link元素以及CSS的@media查詢來實現(xiàn)，這些技巧可以幫助我們提高開發(fā)效率和代碼的可維護性，同時使網(wǎng)站更加適應不同的設備和視口大小。