1,Overflow內(nèi)容溢出時(shí)的設(shè)置
屬性:
overflow 水平及垂直方向內(nèi)容溢出時(shí)的設(shè)置
overflow-x 水平方向內(nèi)容溢出時(shí)的設(shè)置
overflow-y 垂直方向內(nèi)容溢出時(shí)的設(shè)置
以上三個(gè)屬性設(shè)置的屬性值:
visible、scroll、hidden剔难、auto、
visible 默認(rèn)值点弯。使用該值時(shí)启盛,無(wú)論設(shè)置的"width"和"height"的值是多少姊氓,其中的內(nèi)容無(wú)論是否超出范圍都將被強(qiáng)制顯示凡桥。
?hidden 效果與visible相反蟀伸。任何超出"width"和"height"的內(nèi)容都會(huì)不可見(jiàn)。
?scroll 無(wú)論內(nèi)容是否超越范圍缅刽,都將顯示滾動(dòng)條啊掏。
?auto 當(dāng)內(nèi)容超出范圍時(shí),顯示滾動(dòng)條拷恨,否則不顯示脖律。
應(yīng)用:
1)沒(méi)有水平滾動(dòng)條:
?<div style="overflow-x:hidden">test</div>
2)沒(méi)有垂直滾動(dòng)條
?<div style="overflow-y:hidden">test</div>
3)沒(méi)有滾動(dòng)條
?<div style="overflow-x:hidden;overflow-y:hidden" 或
style="overflow:hidden">test</div>
4)自動(dòng)顯示滾動(dòng)條
<div? style="height:100px;width:100px;overflow:auto;">test</div>
2谢肾、自己定義滾動(dòng)條的顏色
Body {
?scrollbar-arrow-color: #f4ae21; /*圖6,三角箭頭的顏色*/
scrollbar-face-color: #333; /*圖5,立體滾動(dòng)條的顏色*/
scrollbar-3dlight-color: #666; /*圖1,立體滾動(dòng)條亮邊的顏色*/
scrollbar-highlight-color: #666; /*圖2,滾動(dòng)條空白部分的顏色*/
scrollbar-shadow-color: #999; /*圖3,立體滾動(dòng)條陰影的顏色*/
scrollbar-darkshadow-color: #666; /*圖4,立體滾動(dòng)條強(qiáng)陰影的顏色*/
scrollbar-track-color: #666; /*圖7,立體滾動(dòng)條背景顏色*/
scrollbar-base-color:#f8f8f8; /*滾動(dòng)條的基本顏色*/
Cursor:url(mouse.cur); /*自定義個(gè)性鼠標(biāo)*/
?}
以上適用與<body>腕侄、<div>、<textarea>芦疏、<iframe>