css 隐藏元素

display , visibility 仅会改变元素显示,不会改变元素种类。可以配合 js 使用使元素可以动态的显示隐藏。

可以使用 displayvisibility 实现html元素的隐藏功能,但是这两种方式有不一样的地方。display 中的 none 值隐藏,元素后不会在占据页面空间,但是 visibility 的 hidden 值隐藏,元素是看不见了不过会占据页面空间。

display 说明

值 说明 none 隐藏。 block 使元素占据一行的全部空间 。 inline 使元素仅占据所需的宽度(作用元素中不能有块元素)。

注意 : 使用 inline 时元素不能有块元素不然样式不生效。


li,div {
  display: inline;
}

把链接列表显示为水平导航栏:

  HTML
  CSS
  JavaScript

  1
  1

  2
  2

  p 标签内容被隐藏了
  123

visibility 说明 用法和 display 差不多。

值 说明 visible 默认值显示。 hidden 元素不可见,但还占据页面上的空间 collapse 当在表格元素中使用时,此值可删除一行或一列,但是它不会影响表格的布局。被行或列占据的空间会留给其他内容使用。如果此值被用在其他的元素上,会呈现为 “hidden”。 inherit 规定应该从父元素继承 visibility 属性的值。

Original: https://www.cnblogs.com/txzn/p/16593201.html
Author: 简单易懂
Title: css 隐藏元素

原创文章受到原创版权保护。转载请注明出处:https://www.johngo689.com/573522/

转载文章受原作者版权保护。转载请注明原作者出处!

(0)

大家都在看

  • java基本数据类型之间的转换

    基本数据类型之间的相互转换分为两种,分别是自动类型转换和强制类型转换。 自动类型转换 当需要从低级类型向高级类型转换时,java会自动完成从低级类型向高级类型转换。低级类型是指取值…

    Java 2023年6月7日
    088
  • MySQL查询生成行号

    Oracle中可以使用ROWNUM,MYSQL无该关键词,需要使用以下形式: SELECT @rowNum:=@rowNum + 1 AS ‘行号’, a.X1, a.X2, a….

    Java 2023年6月5日
    063
  • C语言实现扫雷游戏(完整版)

    头文件定义、函数声明 下面就是扫雷中使用到的所有函数,为了省事我把所有的代码都放在一个C文件中实现 宏定义中设置了游戏的界面布局,以及设置地雷的个数(这里默认的是10个地雷),界面…

    Java 2023年6月15日
    073
  • Java基础(一)

    404. 抱歉,您访问的资源不存在。 可能是网址有误,或者对应的内容被删除,或者处于私有状态。 代码改变世界,联系邮箱 contact@cnblogs.com 园子的商业化努力-困…

    Java 2023年6月7日
    087
  • 【maven】Dependency “XXX”not found

    父工程pom文件中依赖报红, <dependencymanagement></dependencymanagement> 中依赖报红属于正常现象,在子工程继…

    Java 2023年6月15日
    061
  • 模板化的封装,降低业务代码开发

    复杂的问题,往往需要简单的逻辑; 一、业务背景 业务开发是一件复杂且耗时的工程,所以最近几年出了一个很火的概念叫做”低代码”开发,简单的说就是开发人员通过简…

    Java 2023年6月15日
    090
  • Docker(2)

    复杂安装详说 mysql 主从复制 主服务容器启动与配置 新启主服务容器 docker run -p 3307:3306 –name mysql-master -v /usr/l…

    Java 2023年6月8日
    085
  • xhydra的基础使用

    console–xhydra 在Target-Single Target输入目标IP(单个) 而Target List是批量爆破 Port:对应端口 Protocol:…

    Java 2023年6月7日
    063
  • SpringBoot自定义注解——通过AOP编程实现注解的业务逻辑功能

    (1)首先我们可以通过@interface来定义一个注解: import static java.lang.annotation.ElementType.METHOD; impor…

    Java 2023年5月30日
    070
  • Java中static块、构造块、构造函数的执行顺序

    最近被一个面试题难住了,看来之前对JAVA的执行顺序欠了解。以为原面试题代码: public class Example { public static void main(Str…

    Java 2023年5月29日
    079
  • JPA 入门实战(3)–Spring Boot 中使用 JPA

    本文主要介绍在 Spring Boot 中使用 JPA 的方法(暂不使用 spring-data-jpa),相关的环境及软件信息如下:Spring Boot 2.6.10、JPA …

    Java 2023年6月16日
    073
  • 我觉得 MQ 无用的理由

    不喜欢用 MQ。 如果是同一个系统内的不同模块,可以用数据库表,来传递消息;如果是不同系统间数据接口,可以用 webservice(同步,现在好像是 gRPC 有点热)、SFTP/…

    Java 2023年6月9日
    055
  • Nginx 源码分析– 内存池(pool)的分析 一

    Nginx内存池(pool)的管理的实现主要写在ngx_palloc.c这个文件中,为了明晰的看该文件中的函数之间的关系,我们描绘出以下一张简单的示意图: 图1 Nginx内存池(…

    Java 2023年6月15日
    095
  • 关于如何在Idea下进行多子项目及引用内部子项目情况下打包项目的方法

    近期在开发Java的时候遇到了如下的打包上的问题 需要将一个工程下面的子工程分别打包 有的子工程还包含了另一个子工程 在这种情况下打包会出现找不到子模块的情况。 JDK:1.8 开…

    Java 2023年6月15日
    089
  • Core Java 总结(字符和字符串类问题)

    所有代码均在本地编译运行测试,环境为 Windows7 32位机器 + eclipse Mars.2 Release (4.5.2) 2016-10-17 整理 字符,字符串类问题…

    Java 2023年5月29日
    087
  • private static final long serialVersionUID = 1L 的作用

    1、这句话的意思是定义程序序列化ID 2、什么是序列化? Serializable,Java的一个接口,用来完成java的序列化和反序列化操作的; 任何类型只要实现了Seriali…

    Java 2023年6月5日
    090
亲爱的 Coder【最近整理,可免费获取】👉 最新必读书单  | 👏 面试题下载  | 🌎 免费的AI知识星球