当前位置：首页 > article >正文

CSS——4. 行内样式和内部样式（即CSS引入方式）

article 2025/1/7 14:15:17

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>方法1：行内样式</title>
	</head>
	<body>
		<!--css引入方式：-->
	       <!--css的引入的第一种方法叫：行内样式
			将css代码写在元素开始标签的style属性中
			可以设置多个样式，使用";"隔开-->
		
		<div style="color: red ;background: greenyellow;font-size: 30px;">我爱学习</div>
		
		
	</body>
</html>



<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>方法2：内部样式（行内样式时我们用的是style属性，内部样式时我们用的是style标签）</title>
		
		<style type="text/css">
			div{
				color: red;font-size: 30px;
			}
		</style>
		
	</head>
	<body>
		<!--css引入方式：-->
		<!--1.行内样式：
			将css代码写在元素开始标签的style属性中
			可以设置多个样式，使用";"隔开-->
			
		<!--2.内部样式-->
			<!--在当前网页head标签中，写上一对style标签，然后在style标签中，使用选择器编写css代码-->
		
		<div>我爱学习</div>
		
		
	</body>
</html>