元素滚动条占据部分是否占据height和width尺寸

简介:

本章节介绍一下元素的滚动条占据的部分是否包含在此height或者width尺寸之中

下面就通过代码实例做一下演示。

代码如下:

 
01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
<!DOCTYPE html>< html >
< head >
< meta charset = " utf-8" >
< meta name = "author" content = "http://www.softwhy.com/" />
< title >scrollWidth和scrollHeight属性-蚂蚁部落</ title >
< style type = "text/css" >
*{
   margin:0px;
   padding:0px;
}
#box{
   width:200px;
   height:150px;
   background-color:red;
   margin:0px auto;
   margin-top:50px;
   overflow:scroll;
   padding:0px;
}
</ style >
</ head >
< body >
< div id = "box" ></ div >
</ body >
</ html >

在上面的演示效果可以看出,滚动条占据的部分包含在height和width中。


原文发布时间为:2017-2-17

本文作者:admin

本文来自云栖社区合作伙伴“蚂蚁部落”,了解相关信息可以关注蚂蚁部落

原文链接:元素滚动条占据部分是否占据height和width尺寸

相关文章
|
2月前
|
前端开发
盒子的宽与高
盒子的宽与高。
32 4
|
4月前
|
前端开发 容器
你不知道的css——1. 外在盒子、内在盒子,宽度和高度的计算,box-sizing属性
你不知道的css——1. 外在盒子、内在盒子,宽度和高度的计算,box-sizing属性
28 3
你不知道的css——1. 外在盒子、内在盒子,宽度和高度的计算,box-sizing属性
|
4月前
|
前端开发
css的flex布局中使用margin:auto智能分配剩余空间
css的flex布局中使用margin:auto智能分配剩余空间
44 1
|
4月前
|
前端开发
你不知道的css——2. 百分比高度失效,绝对定位和非绝对定位元素的宽高百分比计算方法的不同
你不知道的css——2. 百分比高度失效,绝对定位和非绝对定位元素的宽高百分比计算方法的不同
61 1
|
6月前
|
前端开发
元素的宽度和高度
【5月更文挑战第4天】元素的宽度和高度。
38 8
|
6月前
|
前端开发
css如何将border线加到元素内部,占内边距,不占外边距
css如何将border线加到元素内部,占内边距,不占外边距
327 0
|
前端开发
CSS布局讲解-float浮动布局使用
CSS布局讲解-float浮动布局使用
CSS3 背景图片显示尺寸(放大/缩小背景图)(background-size) (背景适配 自适应)
CSS3 背景图片显示尺寸(放大/缩小背景图)(background-size) (背景适配 自适应)
|
前端开发
css:grid布局子元素被撑开导致没有按比例均分
css:grid布局子元素被撑开导致没有按比例均分
380 0
css:grid布局子元素被撑开导致没有按比例均分
div高度自适应宽度按比例放大
导语:我们经常会碰到这样的需求:要求div高度跟随宽度变化而变化。在手机端,一张图片作为div的背景图,图片宽高比不一致,并要求div宽高比与图片宽高比一致;怎么实现这种需求呢? 原理 padding-top: 50%;用这个属性的百分比,padding-top的百分比是相对于父元素的宽度,比如:...
1741 0