03css选择器及其常用属性

最新推荐文章于 2025-12-19 11:59:32 发布

原创最新推荐文章于 2025-12-19 11:59:32 发布 · 127 阅读

CC 4.0 BY-SA版权

文章标签：

5 篇文章

订阅专栏

本文介绍了CSS选择器的种类，包括元素选择器、类选择器、ID选择器和通配符选择器，并展示了如何使用它们来设置元素的样式。同时，讲解了字体大小、颜色、宽度、高度和背景颜色等常用CSS属性的应用。通过实例代码，帮助读者理解如何实现文本的样式调整和布局控制。

在head标签内加入style容器，在容器内进行css选择器的设定

对一些标签进行样式编辑

格式：

元素{
	属性：属性值；
	属性：属性值；
	属性：属性值；
	...
}

例如：

<style>
    h1{
        color: blue;
        font-size: 20px;
    }
</style>

这样子h1标签中的所有元素都会变成蓝色，字体大小变成12px

在这里插入图片描述

在标签的属性中有class=""属性，这是用来规定一些标签为同一个类别

那么通过类选择器，我们可以将同属为一个类别的标签进行相同的样式修改

格式：

.className{
	属性：属性值；
	属性：属性值；
	属性：属性值；
	属性：属性值；
	...
}

.test{
    color:red;
    font-size: 30px;
}

<h2 class="test">hello h2</h2>
<p class="test">hello p</p>

在这里插入图片描述

和类选择器的原理是一个意思，将具有该id属性的元素进行样式编辑

格式：

#idName{
	属性：属性值；
	属性：属性值；
	属性：属性值；
	...
}

将通配符选择器中的样式应用在所有的元素中

格式：

*{
	属性：属性值；
	属性：属性值；
	属性：属性值；
	...
}