【 CSS 】样式嵌入

CSS 样式嵌入

  • 标签的 style 属性
view code 
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<div stype="color:orange">ever love！ </div>
</body>
</html>
  • 写入head标签里面，style标签写样式
view code 
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
	<style>
	#i1{
		background-color: orange;
		color:white;
	}
	.c1{
		background-color: blue;
		color:white;
	}
	</style>
</head>
<body>
<div id="i1">ever love！2022-11-03 22:41:36 星期四 </div>
<div class="c1">ever love！2022-11-04 22:41:40 星期五 </div>
</body>
</html>
  • head标签里面引入style样式文件：例如commons.css
view code 
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
	<link rel="stylesheet" href="commons.css"/>
</head>
<body>
<div id="i1">ever love！2022-11-03 22:41:36 星期四 </div>
<div class="c1">ever love！2022-11-04 22:41:40 星期五 </div>
</body>
</html>

css文件：commons.css

#i1{
	background-color: orange;
	color:white;
}
.c1{
	background-color: blue;
	color:white;
}

------------
posted @ 2022-11-03 22:58  一条长江  阅读(37)  评论(0)    收藏  举报