一天搞定CSS： overflow--14

overflow：针对超出父级的内容如何显示

代码演示

<!DOCTYPE html>
<html><head><meta charset="UTF-8"><title></title><style>.parent{width: 100px;height: 100px;border: 5px solid #f00;overflow: visible;overflow: auto;overflow: hidden;overflow: scroll;}.parent div{/*1.overflow：visible时，子标签溢出父级*/width: 200px;height: 200px;/*2.子类比父级小时*//*width: 50px;height: 50px;*/background: green;}</style></head><body><!--overflow            针对超出父级的内容如何显示visible         默认值，超出的内容会显示出来auto            如果内容超出了父级，那就出现滚动条。如果内容没有超出，就没有滚动条hidden          超出的内容隐藏掉scroll          不管内容有没有超出，都会出现滚动条--><div class="parent"><div></div></div></body>
</html>

效果图：

overflow：visible

一天搞定CSS： overflow--14相关推荐

CSS自学教程--一天搞定CSS（终篇总结）
虽然说是一天搞定CSS,实际上也没有那么简单.只能说让你快速了解常见的CSS知识,解决基本的页面样式布局和设置. 每个独立的CSS知识点都比较简单,但是它们的应用非常灵活,特别是在综合应用中. 粗略说 ...
sass笔记-1|Sass是如何帮你又快又好地搞定CSS的
Sass学习笔记持续整理中,开篇不讲怎么安装,sass是什么,这些搜索引擎会告诉你,我们从sass的作用开始讲起,知道sass用来干什么,有什么作用,我们才能相信用sass的好处,并且时时刻刻想着sa ...
精通CSS与HTML设计模式第一章（轻松搞定CSS）
精通CSS与HTML设计模式第一章(轻松搞定CSS) 精通CSS与HTML设计模式第二章(HTML设计模式) 精通CSS与HTML设计模式第三章(CSS选择符与继承) 精通CSS与HTML设计模 ...
一篇搞定css基础（超详细，附代码）
第一章:css概述 1.1.css的简介 1)什么是CSS css中文名称叫层叠样式表,层叠为css的布局,表示布局方式是通过一层层来实现的:样式是布局层的显示效果,主要是通过css提供的一些属性和属 ...
十分钟搞定CSS选择器
在最近的web开发中是不是就会用到一些选择器,发现很多尤其是CSS3新增的不太熟悉,在此总结一下. 优先级不同级别 1. 在属性后面使用 !important 会覆盖页面内任何位置定义的元素样式. ...
一张图搞定CSS选择器的优先级
0 总览如果发生CSS的冲突问题, 即A样式与B样式冲突 1 首先比较CSS样式的来源不同的来源有不同的优先级如果来源相同, 即同源时, 则进入下一阶段2 比较是否为内联样式如果A样式与B样式同源, ...
一天搞定CSS（扩展）：CSS Hack
做前端多年,虽然不是经常需要hack,但是我们经常会遇到各浏览器表现不一致的情况.基于此,某些情况我们会极不情愿的使用这个不太友好的方式来达到大家要求的页面表现.我个人是不太推荐使用hack的,要知道 ...
一天搞定CSS：表单（form）--20
1.表单标签 2.input标签属性与取值代码演示 <!DOCTYPE html> <html><head><meta charset="UTF- ...
一天搞定CSS：BFC布局与普通文档流布局比较--15
BFC:Block Formatting Contexts–块级元素格式化上下文 1.BFC定义它决定了块级元素如何对它的内容进行布局,以及与其它元素的关系和相互作用关键词解释: 块级元素:父级( ...

一天搞定CSS： overflow--14

一天搞定CSS： overflow--14相关推荐

最新文章

热门文章