css 判断有没有子元素

CSS中有时候需要判断一个元素是否有子元素，来实现一些特殊的样式效果。针对这个问题，可以使用CSS中的伪类选择器:empty来判断元素是否为空，以此来判断是否有子元素。

    /* 选中没有子元素的div元素 */
    div:empty {
        /* 空元素样式 */
        background-color: #ccc;
    }

通过使用:empty伪类选择器，可以轻松的选中没有子元素的元素，并给它们设置对应的样式。但是需要注意的是，这个伪类选择器只能判断元素是否没有子元素，对于只有空白符的元素（比如空格、回车等），它并不能判断为空。

如果需要判断具体的子元素，可以使用:only-child伪类选择器，该选择器可以选中它们的父元素只有一个子元素的情况。

    /* 选中只有一个子元素的ul元素 */
    ul:only-child {
        /* 样式 */
        list-style: none;
    }

此外，还有:only-of-type和:last-child伪类选择器可以用来判断子元素的类型和最后一个子元素。

    /* 选中div中最后一个p元素 */
    div p:last-child {
        /* 样式 */
        color: red;
    }

综上所述，CSS提供了多种方式来判断元素是否有子元素，开发者可以根据具体需求选择合适的选择器。