css中的选择器

最新推荐文章于 2024-05-24 15:01:48 发布

boring736

最新推荐文章于 2024-05-24 15:01:48 发布

阅读量140

点赞数 1

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

本文链接：https://blog.csdn.net/weixin_73198742/article/details/127289740

版权

html学习专栏收录该内容

1 篇文章 0 订阅

订阅专栏

css中的选择器

元素选择器：根据标签名选择
id选择器：赋予一个元素id，通过id属性值选中一个元素

语法:#id属性 {}

设置ID语法例子：

注意id不能重复

类选择器：通过对标签设置class属性而选择

注：一个标签可设置多个class属性

语法：.class标签名{}

设置class语法例子：class=“属性1 属性2 …”
通配选择器：选择所有元素

语法：*{}

复合选择器：

1.交集选择器：选择同时符合多个条件的元素

2.并集选择器：同时选择多个选择器对应元素

3.子元素选择器：选择指定子元素

语法：父元素 > 子元素{}

4.后代元素选择器：选中祖先元素后代所有指定元素

语法：祖先元素后代元素{}

5.兄弟元素选择器

选择下一个兄弟元素语法：前一个兄弟元素+下一个兄弟元素

选中后面所有兄弟元素语法：标签1~标签2{}

今日学习内容

个人第一个HTML代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="gushi">
    <title>gushi</title>
</head>
<style>
p{
    size: 60px;
}
h1{
    size: 100px;
}
</style>
<body>
    <h1>饮湖上初晴后雨</h1>
    <h5>宋代 苏轼</h5>
    <p>水光潋滟晴方好</p>
    <p>山色空蒙雨亦奇</p>
    <p>欲把西湖比西子</p>
    <p>淡妆浓抹总相宜</p>
</body>
</html>