《前台设计细节》由会员分享，可在线阅读，更多相关《前台设计细节（33页珍藏版）》请在金锄头文库上搜索。
1、1、 关于手型光标（csscursor:hand;）在css中定义cursor:hand;并不能稳定运行，也不是W3C标准，标准的做法cursor:pointer;2、 关于style、currentStyle、getComputedStyle样式表分为以下几种：直接写在tag上的为内嵌样式、写在head元素的style标签中的为内部样式、link引入的为外部样式。内嵌样式，可以通过Dom.style.样式名称获取，需要注意的时样式名称是驼峰格式内部样式和外部样式通过style.样式名称是无法获取的，需要通过currentStyle/getComputedStyle来获取，如果硬是使用styl
2、e的话，你将只能得到一个空值。如果获取样式时，返回的值是“auto”怎么办？使用offset+样式名称（首字母大写）3、 样式表的offset、client、scroll和currentStyle属性offsetHeight = borderTopWidth + clientHeight + scrollbarWidth + borderBottomWidth; offsetWidth = borderLeftWidth + clientWidth + scrollbarWidth + borderRightWidth; 元素内部实际可用区域(高) = clientHeight - paddi
3、ngTopWidth - paddingBottomWidth; 元素内部实际可用区域(宽) = clientWidth - paddingLeftWidth - paddingRightWidth; scrollHeight：文章的实际高度，不管是否已经用纵向滚动条浏览过。 scrollWidth：文章的实际宽度，不管是否已经用横向滚动条浏览过。 scrollTop：用纵向滚动条滚过的高度。 scrollLeft：用横向滚动条滚过的宽度。 文章未滚过部分(高) = scrollHeight - scrollTop - clientHeight; 文章未滚过部分(宽) = scrollWidt
4、h - scrollLeft - clientWidth; offsetTop： 如果position是absolute，则是相对于body（纵向滚动条滚到最上面，横向滚动条滚到最左面）左上角那个点y轴之间的差。如果是 relative，则是相对于上方或外层元素y轴上的差值。如果是static（position的默认值），则该属性没有意义。 offsetLeft： 如果position是absolute，则是相对于body（纵向滚动条滚到最上面，横向滚动条滚到最左面）左上角那个点x轴之间的差。如果是 relative，则是相对于上方或外层元素x轴上的差值。如果是static（position的
5、默认值），则该属性没有意义。 clientTop：等同于borderTopWidth。 clientLeft：等同于borderLeftWidth。 currentStyle： height：等同于clientHeight。 width：等同于clientWidth。 left：等同于offsetLeft。 top：等同于offsetTop。 padding：共有4个，可以单独指定，也可以一起指定。该值是指元素border距元素内可用区域之间的距离。 margin：共有4个，可以单独指定，也可以一起指定。该值是指距相邻/周围元素之间的距离。当元素position为relative时，其4个值分
6、别等同于top、right、bottom和left4、 四种浏览器对 clientHeight、offsetHeight、scrollHeight、clientWidth、offsetWidth 和 scrollWidth 的解释差异网页可见区域宽：document.body.clientWidth 网页可见区域高：document.body.clientHeight 网页可见区域宽：document.body.offsetWidth (包括边线的宽) 网页可见区域高：document.body.offsetHeight (包括边线的宽) 网页正文全文宽：document.body.scrol
7、lWidth 网页正文全文高：document.body.scrollHeight 网页被卷去的高：document.body.scrollTop 网页被卷去的左：document.body.scrollLeft 网页正文部分上：window.screenTop 网页正文部分左：window.screenLeft 屏幕分辨率的高：window.screen.height 屏幕分辨率的宽：window.screen.width 屏幕可用工作区高度：window.screen.availHeight 屏幕可用工作区宽度：window.screen.availWidthIE（Internet Exp
8、lorer）、NS（Netscape）、Opera、FF（FireFox）的区别：clientHeight四种浏览器对 clientHeight 的解释都没有什么异议，都认为是内容可视区域的高度，也就是说页面浏览器中可以看到内容的这个区域的高度，一般是最后一个工具条以下到状态栏以上的这个区域，与页面内容无关。offsetHeightIE、Opera 认为 offsetHeight = clientHeight + 滚动条 + 边框。NS、FF 认为 offsetHeight 是网页内容实际高度，可以小于 clientHeight。scrollHeightIE、Opera 认为 scrollHe
9、ight 是网页内容实际高度，可以小于 clientHeight。NS、FF 认为 scrollHeight 是网页内容高度，不过最小值是 clientHeight。简单地说clientHeight 就是透过浏览器看内容的这个区域高度。NS、FF 认为 offsetHeight 和 scrollHeight 都是网页内容高度，只不过当网页内容高度小于等于 clientHeight 时，scrollHeight 的值是 clientHeight，而 offsetHeight 可以小于 clientHeight。IE、Opera 认为 offsetHeight 是可视区域 clientHeight
10、 滚动条加边框。scrollHeight 则是网页内容实际高度。同理clientWidth、offsetWidth 和 scrollWidth 的解释与上面相同，只是把高度换成宽度即可。注：以上也是转的，对自己有点参考而已，有些值要跟据页面方式而定！我用的Ajax就完全没法用上面的方法定高！javaScript窗口属性：网页可见区域宽：document.body.clientWidth网页可见区域高：document.body.clientHeight网页可见区域宽：document.body.offsetWidth (包括边线的宽)网页可见区域高：document.body.offsetHe
11、ight (包括边线的宽)网页正文全文宽：document.body.scrollWidth网页正文全文高：document.body.scrollHeight网页被卷去的高：document.body.scrollTop网页被卷去的左：document.body.scrollLeft网页正文部分上：window.screenTop网页正文部分左：window.screenLeft屏幕分辨率的高：window.screen.height屏幕分辨率的宽：window.screen.width屏幕可用工作区高度：window.screen.availHeight屏幕可用工作区宽度：window.s
12、creen.availWidth在IE、FireFox、Opera下都可以使用document.body.clientWidthdocument.body.clientHeight即可获得，很简单，很方便。而在公司项目当中：Opera仍然使用document.body.clientWidthdocument.body.clientHeight可是IE和FireFox则使用document.documentElement.clientWidthdocument.documentElement.clientHeight原来是W3C的标准在作怪啊http:/www.w3.org/TR/xhtml1/
13、DTD/xhtml1-transitional.dtd如果在页面中添加这行标记的话在IE中：document.body.clientWidth = BODY对象宽度document.body.clientHeight = BODY对象高度document.documentElement.clientWidth = 可见区域宽度document.documentElement.clientHeight = 可见区域高度注：在IE中“可见区域”基本不认可body，而必需使用documentElement！在FireFox中：document.body.clientWidth = BODY对象宽度d
14、ocument.body.clientHeight = BODY对象高度document.documentElement.clientWidth = 可见区域宽度document.documentElement.clientHeight = 可见区域高度在Opera中： document.body.clientWidth = 可见区域宽度document.body.clientHeight = 可见区域高度document.documentElement.clientWidth = 页面对象宽度（即BODY对象宽度加上Margin宽）document.documentElement.clien
15、tHeight = 页面对象高度（即BODY对象高度加上Margin高）获取窗口高宽：var w= document.documentElement.offsetWidth;var h=document.documentElement.offsetHeight;完整的代码（自己写的：张伟） get style properties across different browser #test position: absolute; top:auto; left: auto; width: 190px; height: 28px; padding-left: 10px; border-color: bisque; border-wid
