IT编程技术

天行健，君子以自强不息；地势坤，君子以厚德载物；

CSS第一节-CSS引入样式

2021-4-15 博主：Splendor CSS笔记

CSS引入样式
1，行内样式（内联样式)
在标签属性中添加style属性，通过style属性添加样式。属性：属性值表示，有多组样式请用；（分号隔开）
例： 
<div style="border: 1px solid red;color: red">你好</div>
2，内部样式表（内嵌样式）
在HTML的head标签内用<style type="css/test"></style>包裹样式内容表式
例：
<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<style type="text/css">
			div {
				color: blue;
				border: 1px solid red;
			}
		</style>
	</head>
	<body>
		<div>你好</div>
	</body
</html>
3，外部样式表（外链样式)
通过link标签，引入CSS文件实现样式关联和共享
<link rel="stylesheet" type="text/css" href="../banner/css/banner.css"/>
例：
<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<!--引入外部CSS样式-->
		<link rel="stylesheet" type="text/css" href="CSS/test1.css"/>
	</head>
	<body>
		<div>你好</div>
	</body
</html>
三种样式表总结
捕获.PNG

标签: CSS笔记

« CSS第二节-CSS选择器 | JS第三节-表达式和运算符»