CSS样式,选择器

最新推荐文章于 2022-09-19 09:24:37 发布

红日_

最新推荐文章于 2022-09-19 09:24:37 发布

阅读量398

点赞数

本文链接：https://blog.csdn.net/HongRi_/article/details/90214766

版权

本文介绍了CSS引入样式规则的三种方式：行内样式、内部样式和外部样式，重点讲解了选择器的类型，包括元素选择器、ID选择器、类选择器、属性选择器和伪类选择器。此外，还探讨了CSS的样式如边框、尺寸、转换、字体、背景色和布局，以及盒子模型中的内边距和边框等概念。

摘要由CSDN通过智能技术生成

CSS引入样式规则

行内样式:是通过标签的style属性来设置元素的样式

<a style="color: #f00; font-size: 30px;">测试</a>
行内样式通过标签的属性来控制样式，这样并没有做到结构与表现（HTML展示结构、CSS显示效果）相分离，所以一般很少使用

内部样式(内嵌式):是将CSS代码集中写在HTML文档的< head>头部标签体中，并且使用< style>标签定义。

<!--方式2：内部样式
	background-color ： 表示背景色
-->
<style type="text/css">
	body{
    
		background-color: #ddd;
	}
</style>
内嵌式CSS样式只对其所在的HTML页面有效，可以对多处标签统一设置样式，因此，仅设计一个页面时，使用内嵌式是个不错的选择。但如果是一个网站，不建议使用这种方式，因为他不能充分发挥CSS代码的重用优势。

外部样式:又称为链入式，是将所有的样式放在一个或多个以.css为扩展名的外部样式表文件中，通过< link>标签将样式连接到HTML文档中。

<!--方式3：外部样式
	rel="stylesheet" ,固定值，当前文件和引入文件的关系,rel是relationship的缩写
                          stylesheet是样式表
	type="text/css",  固定值，表示浏览器解析方式
	href ，表示css文件位置
		font-family 表示使用的字体系列，多个字体使用逗号分隔。例如&#x