CSS 三种引入方式

最新推荐文章于 2024-07-25 15:07:09 发布

豆豆_Q

最新推荐文章于 2024-07-25 15:07:09 发布

阅读量2.1k

点赞数

分类专栏： CSS 文章标签： css 三种引入方式

本文链接：https://blog.csdn.net/Homing_qu/article/details/62091019

版权

CSS 专栏收录该内容

3 篇文章 0 订阅

订阅专栏

CSS三种引入方式

1、外部引入：通过引入外部独立的CSS文件到HTML中，实现改变样式目的；

a) 链入式：使用<link href="#.css" rel="stylesheet" type="text/css" />

b) 导入式：使用@import"#.css";

<style type="text/css">
@import"c1.css";
</style>

2、内部引入：

a) 嵌入式：将页面中各种元素的设置集中写在<head>和</head>之间，对于单一的网页，这种方法很方便。但是对于一个包含很多页面的网站，如果每个页面都以内嵌方式设置各自的样式，就失去了CSS带来的巨大优点，因此一个网站通常都是编写一个独立的CSS样式表文件，使用以下两种方式中的一种，引入HTML文档中。

html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<title>CSS测试</title>
		<style type="text/css">
			h1{
			color:red;
			background-color:boue;
			}
		</style>
	</head>
	<body>
		<h1>CSS测试</h1>
		<h2>CSS测试</h2>
	</body>
</html>

3、内联引入：

a) 行内式：即在标记的style属性中设定CSS样式，这种方式本质上没有体现出CSS的优势，因此不推荐使用；

<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<title>CSS测试</title>
	</head>
	<body>
		<h1 style = "color:red">CSS测试</h1>
		<h2>CSS测试</h2>
	</body>
</html>

豆豆_Q

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
CSS 三种引入方式

CSS三种引入方式1、外部引入：通过引入外部独立的CSS文件到HTML中，实现改变样式目的；a) 链入式：使用b) 导入式：使用@import"#.css";@import"c1.css";2、内部引入：a) 嵌入式：将页面中各种元素的设置集中写在和之间，对于单一的网页，这种方法很方便。但是对于一个包含很多页面的网站，如果每个页面都以内嵌方式设置各自的样式，就失去了CS
复制链接

扫一扫

专栏目录