zoukankan      html  css  js  c++  java
  • 元素隐藏方法总结:

    1. 如果希望元素不可见、不占据空间、资源会加载、DOM 可访问:display: none

    2. 如果希望元素不可见、不能点击、但占据空间、资源会加载,可以使用:visibility: hidden

    3. 如果希望元素不可见、不占据空间、显隐时可以又transition淡入淡出效果:

    div{
      position: absolute;
      visibility: hidden;
      opacity: 0;
      transition: opacity .5s linear;
      background: cyan;
    }
    div.active{
      visibility: visible;
      opacity: 1;
    }
     

    这里使用visibility: hidden而不是display: none,是因为display: none会影响css3的transition过渡效果。
    但是display: none并不会影响cssanimation动画的效果。

      1. 如果希望元素不可见、可以点击、占据空间,可以使用:opacity: 0

      2. 如果希望元素不可见、可以点击、不占据空间,可以使用:opacity: 0; position: abolute;

      3. 如果希望元素不可见、不能点击、占据空间,可以使用:position: relative; z-index: -1;

      4. 如果希望元素不可见、不能点击、不占据空间,可以使用:position: absolute ; z-index: -1;

  • 相关阅读:
    work_7_Boolean和boolean,基本类型和包装类型
    work_06_服务器上传图片错误
    work_05_64未随机id生成器
    work_04_谷歌验证码工具Kaptcha
    vue.js_13_vue的搭建
    每日一java(割草机)
    work_03_常见jq问题处理
    work_02_css样式
    java 27
    java 27
  • 原文地址:https://www.cnblogs.com/bobo1/p/12370201.html
Copyright © 2011-2022 走看看