<html>
<head>
<title>內聯CSS樣式</title>
</head>
<body>
內聯CSS樣式：直接把樣式寫在某個標記內（作為style屬性）
<br/>
<H1 STYLE="color: orange; font-family: impact">Stylesheets: The Tool of the Web Design Gods</H1>
</body>
</html>
二、內部內建樣式
<HTML>
<HEAD>
<TITLE> 嵌入CSS樣式 </TITLE>
<STYLE TYPE="text/css">
H1 { color: green; font-family: impact }
</STYLE>
</HEAD>
<BODY>
嵌入CSS樣式：把樣式定義在<head></head>標記中
<H1>Hello,CSS!</H1>
<H1>Stylesheets: The Tool of the Web Design Gods</H1>
<H2>Stylesheets: The Tool of the Web Design Gods</H2>
</BODY>
</HTML>
三、 外部連結樣式
<HTML>
<HEAD>
<TITLE> 外部連結CSS樣式 </TITLE>
<LINK REL="stylesheet" HREF="mystyles.css" TYPE="text/css">
</STYLE>
</HEAD>
<BODY>
<H1>Hello,CSS!</H1>
<H1>Stylesheets: The Tool of the Web Design Gods</H1>
<H2>Stylesheets: The Tool of the Web Design Gods</H2>
</BODY>
</HTML>
-----------------------
mystyles.css ------------------------------------------------------------------
H1 { color: green; font-family: impact }
-----------------------
mystyles.css ------------------------------------------------------------------
四、外部匯入樣式
<HTML>
<HEAD>
<TITLE> 外部匯入CSS樣式 </TITLE>
<STYLE TYPE="text/css">
<!--
/* 匯入CSS樣式實際上存在於內部樣式中 */
@import url(css/mystyles.css);
@import url(css/mystyles2.css);
H1 { color: orange; font-family: impact }
-->
</STYLE>
</HEAD>
<BODY>
<H1>Hello,CSS!</H1>
<H1>Stylesheets: The Tool of the Web Design Gods</H1>
<H2>Stylesheets: The Tool of the Web Design Gods</H2>
</BODY>
</HTML>
小結：
內部樣式：
1.內聯樣式（行內樣式）
2.內建樣式
外部樣式：
1.連結樣式
2.匯入樣式
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
