css基础-隐藏显示元素
  1. display:none
    隐藏元素，不保留位置，文档结构中存在
  2. visibility:hidden
    隐藏元素，仍占有原来位置
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <div>display none</div>
    <div>visibility hidden</div>
</body>

</html>

<style>
    div:nth-child(1) {
        width: 100px;
        height: 100px;
        background-color: #e99;
        /* display: none; */
        visibility: hidden;

    }

    div:nth-child(2) {
        width: 100px;
        height: 100px;
        background-color: green;
    }
</style>

 

posted on 2023-07-22 13:13  码农-编程小子  阅读(5)  评论(0)  编辑  收藏  举报