CSS——6. 导入样式

时间sk2025-01-09 13:32

html 复制代码

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>方法4：导入样式</title>
		<link rel="stylesheet" href="a.css" />
	</head>
	<body>
		<!--css引入方式：-->
		<!--1.行内样式：
			将css代码写在元素开始标签的style属性中
			可以设置多个样式，使用";"隔开-->
			
		<!--2.内部样式-->
			<!--在当前网页head标签中，写上一对style标签，然后在style标签中，使用选择器编写css代码-->
			
		<!--3.外部样式-->	
			<!--需要一个单独的css文件书写css样式-->
			<!--在head标签中使用link标签把单独的css文件关联起来-->
			<!--在同一个页面可以引入多个css文件-->
			<!--是使用最多的样式-->
		
		<!--4.导入样式-->
			<!--把一个css文件通过@import url("要导入的css文件路径");导入到另一个css文件中-->
			<!--使用导入样式，会先加载html,再加载css，会造成页面样式延迟-->
			<!--导入样式在开发中不常用，当然也不建议使用，要真有多个样式建议使用外部样式法-->
			
		
		
		<div>我爱学习</div>
		
		
	</body>
</html>

我们把b.css样式文件导入到a.css样式文件中，然后在html页面中引入a.css,的过程叫导入样式，那如何将b.css样式文件导入到a.css样式文件中呢用 ;@import url("被导入的CSS样式文件路径");例如@import url("b.css")

b.css样式文件导入到a.css样式文件后，a.css样式文件内容就包含了b.css样式文件内容