代码编织梦想

类似网页广告,当点击关闭就不见了,但重新刷新页面,就会重新出现。

本质:让元素在页面中显示或者隐藏。

一、display 显示

display属性用于设置一个元素如何显示。

  • display: none; 隐藏对象
  • display: block; 转换为块级元素;显示元素

display隐藏元素后,不再占有原来的位置

二、visibility 可见性

visibility属性用于指定一个元素可见还是隐藏。

  • visibility: visible; 元素可视
  • visibility: hidden; 元素隐藏

display隐藏元素后,继续占有原来的位置

三、overflow 溢出

overflow属性用于指定内容溢出元素框的效果

属性值描述
visible不剪切内容也不添加滚动条
hidden不显示超过对象尺寸的内容,超出的部分隐藏掉
srcoll不管超出内容否,总是显示滚动条
auto超出自动显示滚动条,不超出不显示滚动条

一般情况下,我们都不想让溢出的内容显示出来,因为溢出的部分会影响布局。

但是如果有定位的盒子,慎用overflow: hidden 因为它会隐藏多余的部分。 

 

版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。 本文链接: https://blog.csdn.net/qq_43623147/article/details/111088922

前端笔记记录---简单导航栏(浮动)-爱代码爱编程

声明:以下内容为个人学习总结,初衷是方便自己学习复习记录。如有错误之处,烦请多多指正! 实现效果 点击前: 点击后: 实现代码 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="vi

css实现炫彩字体-爱代码爱编程

css实现炫彩字体 #logo { font-weight: 600; font-size: 28px; font-family: "黑体"; color: #8c888b;

VUE中使用百度地图BaiduMap-爱代码爱编程

VUE中使用百度地图BaiduMap 以前在html页中使用了echart,做了很多图表,也集成了百度地图,效果很好。最近,开始研究vue加 .net core的框架,所以也想把echart和百度地图用在vue上,把整个过程记录下来,以备自己和别人使用借鉴 第一种,使用VUE BAIDU MAP 网址是:https://dafrok.github.i

IntelliJ IDEA使用教程(动图详解):Emmet 的使用-爱代码爱编程

Emmet 的使用 Emmet 的介绍 Emmet 的前身叫做:Zen Coding,也许熟知旧名的人不在少数。Emmet 一般前端工程师用得比较多,具体它是做什么的,我们通过下面两张 Gif 演示图来说明: IntelliJ IDEA 自带 Emmet 功能,使用的快捷键是 Tab。 Emmet 资料介绍: Emmet 官网

从零到入职-番外篇-Python-网络爬虫-爱代码爱编程

工具准备 Python环境 -> 建议用Anaconda浏览器 -> Chrome (它提供了强大的开发者工具)PycharmWeb应用(需要了解一下网络访问的全过程)HTML(超文本标记协议,组织网页结构内容)CSS(层叠样式表,页面的展示方式)JavaScript(弥补HTML,CSS的不足,为用户提供更丰富的交互模式)爬虫 网络爬虫(

【Javascript】进阶之选项卡在项目中的运用(一)-爱代码爱编程

描述: 点击对应文字描述, 切换到对应的图片(AJAX信息交互方式) 代码实现 HTML <!-- hot live --> <div class="hotlive clearfix"> <!-- title -->