结构伪类选择器


结构伪类选择器

伪类:

p:条件

DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Titletitle>


    <style>
        /*ul的第一个子元素*/
        ul li:first-child{
            background: lightpink;
        }
        /*ul的最后一个子元素*/
        ul li:last-child{
            background: cornflowerblue;
        }
        /*选中p1 :定位到父元素,选择当前的第一个元素
        选中当前p元素的父级元素,选中父级元素的第一个,并且是当前元素才生效,顺序!
        */
        p:nth-child(1){
            background: burlywood;
        }
        /*选中父元素,下的p元素的第二个,类型*/
        p:nth-of-type(2){
            background: gold;
        }
        /*a:hover{*/
        /*    background: cadetblue;*/
        /*}*/
    style>

head>
<body>


<p>p1p>
<p>p2p>
<p>p3p>
<ul>
    <li>li1li>
    <li>li2li>
    <li>li3li>
ul>
body>
html>
CSS