![overflow的属性以及用法[试论与浅谈]](/0.jpg)
大家好，我是架构君，一个会写代码吟诗的架构师。今天说一说overflow的属性以及用法[试论与浅谈],希望能够帮助大家进步!!!
Overflow属性定义了当元素溢出规定内容区域时所发生的事情。当一个元素固定为某个大小，在内容区放不下时，就可以用overflow来解决。
属性值：visible、hidden、scroll、auto、inherit
① Visible:定义为默认值，元素会显示他原来的大小，不会被剪切隐藏，会正常呈现在规定内容区之外。
代码语言：javascript复制 1
2
3
4
5
6
7
15
16
17
少年闰土
18
19
20 执行效果：
元素的内容没有被隐藏，在规定内容区外部也可见。
② Hidden:元素的内容会被修剪，且多出规定内容区的部分不可见。
代码语言：javascript复制 1
2
3
4
5
6
7
15
16
17
边城
18
19
20 执行效果：
元素内容被隐藏，多余部分不可见。
③ Scroll：元素的内容会被修剪，可以用浏览器滚动条的方式显示元素其余内容。
代码语言：javascript复制 1
2
3
4
5
6
7
15
16
17
围城
18
19
20 执行效果：
④ Auto:如果元素内容被修剪，可以用浏览器滚动条的方式显示元素其余内容。
代码语言：javascript复制 1
2
3
4
5
6
7
21
22
23
桃花庵歌
24
桃花坞里桃花庵，桃花庵下桃花仙；桃花仙人种桃树，又摘桃花卖酒钱。
25 酒醒只在花前坐，酒醉还来花下眠；半醒半醉日复日，花落花开年复年。
26 但愿老死花酒间，不愿鞠躬车马前；车尘马足富者趣，酒盏花枝贫者缘。
27 若将富贵比贫贱，一在平地一在天；若将贫贱比车马，他得驱驰我得闲。
28 别人笑我太疯癫，我笑他人看不穿；不见五陵豪杰墓，无花无酒锄作田。
29
海上劳工
30
31
32 执行结果：
⑤ Inherit:从父元素继承overflow属性的值。
今天文章到此就结束了，感谢您的阅读，Java架构师必看祝您升职加薪，年年好运。