给DIV添加滚动条

最新推荐文章于 2021-04-06 10:06:08 发布
最新推荐文章于 2021-04-06 10:06:08 发布
阅读量67 收藏
点赞数
原文链接：https://yq.aliyun.com/articles/479808
版权
直接为div指定overflow属性为auto即可，但是必须指定div的高度，如下：
<div style="position:absolute; height:400px; overflow:auto">
</div>
如果要出现水平滚动条，则： overflow-x:auto
同理，垂直滚动条为： overflow-y:auto
如果该div被包含在其他对象例如td中，则位置可设为相对：position:relative
 例如：
<HTML> 
<HEAD> 
<TITLE>测试表格内的滚动条</TITLE> 
</HEAD> 

<BODY> 
<table>
  <tr>
    <td>表格内的滚动条:</td>
    <td>
      <div id="wins" 
        style="position:absolute;height:200;width:200;overflow:auto;background:#EEEEEE;"> 
        <p>pppppppppppppppppppppppppppppppppppppppppppppppppp </p> 
        <p>pppppppppppppppppppppppppppppppppppppppppppppppppp </p> 
        <p>ppppppppppppppppppppppppp </p> 
        <p>ppppppppppppppppppppppppp </p> 
        <p>ppppppppppppppppppppppppp </p> 
        <p>ppppppppppppppppppppppppp </p> 
        <p>ppppppppppppppppppppppppp </p> 
        <p>ppppppppppppppppppppppppp </p> 
        <p>ppppppppppppppppppppppppp </p> 
        <p>ppppppppppppppppppppppppp </p> 
        <p>ppppppppppppppppppppppppp </p> 
        <p>ppppppppppppppppppppppppp </p> 
      </div>
    </td>
  </tr>
  <tr>
    <td colspan="2" align="right">
      <span οnmοuseοver='scrollb=setInterval("wins.scrollLeft-=10",100)' 
                 οnmοuseοut=clearInterval(scrollb)>向左</span> 
            <span οnmοuseοver='scrollb=setInterval("wins.scrollTop-=10",100)' 
                        οnmοuseοut=clearInterval(scrollb)>向上</span>
      <span οnmοuseοver='scrollb=setInterval("wins.scrollLeft+=10",100)' 
                 οnmοuseοut=clearInterval(scrollb)>向右</span>
      <span οnmοuseοver='scrollb=setInterval("wins.scrollTop+=10",100)' 
                 οnmοuseοut=clearInterval(scrollb)>向下</span>
    </td>
  </tr>
</table>
</BODY> 
</HTML>


     本文转自NightWolves 51CTO博客，原文链接：
http://blog.51cto.com/yangfei520/381508
，如需转载请自行联系原作者


