原來我一直以為web頁面中的滾動條寬度是不能精確確定的，因為使用者自己可以在桌面屬性中設定系統滾動條的寬度為任意整數。再加之上次在mymsn的**裡看見m$程式設計師的
注釋，更加讓我認為滾動條的寬度是不能精確計算地。但事實是怎麼樣的呢？
實際上對於
html裡面的容器元素，它們的長、寬之間存在這樣的運算關係：
width = border-left-width + clientwidth + border-right-width;
height = border-top-width + clientheight + border-bottom-width;
但是當容器內出現滾動條後，這個長、寬運算關係將變為：
width = border-left-width + clientwidth +
scrollbar-width + border-right-width;
height = border-top-width + clientheight +
scrollbar-width + border-bottom-width;
下面是乙個div的示例：
style="margin: 25px; padding: 25px; width: 200px; height: 200px; border: solid 25px blue; background-color: yellow; overflow: scroll;"。x
div: clientwidth: 130
div: offsetwidth: 200
上面示例中的scrollbar-width為：offsetwidth - borderleftwidth - borderrightwidth - clientwidth = 200px - 25px - 25px - 130px =
20px。
讓頁面出現滾動條的時候，滾動條不影響頁面寬度
設定body的寬度為window的寬度 以下指令碼控制 body css width window width 同時設定body的overflow 樣式裡寫 bodyps 同理，div裡面的table也是這樣處理 設定tablecontainer 樣式裡寫 tablemain 指令碼控制 的寬度等於...
筆記 頁面中滾動條樣式設定
1 清除頁面中的滾動條 html 谷歌適用 webkit scrollbar 2 修改頁面滾動條樣式 webkit scrollbar 定義滑塊顏色 內陰影及圓角 webkit scrollbar thumb 3 table 新增滾動條 設定滾動屬性 tbody 設定頭與內容自動對齊 table t...
常用頁面滾動條的設定
常用頁面滾動條的設定 1 overflow 內容溢位時的設定 設定被設定 物件是否顯示 滾動條 overflow x 水平方向內容溢位時的設 置overflow y 垂直方向內容溢位時的設 置以上三個屬性設定的 值為visible 預設值 scroll hidden auto。2 scrollbar...