如何使用 display 显示和隐藏 - CSS

如何使用 display 显示和隐藏 - CSS

主页是将很多标签组成的编码目录可视化。 
如果填写的编码不需要，可以删除，但如果是肉眼看不见但必须的部分，怎么样？ 
当然也可以隐藏为hidden属性，但是也可以在CSS中使用display给none或hidden来隐藏，让我们来了解一下方法。     


1. 对display的理解 

显示是CSS使用的属性。 决定"如何表现"。 
div、 table、 span 或任何地方都可以使用 。 
在想要适用的对象中添加样式项目，按如下方式处理即可。 

<div style=" display: 想要的元素;"> 内容</div>

例如，添加了测试标签的代码，但是不想让访问者看到， 
或者有只想自己一个人看的文字， 
虽然看不到屏幕，但是看酱汁的时候可以看， 
虽然从另一个标签那里收取了某个值 
如果想在视觉上看不见的同时使用变数等,会有很多使用方法。   ​  

2. 用display隐藏的方法 

上面展示了基本的标签，这次我们来看一下其他应用。
上面放入div，这次放入span的例子。 

<span style=" display: none;"> 内容</span> 

以上内容是第一个不让客体看到的方法,如果贴上none,眼睛也看不见,位置也不占,隐藏起来。    

<span style=" display: hidden;"> 内容</span> 

以上内容是看不到客体的第二个方法,如果贴上hidden,虽然看不见,但位置会原封不动地占据。       


3. none和hidden的区别说明 

虽然none和hidden都起到了看不见的隐藏作用，但存在空间差异。  
如果在 css 中给 display 属性 hidden， 则该位置将不可见地消失， 但该位置仍为空格 。 
例如,在写文字时,不删除文字,而是换成白色,在显示器上看不到。  
但是，如果赋予属性none，则隐藏在肉眼可见的空间的大小被处理为0，下面的图片或文字会向上贴合。 
例如,如果从word中删除文字,就相当于上传了。 
但是，因为它是display的属性，所以它不是真的消失，只是大小变成了0。​    ​

4. display 的另一个属性... 

除hidden、none外，display还具有block、inline、inline-block等属性。 
block、inline、inline-block将在另一篇文章中讨论。

[利用display的显示, 隐藏方法 - CSS]