html页面中div怎么调用css？css的调用源码介绍分析！

猿友 2021-05-25 16:29:23 浏览数 (4320)

在 Html 的学习中我们会面临很多问题，那么今天我们就来说说在 html 页面中 div 怎么调用 css 吧！

1.首先我们在开发工具中新建一个 Html 文件，并且将文件命名为 test.html。创建成功后的代码如下：

<html>
	<head>
		<meta charset="utf-8">
		<title>html页面中div怎么调用css</title>
	</head>
	<body>
	</body>
</html>

2.在创建后的代码中加入 <div></div>标签，并且在该标签中加入一个 class类标签，定义类标签的名称为 ceshi；代码如下：

<html>
	<head>
		<meta charset="utf-8">
		<title>html页面中div怎么调用css</title>
	</head>
	<body>
		<div class="ceshi">
			html页面中div怎么调用css?
		</div>
	</body>
</html>

3.在同一个项目中新建一个 css文件，并且将该文件命名为 test.css，将文件保存在项目中的 css 的文件夹中。通过 ceshi 类名编写 html 页面中 div 的 css 样式。设置字体大小为30px，字体颜色为蓝色。代码如下：

@charset "utf-8";
.ceshi{
	font-size: 30px;
	color: blue;
}

4.在 test.html 文件中，使用 link 标签加载外部的 css 文件，并且在 href 属性中添加 css 文件的路径。代码如下：

	<html>
	<head>
		<meta charset="utf-8">
		<link href="css/jieshao.css" rel="stylesheet"/>
		<title>html页面中div怎么调用css</title>
	</head>
	<body>
		<div class="ceshi">
			html页面中div怎么调用css?
		</div>
	</body>
</html>

5.我们保存所有的文件，在开发工具中点击运行，查看运行结果截图如下：

运行结果截图

以上就是今天小编给大家带来的 html 页面中 div 怎么调用css调用源码介绍分析！希望对你的学习有用，更多的基础学习快来w3cschool免费学习吧！