weixin_34349320
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
DIV怎么自动添加滚动条？并给滚动条添加样式
m0_46652188的博客
07-14 1万+
如何实现当DIV里的内容超过DIV的高度，DIV会自动添加滚动条 1.　div的style设置了overflow:auto后，当DIV里的内容超过DIV的高度，DIV会自动添加滚动条，拉动滚动条才能看到底.
给DIV添加滚动条的实现代码
09-25
今天，我们将探讨如何为 DIV 添加滚动条，并了解相关的 CSS 属性和值。 基本实现 要为 DIV 添加滚动条，只需要在 DIV 元素中添加 `overflow` 属性，并将其值设置为 `auto`。例如： ``` <div style="position:...
div 如何加滚动条
xiaoxiaohui520134的博客
09-04 2102
div 加滚动条的两种方法： 一、 &lt;div style=" overflow:scroll; width:400px; height:400px;”&gt;&lt;/div&gt; 记住宽和高一定要设置噢，否则不成的 不过在不超出时，会有下面的滚动条，所以不是最好的选择   二、 &lt;div style=" overflow-y:auto; overflow-x:auto...
给div添加滚动条
weixin_33713350的博客
06-22 77
直接为div指定overflow属性为auto即可，但是必须指定div的高度，如下： &lt;div style="position:absolute; height:400px; overflow:auto"&gt;&lt;/div&gt;如果要出现水平滚动条，则： overflow-x:auto同理，垂直滚动条为： overflow-y:auto如果该div被包含在其他对象例如td中，则位置...
转: div:给div加滚动条　div的滚动条设置
amkokq884222的博客
01-20 783
div 的滚动条问题： 两种方法： 一、 <div style=" overflow:scroll; width:400px; height:400px;”></div> 记住宽和高一定要设置噢，否则不成的 不过在不超出时，会有下面的滚动条，所以不是最好的选择 二、 <div style=" overflow-y:auto; overfl...
给div加滚动条 div显示滚动条设置代码
09-25
要给div添加滚动条，主要有以下几种方法： 1. 直接设置overflow属性为auto或scroll。当内容超出div设定的高度和宽度时，浏览器会自动为div添加滚动条。代码示例如下： ```html <div style="overflow: auto; width...
css 给div添加滚动并隐藏滚动条
12-28
css 给div添加滚动并隐藏滚动条 ，具体代码如下所示:  在html中 <div class=box> <div>下面内容会单独滚动</div> <div class=scroll> <div class=content> <p>1111111111111111 <p>222222222222222 <p>...
js固定DIV高度,超出部分自动添加滚动条的简单方法
12-10
通过JavaScript，我们可以动态地设置`div`的高度和溢出处理方式，以达到固定高度并自动添加滚动条的效果。 首先，我们来看给出的JavaScript代码片段： ```javascript function setheight() { var div = document....
div滚动条设置
xxwacm的专栏
11-04 1054
两种方法： 一、 记住宽和高一定要设置噢，否则不成的 二、 记住宽和高一定要设置噢，否则不成的 这样比较好的是，在宽和高不超出时，只是一条线 三、说明 直接为div指定overflow属性为auto即可，但是必须指定div的高度，如下： 如果要出现水平滚动条，则： overflow-x:auto 同理，垂直滚动条为： overflow-y:auto 如果该d
div如何添加滚动条？
Free雅轩的博客
04-06 3063
div 添加滚动条只需要指定 overflow 属性为 auto 即可。 以下实例设置了 div 水平滚动条： 实例 <div style="height:300px;width:70px;overflow:auto;background:#EEEEEE;"> 菜鸟教程 -- 学的不仅是技术，更是梦想！！！ 菜鸟教程 -- 学的不仅是技术，更是梦想！！！ 菜鸟教程 -- 学的不仅是技术，更是梦想！！！ 菜鸟教程 -- 学的不仅是技术，更是梦想！！！ </div>.
div 添加滚动条
weixin_45804159的博客
01-12 424
垂直滚动条： <div style="height:300px;width:200px;overflow-y:auto;background:#EEEEEE;"> <button id="btn_Grid_comm" class="md-trigger btn btn-menu btn-sm" data-modal="modal-1"> 主机通 </button> <button id="btn_Grid_comm" class="md-trigger b
div:给div加滚动条　div的滚动条设置
热门推荐
晴朗_Raymond
04-13 21万+
<br />今天做了个例子：<br />div 的滚动条问题：<br />两种方法：<br />一、<br /><div style=" overflow:scroll; width:400px; height:400px;”></div><br />记住宽和高一定要设置噢，否则不成的<br /><br />不过在不超出时，会有下面的滚动条，所以不是最好的选择<br /> <br />二、<br /><div style=" overflow-y:auto; overflow-x:auto; width:4
HTML中如何在div中实现滚动条？
u014704496的专栏
06-24 1912
overflow:scroll; /*任何时候都强制显示滚动条*/ overflow:auto; /*需要的时候会出现滚动条*/ overflow-x:auto; /*控制X方向的滚动条*/ overflow-y:auto; /*控制Y方向的滚动条*/ 受overflow影响的必需是块元素，并且指定宽度和高度，否则内部元素将自动将父级容器撑开。 实例
为程序界面添加滑动条--createTrackbar（）
u014310328的专栏
06-07 1734
createTrackbar（ ） 作用：创建一个滚动条并把它附加到特定的窗口中。 形式：int createTrackbar(const string& trackbarname, const string& winname, int* value, int count, TrackbarCallback onChange=0, void* userdata=0)； 参数：  tra
如何给给div里加上滚动条
wxy0123450的博客
05-20 1043
在想加滚动条的div 的style 加上 必须给div 宽和高overflow:auto想给div更改样式（自带的样式太丑）/*滚动条样式*/ .innerbox::-webkit-scrollbar {/*滚动条整体样式*/ width: 4px; /*高宽分别对应横竖滚动条的尺寸*/ height: 4px; } .innerbox::-webkit-scrollbar...
2进制3位数过去现在将来输赢公式代码.txt
最新发布
09-07
2进制3位数过去现在将来输赢公式代码
js在以div添加滚动条
06-07
在JavaScript中，可以通过设置CSS样式来为一个div元素添加滚动条。具体方法如下： 1. 首先，获取需要添加滚动条的div元素，可以使用document.querySelector()或document.getElementById()等方法获取。 2. 然后，设置div元素的CSS样式overflow为auto或scroll，这会自动为元素添加一个滚动条。 例如，如果需要为id为myDiv的div元素添加滚动条，代码如下： ```javascript var myDiv = document.getElementById('myDiv'); myDiv.style.overflow = 'auto'; // 或者 myDiv.style.overflow = 'scroll'; ``` 这样，当myDiv元素的内容超出其高度时，就会出现一个滚动条，用户可以通过滚动条来查看全部内容。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值