{"id":252,"date":"2010-09-25T14:05:00","date_gmt":"2010-09-25T06:05:00","guid":{"rendered":"http:\/\/gaigaiming.com\/?p=76"},"modified":"2010-09-25T14:05:00","modified_gmt":"2010-09-25T06:05:00","slug":"%e3%80%90%e8%bd%ac%e3%80%91%e3%80%90%e6%8a%80%e6%9c%af%e7%b1%bb%e3%80%91div%e6%bb%9a%e5%8a%a8%e6%9d%a1%e5%b1%9e%e6%80%a7%e5%8f%8a%e6%a0%b7%e5%bc%8f%e8%ae%be%e7%bd%ae","status":"publish","type":"post","link":"https:\/\/www.gaigaiming.com\/index.php\/2010\/09\/25\/%e3%80%90%e8%bd%ac%e3%80%91%e3%80%90%e6%8a%80%e6%9c%af%e7%b1%bb%e3%80%91div%e6%bb%9a%e5%8a%a8%e6%9d%a1%e5%b1%9e%e6%80%a7%e5%8f%8a%e6%a0%b7%e5%bc%8f%e8%ae%be%e7%bd%ae\/","title":{"rendered":"\u3010\u8f6c\u3011\u3010\u6280\u672f\u7c7b\u3011div\u6eda\u52a8\u6761\u5c5e\u6027\u53ca\u6837\u5f0f\u8bbe\u7f6e"},"content":{"rendered":"
\n

     \u67d0\u6b21\u505a\u6d3b\u52a8\u9762\u7684\u65f6\u5019\u9700\u8981\u6eda\u52a8\u6761\u662f\u5361\u901a\u7684\uff0c\u4e0d\u8fc7\u540e\u6765\u8fd8\u662f\u7528\u7684\u9ed8\u8ba4\u7684\u3002\u4f46\u662f\u627e\u5230\u4e86\u8fd9\u4e2a\uff0c\u6709\u7528\u5230\u7684\u53ef\u4ee5\u501f\u9274\u3002<\/p>\n

     PS\uff1a\u5728\u706b\u72d0\u6d4f\u89c8\u5668\u4e2d\u8fd8\u662f\u7528\u7684\u9ed8\u8ba4\u7684\u6eda\u52a8\u6761\uff0c\u63a7\u4ef6\u8fd8\u662f\u7528\u9ed8\u8ba4\u7684\u3002<\/p>\n

\u5f53div\u6240\u5b9a\u4e49\u7684\u533a\u57df\u7684\u5185\u5bb9\u8fbe\u5230\u4e00\u5b9a\u7a0b\u5ea6\u65f6\uff0c\u5728div\u6807\u7b7e\u91cc\u9762\u5d4c\u5165css\u6837\u5f0f\u8868\uff0c\u5b9a\u4e49overflow\u7684\u5c5e\u6027\u503c\uff0c\u8bbe\u7f6e\u6eda\u52a8\u6761\u76f8\u5173\u7684\u5c5e\u6027\u3002<\/p>\n

<style tyle="text\/css">
.testDiv{
border-style: solid ;
border-width: 50px ;
border-color: pink ;<\/p>\n

position: absolute ;
top:200px ;
left:300px ;
height:200px ;
width:300px ;<\/p>\n

overFlow-x: scroll ;
overFlow-y: hidden ; <\/p>\n

scrollBar-face-color: green;
scrollBar-hightLight-color: red;
scrollBar-3dLight-color: orange;
scrollBar-darkshadow-color:blue;
scrollBar-shadow-color:yellow;
scrollBar-arrow-color:purple;
scrollBar-track-color:black;
scrollBar-base-color:pink; <\/p>\n

}<\/p>\n

<\/style><\/p>\n

\u6ce8\uff1a<\/p>\n

1. overFlow:<\/p>\n

visible \u5374\u7701\u503c\uff0c\u6ca1\u6709\u6eda\u52a8\u6761\uff0c\u6839\u636e\u5185\u5bb9\u81ea\u52a8\u6269\u6491\u533a\u57df\u7684\u5927\u5c0f\uff0c\u5373\u5b9a\u4e49\u7684\u533a\u57df\u65e0\u6548
scroll \u603b\u662f\u663e\u793a\u6eda\u52a8\u6761
hidden \u6ca1\u6709\u6eda\u52a8\u6761\uff0c\u8d85\u51fa\u533a\u57df\u7684\u5185\u5bb9\u4e0d\u53ef\u89c1
auto \u6839\u636e\u5185\u5bb9\u81ea\u52a8\u5224\u65ad\u662f\u5426\u6dfb\u52a0\u6eda\u52a8\u6761<\/p>\n

2.\u6eda\u52a8\u6761\u989c\u8272\u5c5e\u6027\uff1a<\/p>\n

\u3000\u3000face-color\uff1a\u6ed1\u5757\u989c\u8272
\u3000\u3000hightlight-color\uff1a\u9ad8\u4eae\u989c\u8272
\u3000\u30003dlight-color\uff1a\u4e09\u7ef4\u5149\u7ebf\u989c\u8272
\u3000\u3000darkshadow-color\uff1a\u6697\u5f71\u989c\u8272
\u3000\u3000shadow-color\uff1a\u9634\u5f71\u989c\u8272
\u3000\u3000arrow-color\uff1a\u7bad\u5934\u989c\u8272
\u3000\u3000track-color\uff1a\u6ed1\u9053\u989c\u8272
base-color\uff1a\u6eda\u52a8\u6761\u7684\u4e3b\u8981\u989c\u8272\uff0c\u5176\u4e2d\u5305\u542b\u6eda\u52a8\u6309\u94ae\u548c\u6eda\u52a8\u6ed1\u5757<\/p>\n

3.overFlow-x       overFlow-y<\/p>\n

visible \u5374\u7701\u503c\uff0c\u6ca1\u6709\u6eda\u52a8\u6761\uff0c\u6839\u636e\u5185\u5bb9\u81ea\u52a8\u6269\u6491\u533a\u57df\u7684\u5927\u5c0f\uff0c\u5373\u5b9a\u4e49\u7684\u533a\u57df\u65e0\u6548
scroll \u603b\u662f\u663e\u793a\u6eda\u52a8\u6761
hidden \u6ca1\u6709\u6eda\u52a8\u6761\uff0c\u8d85\u51fa\u533a\u57df\u7684\u5185\u5bb9\u4e0d\u53ef\u89c1
auto \u6839\u636e\u5185\u5bb9\u81ea\u52a8\u5224\u65ad\u662f\u5426\u6dfb\u52a0\u6eda\u52a8\u6761<\/p>\n<\/p>\n

<div style="WIDTH: 120; HEIGHT: 140; BACKGROUND-COLOR: #0000C6; OVERFLOW: scroll; scrollbar-face-color:#70807d; scrollbar-arrow-color:#ffffff; scrollbar-highlight-color:#ffffff; scrollbar-3dlight-color:#70807d; scrollbar-shadow-color:#ffffff; scrollbar-darkshadow-color:#70807d; scrollbar-track-color:#ffffff">
\u6587\u5b57\u5185\u5bb9
<\/div> <div style="WIDTH: 120; HEIGHT: 140; OVERFLOW: scroll; scrollbar-3dlight-color:#FF0033; scrollbar-arrow-color:#FFFFFF; scrollbar-track-color:#FFFF33; scrollbar-darkshadow-color:#FFFF33; scrollbar-face-color:#FF0033; scrollbar-highlight-color:#FFFFFF; scrollbar-shadow-color:#FF0033">
\u6587\u5b57\u5185\u5bb9
<\/div> <div style="WIDTH: 120; HEIGHT: 140; OVERFLOW: scroll; scrollbar-3dlight-color:#FF0033; scrollbar-arrow-color:#FFFFFF; scrollbar-track-color:#FFFF33; scrollbar-darkshadow-color:#FFFF33; scrollbar-face-color:#FF0033; scrollbar-highlight-color:#FFFFFF; scrollbar-shadow-color:#FF0033">
\u6587\u5b57\u5185\u5bb9
<\/div> <div style="WIDTH: 120; HEIGHT: 140; OVERFLOW: scroll; SCROLLBAR-FACE-COLOR: EAECEC; SCROLLBAR-HIGHLIGHT-COLOR: EAECEC; SCROLLBAR-SHADOW-COLOR: BLACK; SCROLLBAR-3DLIGHT-COLOR: EAECEC; SCROLLBAR-ARROW-COLOR: EAECEC; SCROLLBAR-TRACK-COLOR: FFFFFF; SCROLLBAR-DARKSHADOW-COLOR: EAECEC">
\u6587\u5b57\u5185\u5bb9
<\/div> <\/p>\n

<div style="WIDTH: 120; HEIGHT: 140;OVERFLOW: scroll; scrollbar-3dlight-color:#595959; scrollbar-arrow-color:#FFFFFF; scrollbar-base-color:#CFCFCF; scrollbar-darkshadow-color:#FFFFFF; scrollbar-face-color:#CFCFCF; scrollbar-highlight-color:#FFFFFF; scrollbar-shadow-color:#595959">
\u6587\u5b57\u5185\u5bb9
<\/div><\/p>\n

<div style="WIDTH: 120; HEIGHT: 140; OVERFLOW: scroll; scrollbar-face-color: #FFFFFF; scrollbar-shadow-color: #D2E5F4; scrollbar-highlight-color: #D2E5F4; scrollbar-3dlight-color: #FFFFFF; scrollbar-darkshadow-color: #FFFFFF; scrollbar-track-color: #FFFFFF; scrollbar-arrow-color: #D2E5F4">
\u6587\u5b57\u5185\u5bb9
<\/div> <div style="WIDTH: 120; HEIGHT: 140; OVERFLOW: scroll; scrollbar-shadow-color: #ffffff; scrollbar-highlight-color: #ffffff; scrollbar-face-color: #d9d9d9; scrollbar-3dlight-color: #d9d9d9; scrollbar-darkshadow-color: #d9d9d9; scrollbar-track-color: #ffffff; scrollbar-arrow-color: #ffffff">
\u6587\u5b57\u5185\u5bb9
<\/div> <div style="WIDTH: 120; HEIGHT: 140; OVERFLOW: scroll; scrollbar-shadow-color: #FFFFFF; scrollbar-highlight-color: #FFFFFF; scrollbar-arrow-color: #FFFFFF; scrollbar-face-color: #59ADBB; scrollbar-track-color: #FFFFFF; scrollbar-3dlight-color: #59ADBB; scrollbar-darkshadow-color: #59ADBB">
\u6587\u5b57\u5185\u5bb9
<\/div> <div style="WIDTH: 120; HEIGHT: 140; OVERFLOW: scroll; scrollbar-face-color: #FFFFFF; scrollbar-shadow-color: #FFC300; scrollbar-highlight-color: #FFFFFF; scrollbar-3dlight-color: #FFC300; scrollbar-darkshadow-color: #FFFFFF; scrollbar-track-color: #FFFFFF; scrollbar-arrow-color: #FFC300">
\u6587\u5b57\u5185\u5bb9
<\/div> <div style="WIDTH: 120; HEIGHT: 140; OVERFLOW: scroll; scrollbar-3dlight-color:5A5227; scrollbar-arrow-color:FFF8C5; scrollbar-base-color:DDD38D; scrollbar-darkshadow-color:FFF8C5; scrollbar-face-color:DDD38D; scrollbar-highlight-color:FFF8C5; scrollbar-shadow-color:5A5227">
\u6587\u5b57\u5185\u5bb9
<\/div> <div style="WIDTH: 120; HEIGHT: 140; OVERFLOW: scroll; scrollbar-face-color: #9EBFE8; scrollbar-shadow-color: #FFFFFF; scrollbar-highlight-color: #FFFFFF; scrollbar-3dlight-color: #9EBFE8; scrollbar-darkshadow-color: #9EBFE8; scrollbar-track-color: #FFFFFF; scrollbar-arrow-color: #FFFFFF"&
\ngt;
\u6587\u5b57\u5185\u5bb9
<\/div> <div style="WIDTH: 120; HEIGHT: 140; OVERFLOW: scroll; scrollbar-face-color: #DB52BC; scrollbar-shadow-color: #E994D6; scrollbar-highlight-color: #E994D6; scrollbar-3dlight-color: #DB52BC; scrollbar-darkshadow-color: #DB52BC; scrollbar-track-color: #E994D6; scrollbar-arrow-color: #FFFFFF">
\u6587\u5b57\u5185\u5bb9
<\/div> <div style="WIDTH: 120; HEIGHT: 140; OVERFLOW: scroll; scrollbar-face-color: #333333; scrollbar-shadow-color: #333333; scrollbar-highlight-color: #666666; scrollbar-3dlight-color: #101010; scrollbar-darkshadow-color: #070707; scrollbar-track-color: #101010; scrollbar-arrow-color: #000000">
\u6587\u5b57\u5185\u5bb9
<\/div> <div style="WIDTH: 120; HEIGHT: 140; OVERFLOW: scroll; scrollbar-face-color: #333333; scrollbar-shadow-color: #808080; scrollbar-highlight-color: #333333; scrollbar-3dlight-color: #808080; scrollbar-darkshadow-color: #333333; scrollbar-track-color: #191919; scrollbar-arrow-color: #CCCCCC">
\u6587\u5b57\u5185\u5bb9
<\/div> <div style="WIDTH: 120; HEIGHT: 140; OVERFLOW: scroll; scrollbar-face-color:#FFC4E1; scrollbar-highlight-color:#FFFFFF; scrollbar-3dlight-color:#FF95CA; scrollbar-darkshadow-color:#FFB5DA; scrollbar-shadow-color:#FF6AB5; scrollbar-arrow-color:#FFFFFF; scrollbar-track-color:#FFDDEE">
\u6587\u5b57\u5185\u5bb9
<\/div> <div style="WIDTH: 120; HEIGHT: 140; OVERFLOW: scroll; scrollbar-face-color: #DBEBFE; scrollbar-shadow-color: #B8D6FA; scrollbar-highlight-color: #FFFFFF; scrollbar-3dlight-color: #DBEBFE; scrollbar-darkshadow-color:#458CE4; scrollbar-track-color: #FFFFFF; scrollbar-arrow-color: #458CE4">
\u6587\u5b57\u5185\u5bb9
<\/div> <div style="WIDTH: 120; HEIGHT: 140; OVERFLOW: scroll; scrollbar-face-color: #FFFFFF; scrollbar-shadow-color: #885C10; scrollbar-highlight-color: #F8ECD8; scrollbar-3dlight-color: #885C10; scrollbar-darkshadow-color: #F8ECD8; scrollbar-track-color: #F8ECD8; scrollbar-arrow-color: #885C10">
\u6587\u5b57\u5185\u5bb9
<\/div> <div style="WIDTH: 120; HEIGHT: 140; OVERFLOW: scroll; scrollbar-face-color: #222222; scrollbar-highlight-color: #FFFFFF; scrollbar-3dlight-color: #222222; scrollbar-shadow-color: #FFFFFF; scrollbar-darkshadow-color: #222222; scrollbar-track-color: #222222; scrollbar-arrow-color: #222222">
\u6587\u5b57\u5185\u5bb9
<\/div> <div style="WIDTH: 120; HEIGHT: 140; OVERFLOW: scroll; scrollbar-face-color: #FDDEE8; scrollbar-shadow-color: #FDDEE8; scrollbar-highlight-color: #ffffff; scrollbar-3dlight-color: #FDCFDD; scrollbar-darkshadow-color: #FDCFDD; scrollbar-track-color: FFF6F9; scrollbar-arrow-color: #FEA6C0">
\u6587\u5b57\u5185\u5bb9
<\/div> <div style="WIDTH: 120; HEIGHT: 140; OVERFLOW: scroll; scrollbar-3dlight-color:#CCFF00; scrollbar-arrow-color:#FFFFFF; scrollbar-track-color:#FFFFFF; scrollbar-darkshadow-color:#CCFF00; scrollbar-face-color:#CCFF00; scrollbar- <\/p>\n<\/p><\/div>\n","protected":false},"excerpt":{"rendered":"

     \u67d0\u6b21\u505a\u6d3b\u52a8\u9762\u7684\u65f6\u5019\u9700\u8981\u6eda\u52a8\u6761\u662f\u5361\u901a\u7684\uff0c\u4e0d\u8fc7\u540e\u6765\u8fd8\u662f\u7528\u7684\u9ed8\u8ba4\u7684 […]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[4],"tags":[],"class_list":["post-252","post","type-post","status-publish","format-standard","hentry","category-4"],"_links":{"self":[{"href":"https:\/\/www.gaigaiming.com\/index.php\/wp-json\/wp\/v2\/posts\/252","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.gaigaiming.com\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.gaigaiming.com\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.gaigaiming.com\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.gaigaiming.com\/index.php\/wp-json\/wp\/v2\/comments?post=252"}],"version-history":[{"count":0,"href":"https:\/\/www.gaigaiming.com\/index.php\/wp-json\/wp\/v2\/posts\/252\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.gaigaiming.com\/index.php\/wp-json\/wp\/v2\/media?parent=252"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.gaigaiming.com\/index.php\/wp-json\/wp\/v2\/categories?post=252"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.gaigaiming.com\/index.php\/wp-json\/wp\/v2\/tags?post=252"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}