資料結構
網路
關係型資料庫管理系統
作業系統
Java
MS Excel
iOS
HTML
CSS
Android
Python
C 程式設計
C++
C#
MongoDB
MySQL
Javascript
PHP
物理學
化學
生物學
數學
英語
經濟學
心理學
社會學
時尚研究
法律研究如何在 HTML 中編寫 CSS？
超文字標記語言 (HTML) 是一種廣泛使用的標記語言，用於建立網站。標記語言以構建網頁框架或骨架而聞名。此框架本身無法完全工作，應使用 CSS（層疊樣式表）進行設計。CSS 在網頁上工作，使其在視覺上更具吸引力，並根據個人需求定製網站。本文的目的是瞭解在 HTML 中編寫 CSS 的各種方法。雖然 CSS 程式碼和 HTML 程式碼可以分別編寫並相互連結（外部 CSS），但出於本文的目的，我們將討論其他方法。
使用的方法
CSS 程式碼可以方便地編寫在一個單獨的檔案中，然後連結到 HTML 檔案。但是，為了在 HTML 中整合和使用 CSS 樣式，有多種方法可用 -
內聯 CSS
內部 CSS
組合方法
內聯 CSS
內聯 CSS
內聯 CSS 涉及直接在 HTML 元素中使用“style”屬性。它可以快速、個性化地調整單個元素的樣式。
在 CSS 中，樣式根據其特異性來確定，可以表示為特異性分數。每種方法都具有獨特特異性分數，排名更高的樣式優先並在網站上顯示。值得注意的是，內聯 CSS 具有最高的特異性分數，會覆蓋可能存在的其他樣式。
雖然內聯 CSS 提供了一些優勢，例如其實現高度特定樣式的能力，但它也有一些缺點。由於其高特異性和可能與其他樣式發生衝突，管理內聯 CSS 可能會變得很麻煩。
演算法
開啟一個 HTML 檔案並編寫程式碼以列印文字。
透過在與文字相同的行中使用 style 屬性，可以更改顏色、背景顏色、字型大小和文字對齊方式。
要檢視更改，請儲存並檢查。
示例
<html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title> Understanding Inline CSS </title> </head> <body> <p style='color: rgb(84, 12, 12);' > Inline CSS is written in the same line as that of the element.</p> </body> </html>
內部 CSS
內部 CSS 或嵌入式 CSS 指的是在 HTML 檔案的 head 部分使用相同的“style”屬性編寫 CSS 程式碼。以這種格式管理和共享 CSS 程式碼很容易，但此方法的特異性分數低於內聯程式碼方法。
外部 CSS 和內部 CSS 之間的唯一區別在於，程式碼是在一個單獨的檔案中編寫然後在外部 CSS 中連結，而程式碼是在 head 標籤中的 style 標籤中編寫。
演算法
在 head 標籤中定義 style 標籤。
定義元素類或型別，並選擇所需的顏色、背景顏色、字型大小和文字對齊方式。
儲存檔案以檢查更改。
示例
<html lang="en">
<head>
<style>
h1{
color: black;
font-size: 150%;
}
</style>
</head>
<body>
<h1>Internal CSS is coded in the style tag of head tag.</h1>
</body>
</html>
組合方法
上面提到的兩種方法也可以組合起來產生所需的輸出，內聯技術可以用來定製一些文字，內部方法可以作為所有文字的通用框架。此方法被廣泛使用，因為它兼具兩者的優點，可以幫助生成理想的輸出。
演算法
在 head 標籤中定義 style 標籤。
定義元素類或型別，並選擇所需的顏色、背景顏色、字型大小和文字對齊方式。
儲存檔案以檢查更改。
示例
<html lang="en">
<head>
<style>
h1{
color: black;
}
h2{
color: #1319;
}
p{
color: #1984;
}
</style>
</head>
<body>
<h1>Greetings of the day</h1>
<p>Markup Languages are known for building frameworks or skeleton for a webpage. This framework cannot work entirely on its own and should be designed using Cascading Style sheets. CSS works on the webpages to make it visually appealing and to customize the website to individual’s needs.</p>
<p style="color: rgb(224, 189, 249);"> External CSS is also an option.</p>
</body>
</html>
結論
如本文所述，CSS 程式碼可以使用多種方法編寫。在選擇方法時，個人應注意其專案的需要，無論是小型簡單的專案還是大型耗時的專案。
內聯方式是快速為單個元素設定樣式和自定義的快捷方式，但此方法可能難以管理且繁瑣。另一方面，內部 CSS 則在 style 標籤的指定位置編寫，可以為許多類似型別的元素設定樣式，但此方法缺乏表現力。
總之，編寫 CSS 程式碼時應牢記特異性、結構和需求等因素。透過掌握在 HTML 中編寫 CSS 的技巧，Web 開發過程變得令人興奮和有趣。
115 次瀏覽
