##### 1 CSS的引入方式 CSS樣式有三種不同的使用方式,分別是行內樣式,嵌入樣式以及鏈接式。我們需要根據不同的場合不同的需求來使用不同的樣式。 - 行內樣式 行內樣式,就是寫在元素的style屬性中的樣式,這種樣式僅限於元素內部起作用。當個別元素需要應用特殊樣式時就可以使用內聯樣式。但不推 ...
1 CSS的引入方式
CSS樣式有三種不同的使用方式,分別是行內樣式,嵌入樣式以及鏈接式。我們需要根據不同的場合不同的需求來使用不同的樣式。
- 行內樣式
行內樣式,就是寫在元素的style屬性中的樣式,這種樣式僅限於元素內部起作用。當個別元素需要應用特殊樣式時就可以使用內聯樣式。但不推薦大量使用內聯樣式,因為那樣不利於後期維護。 - 嵌入式
嵌入式,是把CSS樣式寫在HTML文檔內部head標簽中的style標簽里。瀏覽器載入HTML的同時就已經載入了CSS樣式了。當單個文檔需要特殊,單獨的樣式時,可以使用內部樣式表。 - 鏈接式
鏈接式,就是把CSS樣式寫在HTML文檔的外部,一個尾碼為 .css 的外部樣式表中,然後使用時在head標簽中,使用link標簽的href屬性引入文件即可。當CSS樣式需要應用在很多頁面時,外部樣式表是最理想的選擇。在使用外部樣式表的情況下,我們可以通過改變一個文件來改變這所有頁面的外觀。
common.css
div{
color: white;
background-color: #369;
text-align: center
}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>css的引入方式</title>
<!-- 鏈接式-->
<link rel="stylesheet" href="common.css">
<!-- 嵌入式-->
<style>
p{
color: darkseagreen;
}
</style>
</head>
<body>
<div>故人西辭黃鶴樓</div>
<div>煙花三月下揚州</div>
<p>君不見黃河之水天上來,<br>奔流到海不復回.</p>
<!-- 行內樣式-->
<div style="color: white;background-color: #369;text-align: center">行內設置</div>
</body>
</html>
本文來自博客園,作者:生而自由愛而無畏,轉載請註明原文鏈接:https://www.cnblogs.com/zczhaod/p/17640324.html