结构伪类选择器&否定伪类选择器

最新推荐文章于 2023-08-12 10:53:43 发布

晓明的日常操作

最新推荐文章于 2023-08-12 10:53:43 发布

阅读量205

点赞数

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

本文链接：https://blog.csdn.net/wangming2531/article/details/109010895

版权

css 专栏收录该内容

4 篇文章 0 订阅

订阅专栏

1.结构伪类选择器&否定伪类选择器

:first-child 匹配作为第一个子元素存在的指定元素
:only-child 匹配作为唯一子元素存在的指定元素（独生子）
:empty 匹配内容为空的指定元素
:not(selector)
input:not([type=text]) 选中所有input的type属性值不为text的input元素

new document

this is first h1

这是段落1

h1元素

这是段落2

this is div里面的span Name:
Password:

最后一个段落

askdjaklsd

<!DOCTYPE html>
<html>
<head>
    <title> new document </title>
    <meta charset="utf-8" />
    <style>
        /*
            1. :first-child  匹配作为第一个子元素存在的指定元素
            2. :only-child  匹配作为唯一子元素存在的指定元素（独生子）
            3. :empty  匹配内容为空的指定元素
            4. :not(selector)
                input:not([type=text])  选中所有input的type属性值不为text的input元素
        */
        h1:first-child{
            color:red;
        }
       h2:only-child{
	         color:yellow;
	   }
	   input:not([type="text"]){
	      color:red;
	   }
	   /* div:only-child{
            color:blue;
        }
        span:only-child{
            color:yellow;
        }
        p:empty{
            height:20px;
            background-color: #333399;
        }
        b{
            display: inline-block;
            border:5px solid;
            !*border-color:red transparent transparent transparent;*!
            border-color:red blue yellow green;
                    !*   上   右    下     左 *!
        }
        input:not([type=text]){
            color:red;
        }*/
    </style>
</head>

<body>
    <div>
        <h1>this is first h1</h1>
        <p>这是段落1</p>
        <h1>h1元素</h1>
        <p><b></b></p>
        <p>这是段落2</p>
        <span>this is div里面的span</span>
        Name:<input type="text" /><br />
        Password:<input type="password" /><br />
        <input type="button" value="普通按钮" />
        <p>最后一个段落</p>		
        askdjaklsd
    </div>
</body>
</html>

晓明的日常操作

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
结构伪类选择器&否定伪类选择器

1.结构伪类选择器&否定伪类选择器:first-child 匹配作为第一个子元素存在的指定元素:only-child 匹配作为唯一子元素存在的指定元素（独生子）:empty 匹配内容为空的指定元素:not(selector)input:not([type=text]) 选中所有input的type属性值不为text的input元素 new document this is first h1
复制链接

扫一扫