在前端開發中,引入CSS樣式表是很常見的操作。在HTML頁面中,我們可以使用<link>標簽或者<style>標簽引入CSS樣式表。不過,在某些情況下,我們可能需要使用import來引入CSS樣式表。
/* CSS樣式表文件:style.css */ body { background-color: #f5f5f5; }
使用import引入CSS樣式表的方式是:
@import url('style.css');
這樣,就可以將style.css文件中的樣式應用到當前的頁面中。需要注意的是,@import必須寫在樣式表的最上面,否則可能會導致樣式無法正常加載。
值得一提的是,使用import引入CSS樣式表的缺點是加載速度稍慢,因為每個@import都會發出一個HTTP請求。所以,在實際開發中,我們應該盡量避免過多的使用import,而是通過使用<link>標簽或者<style>標簽直接引入CSS樣式表。
<link rel="stylesheet" href="style.css"> <style> body { background-color: #f5f5f5; } </style>
除了上述幾種方法,還可以使用CSS預處理器(如LESS、Sass等)來管理CSS樣式表,提高代碼的可維護性和可讀性。