內部樣式表(是樣式與結構分離的一種表現，并未完全分離)
即在body中設定所有的樣式
<head>
<meta charset="utf-8"/>
<title>三</title>
<style type="text/css">
p{
color:red;
font-size:40px;
}
</style>
</head>
這里是在head中設定所有的p中的字體
引入外部檔案
為什么要引入外部css檔案
文本樣式追求的是樣式與文本分離，在文本標簽里直接設定文本樣式雖然方便，但這是樣式(css)與結構(html)耦合，并不方便后期維護，所以我們提倡樣式與結構分離，通過引入外部css檔案來為結構設定樣式
引入外部檔案 (樣式與結構完全分離)
引入語法：
<head>
<meta charset="utf-8"/>
<title>三</title>
<link rel="stylesheet" type="text/css" href="一.css"/>
</head>
引入外部樣式表的語法格式中 hrel和type中的輸入內容是固定的
href中寫的是要引入css檔案的相對路徑
題外話：路徑問題
路徑中
. . / 表示源檔案所在目錄的上一級目錄，. . /. . /表示源檔案所在目錄的上上級目錄，以此類推 即兩個緊挨著的點再緊挨著/符號
選擇下一級目錄直接寫下級目錄名加/就行
比如 . . /1/2/3.html
<!dectype html>
<html>
<head>
<meta charset="utf-8"/>
<title>三</title>
<style type="text/css">
p{
color:red;
font-size:40px;
}
</style> <!-- 內部樣式表 在head中設定所有的<p></p>中的字體 -->
<link rel="stylesheet" type="text/css" href="一.css"/>
<!-- 引入外部樣式表的格式hrel跟type中的是固定的
href寫的是要引入css檔案的相對路徑 -->
</head>
<body>
<h1>試試</h1>
<p>跌</p>
<p>跌</p>
<p>撞撞</p>
<p style="color:red;font-size:40px;">奔向你</p>
<!-- 也可在這里面直接設定（不推薦） -->
</body>
</html>
轉載請註明出處，本文鏈接：https://www.uj5u.com/qita/132158.html
標籤：其他