zoukankan      html  css  js  c++  java
  • 隐藏一个元素的几种方法

    1.将元素的display属性设为none

    <div style="display:none">看不见我</div>

    2.元素的祖先元素是隐藏的,该元素是不显示的

    <div style="display: none;">
        <div>看不见我</div>
    </div>

    3.<input>标签元素的type属性设为hidden

    <input type="hidden" name="看不见我">

    4.将元素的width和heigth都设为0

    <div style=“width:0;heigth:0;background-color:red”>看不见我</div>

    5.将visibility设为hidden(visibility属性指定一个元素是否是可见的)

    <div style="visibility:hidden">看不见我</div>

    6.将opacity设为0 (opacity属性设置一个元素了透明度级别,从0.0(完全透明)到1.0(完全不透明)

    <div style="opacity:0;">看不见我</div>

    display:none、visibility:hidden 和 opacity:0 的区别

    display:none 隐藏后不占据额外空间,它会产生回流和重绘

    visibility:hidden 和 opacity:0 元素虽然隐藏了,但它们仍然占据着空间,它们只会引起页面重绘

    display:none 不会被子元素继承,但是父元素都不在了,子元素自然也就不会显示了

    visibility:hidden 会被子元素继承,可以通过设置子元素visibility:visible 使子元素显示出来

    opacity: 0 会被子元素继承,但是不能通过设置子元素opacity: 0使其重新显示

  • 相关阅读:
    datetime和time的时间戳用法
    ER图
    python update()
    理解JWT(JSON Web Token)认证及python实践
    python lambda匿名函数 用法
    flask_restful(转载)
    Flask-SQLALchemy
    创建只有一个元素的元组
    MySQL安装过程中显示无法启动
    聚类
  • 原文地址:https://www.cnblogs.com/3yleaves/p/9629613.html
Copyright © 2011-2022 走看看