div添加滚动条(div标签添加滚动条步骤)

在网页的实际开发中,有时候需要给div标签元素添加一个滚动条(比如水平的或者垂直的滚动条),我们该怎么写css代码呢?

给div设置滚动条需要分成两步走:

一、设置步骤

1、设置div的高度以及宽度

如果不设置高度和宽度的话,内容多也不会出现滚动条,因为没有边界能让浏览器判断内容长度是否需要出现滚动条。

2、设置div的overflow属性,你可以设置成auto(水平和垂直都有),也可以单独设置overflow-x(水平滚动条),也可以单独设置overflow-y(垂直滚动条)。

二、实例说明

<div style=”height:100px;width:300px;overflow:auto;background:#FFFFFF;”>这里是迷糊笔记这里是迷糊笔记这里是迷糊笔记这里是迷糊笔记这里是迷糊笔记这里是迷糊笔记这里是迷糊笔记</div>

运行如下:

div添加滚动条(div标签添加滚动条步骤)

更多设置

只设置水平滚动条:

<div style=”width:300px;overflow-x:auto”></div>

只设置垂直滚动条:

<div style=”height:100px;overflow-y:auto”></div>

水平和垂直都设置:

<div style=”width:300px;height:100px;overflow-x:auto;overflow-y:auto”></div>

本站无法对海量内容真伪性鉴别,请勿相信本站任何号码,邮件,站外网址等信息,如有需要,请自行甄别。版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至net@163.com举报,一经查实,本站将立刻删除。
(0)
上一篇 2022年12月16日 上午10:27
下一篇 2022年12月16日 上午10:30

相关推荐

发表回复

登录后才能评论