CSS样式

最新推荐文章于 2024-06-12 12:52:53 发布

执念的鱼686

最新推荐文章于 2024-06-12 12:52:53 发布

阅读量76

点赞数

分类专栏： wed前端文章标签： css html

本文链接：https://blog.csdn.net/weixin_56606438/article/details/118217747

版权

wed前端专栏收录该内容

4 篇文章 0 订阅

订阅专栏

CSS样式

内联样式

内联样式也成为行内式，通过标记的style属性来设置元素的样式

<p style="font-family: '黑体';color: red;">内容</p>

内行式只对其所在的标记及嵌套在其中的子标记起作用
需要每个标记设置style属性，后期不好维护

内部样式表

内部样式表也成为内嵌式，是Css代码集中写在HTML文档中的<head></ head>之间，用

样式只对当前文档有效，所以适用于特殊页面设置单独样式

<html>
<head>
	<meta charset="utf-8">
<title>样式</title>
	<!-- 内部样式表 -->
	<style type="text/css">
		.h2{
			text-align: center;
            color: #8B4513;
		}
	</style>
</head>
</html>

外部样式表

也成为链接式，是讲所有样式方正一个或多个以.Css为扩展名的外部样式表文件中。

通过标记将外部样式文件链接到HTML文件中。

<html>
<head>
	<meta charset="utf-8">
	<title>样式</title>
<!-- 外部样式表 -->
<link rel="stylesheet" type="text/css" href="外部文件地址">
</head>

链接与导入

链接式和导入式的区别
- 链接式：在加载页面主体部分之前装载CSS文件，显示出来的页面从一开始就带有样式。
- 导入式：在整个页面加载完成后再装载CSS文件，当网页文件比较大、网速比较慢时，导入式可能会是客户端先呈现出HTML结构，再看见装载了CSS样式之后的文件。
导入式
- 导入式与链接式样式表功能基本相同，只是语法和运作方法上略有区别。
- 导入式在<style>标记中通过@import导入

<style type="text/css">
/*导入式*/
@import url("文件地址");
</style>

执念的鱼686

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
CSS样式

CSS样式内联样式内联样式也成为行内式，通过标记的style属性来设置元素的样式<p style="font-family: '黑体';color: red;">内容</p>内行式只对其所在的标记及嵌套在其中的子标记起作用需要每个标记设置style属性，后期不好维护内部样式表内部样式表也成为内嵌式，是Css代码集中写在HTML文档中的</ head>之间，用样式只对当前文档有效，所以适用于特殊页面设置单独样式<html>
复制链接

扫一扫