HTML笔记（二）：P标签的嵌套问题

1、问题：P标签嵌套P标签时出现错误

　　案发现场：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
    <div>
        <p>p1</p>
        <p><p>p2</p></p>
    </div>
    <p>p3</p>
</body>
<script src="jquery-1.8.3.min.js"></script>
<!-- <script src="jquery-1.9.1.min.js"></script> -->
<script type="text/javascript">
    $(function(){
        $("div > p").css({
            "color": "red",
        })
    });
</script>
</html>

　　结论：p标签里面不能嵌套块级元素。

　　验证：通过

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <style>
        *{
            color: red;
        }
    </style>
</head>
<body>
    <div>
        <span>span1</span>
        <span>
            span2
            <span>span3</span>
        </span>
    </div>
</body>
<script src="jquery-1.8.3.min.js"></script>
<!-- <script src="jquery-1.9.1.min.js"></script> -->
<script type="text/javascript">
    $(function(){
        $("div > span").css({
            "color": "blue",
        })
    });
</script>
</html>

posted on 2016-10-04 20:47 花雨伞阅读(888) 评论(0) 收藏举报