CSS - @import的使用
更新於 發佈於 閱讀時間約 2 分鐘
@import可以將一個style sheet 導入另一個style sheet
example:
匯入式:
<style>@import url('/***.css')</style>
連結式:
顧名思義，就是創造一個css的stylesheet，然後進行連結(link)
<link rel=stylesheet type="text/css" href="***.css">
再來我們開啟***.css的頁面，再進行匯入
@import url('***.css')使用@import的好處在於我們能夠匯入已經製作好的stylesheet進以擴充自己的stylesheet。
以google fonts為例，譬如說我想使用poppins這個特殊字體我可以直接選擇我想要的樣式，直接匯入到我的stylesheet:
@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
poppins總共有18種風格，在這個範例，我將18種風格全選了，再依照css rule去指定你要的變化，以poppins Bold 700 italic為例：
* {font-family: 'Poppins', sans-serif;font-weight: 700;font-style: italic;}
最後出現的字體風格就會是Bold 700 italic。
讀取順位請將@import放在css頁面的最前列。
0會員
3內容數
留言0
查看全部
你可能也想看
Google News 追蹤
隨著理財資訊的普及，越來越多台灣人不再將資產侷限於台股，而是將視野拓展到國際市場。特別是美國市場，其豐富的理財選擇，讓不少人開始思考將資金配置於海外市場的可能性。
然而，要參與美國市場並不只是盲目跟隨標的這麼簡單，而是需要策略和方式，尤其對新手而言，除了選股以外還會遇到語言、開戶流程、Ap
嘿，大家新年快樂~ 新年大家都在做什麼呢？
跨年夜的我趕工製作某個外包設計案，在工作告一段落時趕上倒數。
然後和兩個小孩過了一個忙亂的元旦。在深夜時刻，看到朋友傳來的解籤網站，興致勃勃熬夜體驗了一下，覺得非常好玩，或許有人玩過了，但還是想寫上來分享紀錄一下~
CSS 是控制網頁外觀的語言，應用於網頁設計、UI/UX 設計、電子商務和移動應用開發。主要使用者包括前端開發者、UI/UX 設計師和網頁設計師。CSS 的特性有樣式控制、層疊優先級、響應式設計及分離內容與樣式。
本章節旨在教導讀者如何在 Kotlin 中引入套件。將會涵蓋如何引用第三方套件，如何引用自定義模組，以及如何創建和引用自定義套件。此外，還會列出一些常用的套件，以供讀者參考。
在Python中，import是一個關鍵字，用於將其他模組或套件中的程式碼引入到當前的程式中以供使用。
這個關鍵字允許你在你的程式中使用其他地方定義的變數、函式和類等。
當你使用import時，Python會搜索指定模組或套件的位置，並將其中的程式碼載入到你的程式中，這樣你就可以在程式中使用它們
什麼是 CSS 預處理器
CSS 預處理器是一種工具，使用專門的語法來生成 CSS 樣式表。市面上有許多 CSS 預處理器可供選擇，它們通常會提供一些純 CSS 中沒有的功能，例如變數、混入、巢狀選擇器等。這些功能可以使 CSS 結構更易讀、更易於維護，並提高開發效率。
為什麼使用 CSS 預處
這邊統整了關於 IMPORTRANGE 的一系列文章！IMPORTRANGE 是 Google 試算表裡面相當好用方便的函式，跟內建功能和函式結合，可以讓你更彈性地處理資料。
在 CSS 的開發過程中，重複使用如顏色、字體大小等值是常見的需求。為了提高程式碼維護性和靈活性，就需要用到 CSS 變量了，CSS 變量可以讓你在樣式表中儲存可重用的值。本文將介紹 CSS 變量的概念、使用方法，以及它對撰寫 CSS 的影響。
如何透過 CSS 來美化和增強文本的可讀性，對於提升用戶體驗至關重要。本文將介紹如何使用 CSS 來處理網頁上的文本，包括字型設定、文本排列、裝飾等多方面。
您對前端有興趣，對CSS不陌生。CSS新特性前應瞭解基本內容。CSS屬性制定經歷過程，瀏覽器私有前綴及處理，開發者對新特性漸進增強，優雅降級處理，Web標準定義、作用等。
隨著理財資訊的普及，越來越多台灣人不再將資產侷限於台股，而是將視野拓展到國際市場。特別是美國市場，其豐富的理財選擇，讓不少人開始思考將資金配置於海外市場的可能性。
然而，要參與美國市場並不只是盲目跟隨標的這麼簡單，而是需要策略和方式，尤其對新手而言，除了選股以外還會遇到語言、開戶流程、Ap
嘿，大家新年快樂~ 新年大家都在做什麼呢？
跨年夜的我趕工製作某個外包設計案，在工作告一段落時趕上倒數。
然後和兩個小孩過了一個忙亂的元旦。在深夜時刻，看到朋友傳來的解籤網站，興致勃勃熬夜體驗了一下，覺得非常好玩，或許有人玩過了，但還是想寫上來分享紀錄一下~
CSS 是控制網頁外觀的語言，應用於網頁設計、UI/UX 設計、電子商務和移動應用開發。主要使用者包括前端開發者、UI/UX 設計師和網頁設計師。CSS 的特性有樣式控制、層疊優先級、響應式設計及分離內容與樣式。
本章節旨在教導讀者如何在 Kotlin 中引入套件。將會涵蓋如何引用第三方套件，如何引用自定義模組，以及如何創建和引用自定義套件。此外，還會列出一些常用的套件，以供讀者參考。
在Python中，import是一個關鍵字，用於將其他模組或套件中的程式碼引入到當前的程式中以供使用。
這個關鍵字允許你在你的程式中使用其他地方定義的變數、函式和類等。
當你使用import時，Python會搜索指定模組或套件的位置，並將其中的程式碼載入到你的程式中，這樣你就可以在程式中使用它們
什麼是 CSS 預處理器
CSS 預處理器是一種工具，使用專門的語法來生成 CSS 樣式表。市面上有許多 CSS 預處理器可供選擇，它們通常會提供一些純 CSS 中沒有的功能，例如變數、混入、巢狀選擇器等。這些功能可以使 CSS 結構更易讀、更易於維護，並提高開發效率。
為什麼使用 CSS 預處
這邊統整了關於 IMPORTRANGE 的一系列文章！IMPORTRANGE 是 Google 試算表裡面相當好用方便的函式，跟內建功能和函式結合，可以讓你更彈性地處理資料。
在 CSS 的開發過程中，重複使用如顏色、字體大小等值是常見的需求。為了提高程式碼維護性和靈活性，就需要用到 CSS 變量了，CSS 變量可以讓你在樣式表中儲存可重用的值。本文將介紹 CSS 變量的概念、使用方法，以及它對撰寫 CSS 的影響。
如何透過 CSS 來美化和增強文本的可讀性，對於提升用戶體驗至關重要。本文將介紹如何使用 CSS 來處理網頁上的文本，包括字型設定、文本排列、裝飾等多方面。
您對前端有興趣，對CSS不陌生。CSS新特性前應瞭解基本內容。CSS屬性制定經歷過程，瀏覽器私有前綴及處理，開發者對新特性漸進增強，優雅降級處理，Web標準定義、作用等。