CSS三种样式及总结（十二）

最新推荐文章于 2024-01-23 22:00:22 发布

David凉宸

最新推荐文章于 2024-01-23 22:00:22 发布

阅读量1.5k

点赞数 2

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

本文链接：https://blog.csdn.net/blue_698/article/details/108450765

版权

45 篇文章 4 订阅

订阅专栏

行内式

<标签名  style="属性1:属性值1; 属性1:属性值2;">内容</标签名>

<div style="color:red;font-size:20px;">哪有什么岁月静好，不过是有人替你负重前行</div>

<head>
<style  type="text/css">
	选择器（所选择的标签）{
		属性1:属性值1;
		属性2:属性值2;
	}
</style>
</head>

<head>
<style  type="text/css">
	div{
		color:red;
		font-size:20px;
		font-family:SimHei;
	}
</style>
</head>

注意：
1、style标签一般位于head标签中，理论上也可以放在HTML文档的任何地方
2、type=“text/css” 在HTML5中是可以省略的
3、只能控制当前的页面
缺点：
没有彻底的分离

<head>
<link rel="stylesheet" type="text/css" href="css文件路径">
</head>

在这里插入图片描述

在这里插入图片描述

样式书写一般有两种形式：
1、紧凑格式（Compact）

h3 { color: red;font-size: 20px;}

2、展开格式（推荐使用）

h3 { 
	color: red;
	font-size: 20px;
}

样式选择器，属性名，属性值关键字全部使用小写字母书写，属性字符串允许使用大小写。

/*推荐*/
h3{
color:red ;
}
/*不推荐*/
H3{
COLOR:RED;
}

我们在使用HTML时，一定要遵从一定的规范。
CSS一样要遵循，要想熟练的使用CSS来进行对网页修饰，首先需要了解CSS样式的规则。
具体格式如下图：
在这里插入图片描述

1.选择器用于指定CSS样式作用的HTML标签，花括号内是对该对象设置的具体样式。
2.属性和属性值以“键值对"的形式出现。
3.属性是对指定的对象设置的样式属性，例如字体大小、文本颜色等。
4.属性和属性值之间用英文∵"连接。
5.多个“键值对"之间用英文";"进行区分。

可以点击如下链接阅读：
css的发展史

关注

专栏目录