html網頁css的三種引入方式
阿新 • • 發佈：2018-12-26
1，行間樣式表：給單獨的標籤新增樣式
語法：<div style="width:100px">內容</div>
缺點：程式碼只能應用在一個標籤中無法重複利用
程式碼演示：
<div style="width:300px;hight:300px;background:ponk;">內容</div>
2,內部樣式表
語法：在<head>標籤中新建<style>標籤中放入css樣式
例如：<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<!--
內部樣式表
-->
<style>
div{
width: 200px;
height: 300px;
background: pink;
}
</style>
</head>
<body>
<div>
123456
</div>
</body>
</html>
缺點：僅僅適用於當前網頁，如果遇到多個網頁就會很麻煩
3，外部樣式表
定義：所謂的外部樣式表就是將css檔案另存在一個以css結尾檔案中，在應用到css的html網頁中在<head>標籤中使用<link>單標籤將css的地址引用即可
例如：<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>我的css網頁</title>
<link rel="stylesheet" href="css.css" />
</head>
<body>
<div>
123456789
</div>
</body>
</html>
css檔案：div{
width: 100px;
height: 100px;
background: blue;
}
結果：
