行间样式表
<body>
<!--行间样式表-注释-->
<div style="width:100px;height:100px;background:red;font-size:30px;">aaa</div>
<div style="width:100px;height:100px;background:red;font-size:30px;">bbb</div>
<div style="width:100px;height:100px;background:red;font-size:30px;">ccc</div>
</body>
</html>
内部样式表
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<!--内部样式表-->
<style>
#div1 {
width:100px;
height:100px;
background:red;
}
#div2 {
width:100px;
height:100px;
background:yellow;
}
</style>
</head>
<body>
<div id="div1">aaa</div>
<div id="div2">bbb</div>
</body>
外部样式表
内部
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<link rel="stylesheet" href="123.css"/>
</head>
<body>
<div id="div1">aaa</div>
</body>
外部.css
#div1{
width:100px;
height:100px;
background:red;
font-size:50px;
}