手机
当前位置:查字典教程网 >网页设计 > Div+Css教程 >scrollWidth,clientWidth与offsetWidth的区别
scrollWidth,clientWidth与offsetWidth的区别
摘要:scrollWidth是对象的实际内容的宽,不包边线宽度,会随对象中内容的多少改变(内容多了可能会改变对象的实际宽度)。clientWidt...

scrollWidth

是对象的实际内容的宽,不包边线宽度,会随对象中内容的多少改变(内容多了可能会改变对象的实际宽度)。

clientWidth

是对象可见的宽度,不包滚动条等边线,会随窗口的显示大小改变。

offsetWidth

是对象的可见宽度,包滚动条等边线,会随窗口的显示大小改变。

一个scrollWidth和clientWidth的例子:

<html>

<head>

<title>77.htm文件</title>

</head>

<body>

<textareawrap="off"onfocus="alert('scrollWidth:'+this.scrollWidth+'nclientWidth:'+this.clientWidth);"></textarea>

</body>

</html>

在文本框内输入内容,当横向滚动条没出来前scrollWidth和clientWidth的值是一样的。当一行内容超出文本框的宽度,就有横向滚动条出来了,scrollWidth的值就变了。

scrollWidth是对象实际内容的宽度。

clientWidth是对象看到的宽度(不含边线),这个例子里不会改变。

一个clientWidth和offsetWidth的例子:

<html>

<head>

<title>77.htm文件</title>

</head>

<body>

<textareawrap="off"onfocus="alert('offsetWidth:'+this.offsetWidth+'nclientWidth:'+this.clientWidth);"></textarea>

</body>

</html>

offsetWidth的值总是比clientWidth的值大。

clientWidth是对象看到的宽度(不含边线)

offsetWidth是对象看到的宽度(含边线,如滚动条的占用的宽)

【scrollWidth,clientWidth与offsetWidth的区别】相关文章:

border:none;与border:0;的区别

完全css弹出菜单

div中class与id的区别及应用

表单中Readonly和Disabled的区别详解

垂直三栏布局拥有相同高度的方法

DIV边距属性在Chrome和IE中的区别

VB中Byval和byref的区别

三列宽度自适应结构中的的DIV写法

怎样成为顶尖的CSS设计师

css中元素水平垂直居中4种方法介绍

精品推荐
分类导航