首页 > 试题广场 >

根据规范，以下 HTML 和 CSS 代码解析后， cont

[单选题]
根据规范，以下 HTML 和 CSS 代码解析后， container.clientWidth 的值是:
<style>
#container {
    width: 200px;
    height: 200px;
    padding: 20px;
    margin: 20px;
    border: solide 10px black;
}
</style>

<div id="container">
content
</div>


  • 200
  • 240
  • 280
  • 300
查看正确选项
添加回答
321201910091026686头像 321201910091026686

ele.clientWidth = 宽度 + padding

ele.offsetWidth = 宽度 + padding + border

 ele.scrollTop = 被卷去的上侧距离

 ele.scrollHeight = 自身实际的高度（不包括边框）

发表于 2019-12-14 15:35:29 回复(5)
浪险头像 浪险

发表于 2019-08-23 18:06:22 回复(6)
牛客110612307号头像 牛客110612307号
这题加个260才算是迷惑答案吧
发表于 2020-09-30 08:57:46 回复(0)
夜寻极光。头像 夜寻极光。

 1，clientWidth的实际宽度

        clientWidth = width+左右padding

 2，clientHeigh的实际高度

         clientHeigh = height + 上下padding 

1,offsetWidth的实际宽度

        offsetWidth = width + 左右padding + 左右boder

2,offsetHeith的实际高度

        offsetHeith = height + 上下padding + 上下boder

 1，scrollWidth实际宽度

               scrollWidth：获取指定标签内容层的真实宽度（可视区域宽度+被隐藏区域宽度）。

 2，scrollHeight的实际高度

         scrollHeight：获取指定标签内容层的真实高度（可视区域高度+被隐藏区域高度）
发表于 2021-08-05 13:14:17 回复(0)
haha_头像 haha_

clientWidth相关文档

Element.clientWidth 属性表示元素的内部宽度，以像素计。该属性包括内边距，但不包括垂直滚动条（如果有）、边框和外边距。

故该题为padding+width=40px+200px=240px;

发表于 2019-01-09 14:28:46 回复(0)
珠江牛塘头像 珠江牛塘

  1. 宽高
  • ele.clientWidth = border 以内的宽度
  • ele.clientHeight = border 以内的高度
  • ele.offsetWidth = 包含 border / scroll bar 的宽度
  • ele.offsetHeight = 包含 border / scroll bar 的高度
  • ele.scrollWidth = 自身实际的宽度（包含实际 content、padding）
  • ele.scrollHeight = 自身实际的高度（包含实际 content、padding）
    2. 位置
  • ele.clientLeft = 左边框的宽度
  • ele.clientTop = 上边框的宽度
  • ele.offsetLeft = 父元素边框内到当前元素边框外的距离（左侧偏移值）
  • ele.offsetTop = 父元素边框内到当前元素边框外的距离（上侧偏移值）
  • ele.scrollLeft = 左侧被卷入的距离（当前左滚的距离）
  • ele.scrollTop = 上侧被卷入的距离（当前上滚的距离）
发表于 2022-08-03 20:09:09 回复(0)
牛客985418137号头像 牛客985418137号
很好心的没有260，不然我必错
发表于 2021-11-08 08:35:56 回复(0)
平平无奇的小废物头像 平平无奇的小废物
client是padding+设置的大小
offset是padding+边框+设置的大小
scroll是整个内容区域大小

