在原来的 html 的时候，我们可以这样定义整个页面的滚动条

  body{

  scrollbar-3dlight-color:#D4D0C8; /- 最外左 -/

  scrollbar-highlight-color:#fff; /- 左二 -/

  scrollbar-face-color:#E4E4E4; /- 面子 -/

  scrollbar-arrow-color:#666; /- 箭头 -/

  scrollbar-shadow-color:#808080; /- 右二 -/

  scrollbar-darkshadow-color:#D7DCE0; /- 右一 -/

  scrollbar-base-color:#D7DCE0; /- 基色 -/

  scrollbar-track-color:#;/- 滑道 -/

  }

  但是同样的代码，我们应用在 xhtml 下就不起作用了，我相信好多朋友也遇到过同样的问题

  那么怎么才能在 xhtml 下应用滚动条样式呢？看下列代码

  html{

  scrollbar-3dlight-color:#D4D0C8; /- 最外左 -/

  scrollbar-highlight-color:#fff; /- 左二 -/

  scrollbar-face-color:#E4E4E4; /- 面子 -/

  scrollbar-arrow-color:#666; /- 箭头 -/

  scrollbar-shadow-color:#808080; /- 右二 -/

  scrollbar-darkshadow-color:#D7DCE0; /- 右一 -/

  scrollbar-base-color:#D7DCE0; /- 基色 -/

  scrollbar-track-color:#;/- 滑道 -/

  }

  这段代码和上一段唯一的不同就是在 CSS 定义的元素上，一个是 body 一个是 html。我们再测试一下，把 html 页面的"body"修改成"html"测试一下，发现依然可以实现效果。那到底是为什么呢？

  从字面上来看，xhtml 比 html 多一个 x,那么这个 x 其实也就是 xml,为什么要加一个 xml 在里面？其实最根本的原因就是要让 html 更加结构化标准化（因为 html 实在是太烂）。我们在 html 里面定义的是 body，因为 html 不是很标准所以这样可以生效，而在xhtml里面这样就不行了css滚动条样式上下箭头，我看看那个图很明显，body 标签本身不是根元素，只有 html 才是根元素，而页面的滚动条也是属于根元素的，所以这就是我们为什么定义 body 没有效果的原因，因为我们定义的只是一个子原素。ok，我们知道了原理，来做一个试验如果把定义"body"或"xhtml"换成​*​，

  *{

  scrollbar-3dlight-color:#D4D0C8;

  scrollbar-highlight-color:#fff;

  scrollbar-face-color:#E4E4E4;

  scrollbar-arrow-color:#666;

  scrollbar-shadow-color:#808080;

  scrollbar-darkshadow-color:#D7DCE0;

  scrollbar-base-color:#D7DCE0;

  scrollbar-track-color:#;

  }

  在html和xhtml都通过，因为*就是定义页面上的任何标签当然也包括了“html”这个标签。

  (ps:其实与其说是 html 与 xhtml 的区别到不如说是有无 XHTML 1.0 transitional doctype的区别，但是如果你把页面的 XHTML 1.0 transitional doctype 去掉的话，那么这个页面就没有 doctypecss滚动条样式上下箭头，默认的显示方式就是html4.01,不过你要把XHTML 1.0 transitional doctype 修改成 HTML 4.01 doctype 同样页面定义 body 也不会有效果的，虽然这个页面的标准是html 4.01)