首页 >web前端 >css教程 > 正文

css如何设置占位隐藏

原创2021-04-15 18:40:5501076

在css中,可以使用visibility属性来设置占位隐藏,语法“visibility:hidden;”;该属性规定元素是否可见,当值为“hidden”时,表示元素是不可见的,但也会占据页面上的空间,并对网页的布局起作用。

本教程操作环境:windows7系统、CSS3&&HTML5版、Dell G3电脑。

visibility属性介绍:

visibility具有继承性,给父元素设置visibility:hidden;子元素也会继承这个属性。但是如果重新给子元素设置visibility: visible,则子元素又会显示出来。这个和display: none有着质的区别

visibility: hidden不会影响计数器的计数,如图所示,visibility: hidden虽然让一个元素不见了,但是其计数器仍在运行。这和display: none完全不一样

示例:

<body>
  <div>
    <strong>给元素设置visibility:hidden样式</strong>
    <ol>
      <li>元素1</li>
      <li style="visibility:hidden;">元素2</li>
      <li>元素3</li>
      <li>元素4</li></ol>
  </div>
  <div>
    <strong>给元素设置display:none样式</strong>
    <ol>
      <li>元素1</li>
      <li style="display:none;">元素2</li>
      <li>元素3</li>
      <li>元素4</li></ol>
  </div>
</body>

效果图:

V{(DK3B`3N{X5@RLQD`AA@5.png

推荐学习:css视频教程

以上就是css如何设置占位隐藏的详细内容,更多请关注php中文网其它相关文章!

php中文网最新课程二维码

声明:本文原创发布php中文网,转载请注明出处,感谢您的尊重!如有疑问,请联系admin@php.cn处理

  • 相关标签:css 占位隐藏
  • 相关文章

    相关视频


    网友评论

    文明上网理性发言,请遵守 新闻评论服务协议

    我要评论
  • 专题推荐

    作者信息

    醉折花枝作酒筹

    飞花飘絮,霓裳翩翩舞,几多情愫心飞扬。

    最近文章
    css如何设置指定网格的大小和位置463
    css如何定义网格线大小1155
    教你一招搞定css背景图的大小835
    推荐视频教程
  • 野秀堂HTML5+CSS3视频教程野秀堂HTML5+CSS3视频教程
  • CSS3精讲视频教程CSS3精讲视频教程
  • HTML/CSS技术小知识每日分享HTML/CSS技术小知识每日分享
  • CSS 代码实例CSS 代码实例
  • 玩转CSS Flexbox弹性盒子布局(2021新课)玩转CSS Flexbox弹性盒子布局(2021新课)
  • 视频教程分类