4种css选择器综合应用

CSS（层叠样式表）是一种用于定义网页样式和布局的语言，通过向HTML文档添加一些CSS代码，可以让网页更加美观和易于阅读。

在CSS中有许多选择器可用于选择需要添加样式的元素。下面介绍4种常用的CSS选择器，并且通过实例演示综合应用。

选择器1：元素选择器
作用：选中所有指定元素类型的元素。
示例代码：p {
           color: red;
         }
说明：该代码选中所有的p元素，并将它们的字体颜色设置为红色。

选择器2：类选择器
作用：选中具有指定类名的元素。
示例代码：.red {
           color: red;
         }
说明：该代码选中所有具有.class为red的元素，并将它们的字体颜色设置为红色。

选择器3：ID选择器
作用：选中具有指定ID的元素。
示例代码：#header {
           font-size: 20px;
         }
说明：该代码选中具有id为header的元素，并将它们的字体大小设置为20px。

选择器4：后代选择器
作用：选中指定元素内所有的后代元素。
示例代码：div p {
           font-size: 16px;
         }
说明：该代码选中所有嵌套在div元素内的p元素，并将它们的字体大小设置为16px。

以上4种选择器都是CSS中常见的选择器，我们可以根据实际需要来灵活运用。通过综合应用不同的选择器，我们可以精确地控制网页元素的样式，让网页显得更加美观和易于阅读。