以下摘自百度：
  • clientLeft,clientTop
    表示内容区域的左上角相对于整个元素左上角的位置（包括边框）。(取决于边框的像数值？)
  • clientWidth,clientHeight
    内容区域的宽高，不包括边框宽度值。
  • clientX、clientY
    点击位置距离当前body可视区域的x，y坐标
  • offsetLeft,offsetTop
    相对于最近的祖先定位元素。
  • offsetParent
    某元素的父元素 例如：this.offsetParent.tagName.toLowerCase() 得到body...
  • offsetWidth,offsetHeight
    整个元素的尺寸(不包括因为滚动条变宽的宽度，包括滚动条的宽度和高度)
  • offsetX, offsetY
    相对于带有定位的父盒子的x，y坐标
  • scrollLeft,scrollTop
    元素滚动的距离大小
  • scrollWidth,scrollHeight
    整个内容区域的宽度(包括需拉动滚动条隐藏起来的那些部分) scrollWidth = scrollTop+clientWidth
  • pageX、pageY
    对于整个页面来说，包括了被卷去的body部分的长度
  • screenX、screenY
    点击位置距离当前电脑屏幕的x，y坐标
  • x、y
    和screenX、screenY一样

发表于 2021-04-14 15:39:05 回复(0)
苏诺尘头像 苏诺尘
 clientWidth = width+左右padding



发表于 2019-12-10 12:04:03 回复(0)
撕裂伤疤头像 撕裂伤疤
clientWidth属性可以返回对象的可视化区域
发表于 2020-05-05 23:49:45 回复(0)
聪明的加菲猫求offer头像 聪明的加菲猫求offer
发表于 2020-03-12 10:02:01 回复(1)
飞向星辰大海头像 飞向星辰大海
虽然边框不影响，但是:border: solide 10px black，solide是打错了还是故意的？
发表于 2020-12-10 08:47:06 回复(1)
牛客476619429号头像 牛客476619429号
clientWidth=context+padding 客户看到的宽度 offestWidth=context+padding+border补偿宽度
发表于 2022-03-24 19:03:06 回复(0)
牛客251457211号头像 牛客251457211号
border-box : offsetWidth = width
                    clientWidth = width - border = scrollWidth
context-box : offsetWidth = width + padding + border
                    clientWidth = width + padding = scrollWidth 

发表于 2021-11-02 00:24:12 回复(0)
墨白wl头像 墨白wl
clientWidth包括内容区和内边距 offsetWidth表示内容区，内边距和边框
发表于 2021-05-08 10:24:06 回复(0)
ID_Spring头像 ID_Spring
ele.clientWidth = width（宽度） + padding（内边距）

ele.offsetWidth = width（宽度） + padding （内边距）+ border（边框）

 ele.scrollTop = 被卷去的上侧距离

 ele.scrollHeight = 自身实际的高度（不包括边框）
发表于 2021-05-03 12:38:26 回复(0)
牛客425244096号头像 牛客425244096号
ele.clientWidth = 宽度 + padding ele.offsetWidth = 宽度 + padding + border ele.scrollTop = 被卷去的上侧距离 ele.scrollHeight = 自身实际的高度（不包括边框）
发表于 2021-03-21 12:31:01 回复(0)
牛客782864172号头像 牛客782864172号
ele.clientWidth = 宽度 + padding ele.offsetWidth = 宽度 + padding + border ele.scrollTop = 被卷去的上侧距离 ele.scrollHeight = 自身实际的高度（不包括边框）
发表于 2020-09-17 10:27:21 回复(0)
yyjbfdm头像 yyjbfdm
clientWidth包含width+左右padding
发表于 2020-09-07 18:26:05 回复(0)
喜欢修勾的95后在查重头像 喜欢修勾的95后在查重
链接：https://www.nowcoder.com/questionTerminal/61f8f5ecca5f4aebbdfda6440f0dda6b?
来源：牛客网

ele.clientWidth = 宽度 + padding

ele.offsetWidth = 宽度 + padding + border

 ele.scrollTop = 被卷去的上侧距离

 ele.scrollHeight = 自身实际的高度（不包括边框）

发表于 2023-02-21 23:49:48 回复(0)
提交观点

问题信息

CSS 前端工程师 2018 360集团 HTML
来自：360公司-2018春...
上传者：小小
难度：
27条回答 3708浏览

热门推荐

相关试题

扫一扫，把题目装进口袋

求职之前，先上牛客

扫描二维码，进入QQ群

扫描二维码，关注牛客公众号