1.總頁(yè)面
設(shè)計(jì)規(guī)則，一個(gè)小頁(yè)面對(duì)應(yīng)有一個(gè).css文件，一個(gè)大頁(yè)面由多個(gè)小頁(yè)面組成。
系統(tǒng)頁(yè)面的BOX
zong.jsp
<%@ page language="java" contentType="text/html; charset=utf-8"
pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
</head>
<%-- <%
String prcode = request.getParameter("prcode");
%> --%>
<frameset rows="*" cols="250,*" framespacing="0" frameborder="no" border="0" frameborder="0">
<frame src="<%=request.getContextPath()%>/shejiwenjuan3menu1.action?prcode=${prcode }" name="sej_leftFrame" scrolling="No" noresize="noresize" id="sej_leftFrame" title="leftFrame" frameborder="no" border="0" frameborder="0"/>
<frame src="<%=request.getContextPath()%>/turnTo.action?pr_Code=${prcode }&type=zonghe"" name="sej_mainFrame" id="sej_mainFrame" title="mainFrame" noresize="noresize" frameborder="no" border="0" frameborder="0" scrolling="auto"/>
<%-- <frame src="<%=request.getContextPath()%>/turnTo.action?pr_Code=${prcode }&type=basicInformation" name="sej_mainFrame" id="sej_mainFrame" title="mainFrame" noresize="noresize" frameborder="no" border="0" frameborder="0" scrolling="auto"/> --%>
<%-- <frameset rows="*,15" cols="0,*" framespacing="0" frameborder="no" border="0" frameborder="0" >
<frame src="<%=request.getContextPath()%>/shejiwenjuanboxc.action" name="sej_leftFrame1" scrolling="No" noresize="noresize" id="sej_leftFrame1" title="sej_leftFrame1" frameborder="no" border="0" frameborder="0" />
<frame src="<%=request.getContextPath()%>/changView.action?prcode=${prcode }&id=${id }"
name="sej_mainFrame" id="sej_mainFrame" title="mainFrame" noresize="noresize" frameborder="no" border="0" frameborder="0" scrolling="auto"/>
</frameset> --%>
</frameset>
<noframes><body>
</body></noframes>
</html>
注意：
frame屬性：
scrolling 屬性規(guī)定是否在 iframe 中顯示滾動(dòng)條。
默認(rèn)地，如果內(nèi)容超出了 iframe，滾動(dòng)條就會(huì)出現(xiàn)在 iframe 中。
auto 在需要的情況下出現(xiàn)滾動(dòng)條（默認(rèn)值）。
yes 始終顯示滾動(dòng)條（即使不需要）。
no 從不顯示滾動(dòng)條（即使需要）。
在總頁(yè)面的frame中為一小頁(yè)面設(shè)計(jì)了滾動(dòng)效果，無(wú)需在小頁(yè)面中用overflow:auto屬性去設(shè)置滾動(dòng)。
2.小頁(yè)面
小頁(yè)面利用引用了一個(gè)全局樣式，大部分頁(yè)面都是不要滾動(dòng)條的，少數(shù)有問(wèn)卷填充的需要滾動(dòng)條，
<!-- 全局樣式 -->
<link rel="stylesheet" href="<%=request.getContextPath()%>/css/main.css">
里面有一個(gè)屬性：
::-webkit-scrollbar {
width: 0
}
因此我的小頁(yè)面無(wú)論如何設(shè)置都出不來(lái)滾動(dòng)條，如果我不引用該文件，小頁(yè)面的滾動(dòng)條就能正常顯示。恰強(qiáng)引用的少，所以沒(méi)啥關(guān)系，可是我又不甘心啊，如果引用到很多全局樣式是不可能不引用的呀。我想肯定有個(gè)屬性可以覆蓋掉它。我直接在小頁(yè)面里添加了同樣的屬性，結(jié)果居然都生效了
兩個(gè)都勾掉的時(shí)候滾動(dòng)條出來(lái)了，
似乎只要用到了 ::-webkit-scrollbar 屬性不管值為多少都消失了，重點(diǎn)是說(shuō)好的優(yōu)先級(jí)呢，同一個(gè)屬性還能一起顯示，有點(diǎn)凌亂了。寫成body: ::-webkit-scrollbar 也是一樣顯示。
用frame的Scrolling確實(shí)可以，可是還得找iframe滾動(dòng)條太長(zhǎng)又得設(shè)置高度，所以我就直接在小頁(yè)面的盒子里用了Overflow:auto,再給盒子加個(gè)高度就好了。
注意：
定義滾動(dòng)條就是利用偽元素與偽類，那什么是偽元素和偽類呢？
偽類大家應(yīng)該很熟悉:link,:focus,:hover，此外CSS3中又增加了許多偽類選擇器，如:nth-child，:last-child，:nth-last-of-type()等。
CSS中的偽元素大家以前看過(guò)：:first-line,:first-letter,:before,:after。那么在CSS3中，偽元素進(jìn)行了調(diào)整，在以前的基礎(chǔ)上增加了一個(gè)“：”也就是現(xiàn)在變成了“::first-letter,::first-line,::before,::after”，另外CSS3還增加了一個(gè)“::selection”。兩個(gè)“：：”和一個(gè)“：”在css3中主要用來(lái)區(qū)分偽素和偽元類。
webkit的偽類和偽元素的實(shí)現(xiàn)很強(qiáng)，可以把滾動(dòng)條當(dāng)成一個(gè)頁(yè)面元素來(lái)定義，再結(jié)合一些高級(jí)的CSS3屬性，比如漸變、圓角、RGBa等等。然后如果有些地方要用圖片，可以把圖片也可以轉(zhuǎn)換成Base64，不然每次都得加載那個(gè)多個(gè)圖片，增加請(qǐng)求數(shù)。
這個(gè)偽類可以將webkit自身的滾動(dòng)條渲染關(guān)閉，只按照用戶自定義的css信息進(jìn)行渲染。
問(wèn)題：應(yīng)用CSS文件帶有::-webkit-scrollbar:width=0;的屬性怎么覆蓋掉
