display和visibility的差别

日期:2020-12-12 类型:科技新闻 

关键词:如何制作微信小程序,微信小程序源码,小程序码生成,凡科网微信小程序,微信公众号小程序

visibility掩藏的目标还保存目标显示信息时所占的物理学室内空间,display则不保存。

vilibility:hidden(掩藏)、visible(显示信息) style="vislbility:hidden"

display:none(掩藏)、block(显示信息) style="display:none"

能够储存下面的编码看看实际效果。

实际流程:

编码示例:

< div style="border:1px solid #000;background:#eee">
< span style="width:200;height:200;visibility:hidden"></span>
←SS特性为visibility:hidden的目标
< /div><br>
< div style="border:1px solid #000;background:#666">
< span style="width:200;height:200;display:none"></span>
←SS特性为display:none的目标
< /div>

非常提醒

用visibility特性操纵掩藏的目标还占有着它显示信息时的部位,而display则沒有。

非常表明

display特性设定元素的显示信息方法,对应脚本制作特点为display,可选值为none、block和inline,各值的表明以下:

none 掩藏元素,不保存元素显示信息时的室内空间。

block块方法显示信息元素。

inline 之内嵌方法显示信息元素。

inline-block目标显示信息为嵌入元素,但全部子目标都显示信息为块元素,邻近的嵌入元素将显示信息在同1行,容许空格。

list-item 将块元素显示信息为目录目标,并能够加上新项目标点。(必须IE6.0+适用)

table-header-group 将元素做为报表题目组显示信息,非常于tHead元素。

table-footer-group 将元素做为报表脚注组显示信息,非常于tFoot元素。

visibility特性设定是不是显示信息元素,对应的脚本制作特点为visibility,可选值为inherit、hidden和visible,各值的表明以下:

inherit 承继父元素的visibility特性设定。

hidden 掩藏元素,但保存其所占室内空间。

visible 显示信息元素(默认设置值)。

以上便是本文的所有內容,期待本文的內容对大伙儿的学习培训或工作中能带来1定的协助,另外也期待多多适用脚本制作之家!