两种方式:

    方式一:设置属性值为none不可见:display:none

      这个属性改变了一个元素的显示效果。之前我有提到一点,假如元素使用了none值,那么元素直接干净利落的消失不见。你在右键审查元素的时候找到该处会显示为0×0,神马,不信,你试试。之所以会完全没有看见是以为使用了display:none这个标签,使用none值会让元素从文档中直接删除,所以它没有对布局产生任何的影响,就是真的消失不见了,前端根本显示不出来。

    方式二:设置第二个属性值不可见:visibility:hidden

      这个属性也是可以达到隐藏元素的目的,这个属性也是跟display属性正好相反,这个也只是“看不见”而已。用了该属性属性之后,元素在前端页面是解析不出来的,但是元素依然存在在哪里,只不过我们肉眼不可见,所以元素依然会影响到布局。

如何用css约束一个层不可见的更多相关文章

  1. 【CSS】如何用css做一个爱心

    摘要:HTML的标签都比较简单,入门非常的迅速,但是CSS是一个需要我们深度挖掘的东西,里面的很多样式属性掌握几个常用的便可以实现很好看的效果,下面我便教大家如何用CSS做一个爱心. 前期预备知识: ...

  2. 如何用css实现一个三角形?

    昨天被人问到说如何用css实现一个三角形?em....  当时被问到了,汗颜,今天找了一些帖子看了一下,也算是记录一下吧 代码如下: 实现效果:

  3. 如何用css做一个爱心

    摘要:HTML的标签都比较简单,入门非常的迅速,但是CSS是一个需要我们深度挖掘的东西,里面的很多样式属性掌握几个常用的便可以实现很好看的效果,下面我便教大家如何用CSS做一个爱心. 前期预备知识: ...

  4. 公司的一个面试题:如何用css让一个容器水平垂直居中?

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  5. 如何用 CSS 创作一个立体滑动 toggle 交互控件

    效果预览 在线演示 按下右侧的"点击预览"按钮在当前页面预览,点击链接全屏预览. https://codepen.io/zhang-ou/pen/zjoOgX 可交互视频教程 此视 ...

  6. 如何用css画一个文件上传图案?

    如下图,如果是你,你会怎么实现: 通常我们会通过字体图标来显示中间的加号,外层用一个div包裹即可:或者使用伪元素来模拟中间的一横一竖,这都比较麻烦. 其实我们可以直接使用div+css就可以实现. ...

  7. 如何用css写一个带斜切角、有边框又有内外阴影的按钮呢?

    如果有一天,UI设计师丢过来一张UI稿,上面有这样一个带有斜切角.有边框还有内外阴影的按钮,你会怎么实现呢?第一反应切图?可是按钮内容.大小都是可变的,那得切多少图啊~Canvas?SVG?No,no ...

  8. 如何用css画一个彩虹---v客学院技术分享

    无意间看到了CSS radial-gradient() 函数实现了如下图的样式 仔细一看还真有点像灯光下的鸡蛋,O(∩_∩)O哈哈~ 今天我就来用radial-gradient()函数教大家画一个简单 ...

  9. 如何用css做一个细虚线边框表格

    <style type="text/css"> <!-- .dashed_tbl { border-top: 1px dashed #333333; border ...

随机推荐

  1. ruby学习之路(一)

    学习ruby最好的方法就是下载源码包,里面带有sample和test,是入门学习的最好实例. 我下载的是2.1.0版本,首先./configure,然后make,sudo make install.从 ...

  2. vue父子通信的基本使用

    项目中没怎么用过父子通信,很多页面都是路由切换实现的,后来做首页的时候发现首页的路径没法配置,我强行在原先的首页上写了个子组件,通过判断路径使其强行跳转实现的 这个时候跳转页面的时候就要使用到了父子间 ...

  3. Qt 给QWidget添加工具栏

    在Qt中,给主窗口(QMainWindow类)添加工具栏非常方便,直接使用addToolBar 即可,如下所示: fileToolBar = addToolBar(tr("&File ...

  4. Vmware下的Linux系统,安装WPS报错:[Errno 256] No more mirrors to try

    最近新装了虚拟环境Vmware下的Linux系统,准备看doc文档发现不能读取,才想起来一起都是重新开始的~没别的~开始安装吧: 1.关虚拟机Linux,添加cdrom镜像ISO文件--开虚拟机--- ...

  5. 我安装android studio的过程与经历

    虽然android studio已经出来两年多了,但是我一直都没真正用过.之前用Eclipse还算用得挺好.我并不是一个专职的android开发者,我是个游戏开发者,打包的时候要用到android.不 ...

  6. jquery转义字符之单引号

    jquery动态生成html,并且html中包含方法时,如 var varHtml = '<input type="button" value="点我删除" ...

  7. git巧妙命令行

    git cherry-pick c7081607cfd1bfa99b6e6c70c208e71fbd8767ae

  8. HashMap源码分析2:扩容

    本文源码基于JDK1.8.0_45. final Node<K,V>[] resize() { Node<K,V>[] oldTab = table; int oldCap = ...

  9. ngTbale真分页实现排序、搜索等功能

    一. 真分页表格基础 1. 需求:分页,排序,搜索都是需要发API到服务端. 2. JS实现代码: getStorage是localStorage一个工具方法,可以自己写这个方法. API参数如下: ...

  10. maven bug之Failed to execute goal org.apache.maven.plugins:maven-compiler-plugin:2.5.1:compile (default-compile) on project acSpaceCommon: Fatal error compiling: tools.jar not found: C:\Program Files\J

    maven打包项目的时候一直报这个异常  一般的解决办法我都试过 在pom.xml加代码 也不行  只有10分了  求大神解答 这是因为测试代码时遇到错误,它会停止编译.只需要在pom.xml的< ...