学习笔记 css overflow

阳光穿透心脏的1/2处 2023-02-14 05:48 95阅读 0赞

[学习笔记 css overflow][css overflow]

![20200601100534243.png][]

<html>
    	<head>
    		<style type="text/css">
    			#v {
    				background-color:#00FFFF;
    				width:100px;
    				height:80px;
    				float: left;
    				margin: 5px;
    			}
    			#h {
    				background-color:#00FFFF;
    				width:100px;
    				height:80px;
    				float: left;
    				margin: 5px;
    				overflow: hidden;
    			}
    			#s {
    				background-color:#00FFFF;
    				width:100px;
    				height:80px;
    				float: left;
    				margin: 5px;
    				overflow: scroll;
    			}
    			#a {
    				background-color:#00FFFF;
    				width:100px;
    				height:80px;
    				float: left;
    				margin: 5px;
    				overflow: auto;
    			}
    			#i {
    				background-color:#00FFFF;
    				width:100px;
    				height:80px;
    				float: left;
    				margin: 5px;
    				overflow: inherit;
    			}
    		</style>
    	</head>
    
    	<body>
    		<p>overflow 属性规定当内容溢出元素框时发生的事情。</p>
    
    		<div id="v">
    			visible默认值。内容不会被修剪，会呈现在元素框之外。
    		</div>
    		<div id="h">
    			hidden。 内 容 会 被 修 剪，并 且 其 余 内  容 是不可见的。
    		</div>
    		<div id="s">
    			scroll。内容会被修剪，但是浏览器会显示滚动条以便查看其余的内容。
    		</div>
    		<div id="a">
    			auto。如果内容被修剪，则浏览器会显示滚动条以便查看其余的内容。
    		</div>
    		<div id="i">
    			inherit。规定应该从父元素继承 overflow 属性的值。
    		</div>
    	</body>
    </html>

[css overflow]: https://blog.csdn.net/InJavaWeTrust/article/details/106466993
[20200601100534243.png]: https://img-blog.csdnimg.cn/20200601100534243.png

发表评论取消回复

表情：

评论列表（有 0 条评论，95人围观）

还没有评论，来说两句吧...

相关阅读

相关 CSS overflow-anchor

为了认识这个属性, 我们需要先看一种常见的现象. 即在网页加载中, 图片常常比文字加载更慢, 这样图片加载完成后可能会将文字向下顶. 比如下图演示

ゝ一纸荒年。/ 2024年05月24日 03:46/ 0 赞/ 88 阅读

相关 HTML CSS属性overflow、white-space、text-overflow

.li { width:20%; float:left; // 文本或图像会移至父元素中的左侧。 overflow: hidden; //

比眉伴天荒/ 2023年10月16日 22:08/ 0 赞/ 48 阅读

相关学习笔记 css overflow

[学习笔记 css overflow][css over

阳光穿透心脏的1/2处/ 2023年02月14日 05:48/ 0 赞/ 96 阅读

相关 CSS之overflow

第1章基本属性 1.1overflow的五种取值 visible（默认） hidden scroll auto inherit

╰+攻爆jí腚メ/ 2022年09月23日 08:28/ 0 赞/ 319 阅读

相关 css overflow属性

定义和用法： overflow属性规定当内容溢出元素框时发生的处理。属性值： 1：visible 默认值。内容不会被修剪，会呈现在元素

蔚落/ 2022年07月14日 09:27/ 0 赞/ 200 阅读

相关 css的overflow属性

css的overflow属性规定内容溢出元素框时，如何处理溢出内容。 overflow属性可能的值： visible：默认值，内容不会被修剪，会呈现在元素框之外。 hid

亦凉/ 2022年06月07日 05:19/ 0 赞/ 246 阅读

相关【CSS】布局 - Overflow

CSS overflow 属性用于控制内容溢出元素框时显示的方式。 <style> overflowTest { background: 4C

系统管理员/ 2022年04月23日 08:42/ 0 赞/ 200 阅读

相关 CSS学习笔记

插入样式表的方法：有三种样式表：元素内嵌样式表、文档内嵌样式表以及外部样式表。元素内嵌样式表和文档内嵌样式表： 1 <!DOCTYPE html>

绝地灬酷狼/ 2021年12月10日 07:15/ 0 赞/ 449 阅读

相关 CSS学习笔记

> 学习网址:https://www.w3school.com.cn/ > 持续学习，持续更新 > 如有错误，欢迎指点基础一.简介 1.CSS 指层叠

叁歲伎倆/ 2021年09月07日 06:04/ 0 赞/ 440 阅读

相关 CSS学习笔记：溢出文本省略（text-overflow）

在`CSS3`中，`text-overflow`属性的基本语法如下： `clip`:表示不显示省略文本，简单的裁切。 `ellipsis`:表示对象文本溢出时显示

怼烎@/ 2021年06月26日 16:06/ 0 赞/ 422 阅读