{"id":68642,"date":"2020-08-19T04:56:23","date_gmt":"2020-08-18T20:56:23","guid":{"rendered":"http:\/\/www.xiaoyebailong.com\/?p=68642"},"modified":"2020-09-01T04:57:15","modified_gmt":"2020-08-31T20:57:15","slug":"ss%e5%9b%ba%e5%ae%9adiv%e5%a4%b4%e9%83%a8%ef%bc%8c%e6%bb%9a%e5%8a%a8%e6%9d%a1%e6%bb%9a%e5%8a%a8%e5%86%85%e5%ae%b9","status":"publish","type":"post","link":"http:\/\/www.xiaoyebailong.com\/index.php\/2020\/08\/19\/68642.htm","title":{"rendered":"css\u56fa\u5b9adiv\u5934\u90e8\uff0c\u6eda\u52a8\u6761\u6eda\u52a8\u5185\u5bb9"},"content":{"rendered":"\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"865\" height=\"441\" src=\"http:\/\/www.xiaoyebailong.com\/wp-content\/uploads\/2020\/09\/20200901045609.png\" alt=\"\" class=\"wp-image-68643\" srcset=\"http:\/\/www.xiaoyebailong.com\/wp-content\/uploads\/2020\/09\/20200901045609.png 865w, http:\/\/www.xiaoyebailong.com\/wp-content\/uploads\/2020\/09\/20200901045609-300x153.png 300w, http:\/\/www.xiaoyebailong.com\/wp-content\/uploads\/2020\/09\/20200901045609-768x392.png 768w\" sizes=\"auto, (max-width: 865px) 100vw, 865px\" \/><\/figure>\n\n\n\n<pre class=\"wp-block-code\"><code>&lt;!DOCTYPE html>\n&lt;html lang=\"en\">\n&lt;head>\n  &lt;meta charset=\"gb2312\">\n  &lt;title>css\u56fa\u5b9adiv\u5934\u90e8\uff0c\u6eda\u52a8\u6761\u6eda\u52a8\u5185\u5bb9&lt;\/title>\n  &lt;style type=\"text\/css\">\n  .headDiv {\n    position: fixed;\n    top: 0;\n    right: 0;\n    bottom: 0;\n    left: 0;\n    width: 100%;\n\n    border: 1px solid blue;\n  }\n  \n  .contentDiv {\n    position: fixed;\n    \/*\u56fa\u5b9a\u5b9a\u4f4d*\/\n    top: 60px;\n    right: 0;\n    bottom: 0;\n    left: 0;\n    width: 100%;\n    height: 100%; \n    border: 1px solid red;\n  }\n  \n  .content-left {\n    position: fixed;\n    \/*\u56fa\u5b9a\u5b9a\u4f4d*\/\n    top: 60px;\n    right: 0;\n    bottom: 10px;\n    left: 0;\n    width: 200px;\n    border: 1px solid red;\n  }\n  \n  .content-right {\n    position: absolute;\n    \/*\u7edd\u5bf9\u5b9a\u4f4d*\/\n    top: 10px;\n    right: 0;\n    bottom: 70px;\n    left: 210px;\n    border: 1px solid #006;\/* \u4f7f\u7528\u8fb9\u6846\uff0c\u533a\u5206\u5185\u5bb9*\/    \n    overflow-y: scroll;\/*\u663e\u793ay\u8f74\u6eda\u52a8\u6761*\/\n    overflow-x: hidden;\/*\u9690\u85cfx\u8f74\u6eda\u52a8\u6761*\/    \n  }\n  &lt;\/style>\n&lt;\/head>\n\n&lt;body>\n  &lt;div class=\"fixedDiv\">\n    &lt;div class=\"headDiv\">\u6211\u662f\u5934\u90e8\uff0c\u6211\u8981\u56fa\u5b9a&lt;\/div>\n    &lt;div class=\"contentDiv\">\n      &lt;div class=\"content-left\">\u6211\u662f\u5de6\u8fb9left\u7684\u5185\u5bb9\uff0c\u6211\u8981\u56fa\u5b9a&lt;\/div>\n      &lt;div class=\"content-right\">\n        &lt;div>\u6211\u662f\u53f3\u8fb9right\u7684\u5185\u5bb9\uff0c\u6211\u8981\u6eda\u52a8\u6211\u662f\u53f3\u8fb9right\u7684\u5185\u5bb9\uff0c\u6211\u8981\u6eda\u52a8\u6211\u662f\u53f3\u8fb9right\u7684\u5185\u5bb9\uff0c\u6211\u8981\u6eda\u52a8\u6211\u662f\u53f3\u8fb9right\u7684\u5185\u5bb9\uff0c\u6211\u8981\u6eda\u52a8\u6211\u662f\u53f3\u8fb9right\u7684\u5185\u5bb9\uff0c&lt;\/div>\n        &lt;div>\u6211\u662f\u53f3\u8fb9right\u7684\u5185\u5bb9\uff0c\u6211\u8981\u6eda\u52a8\u6211\u662f\u53f3\u8fb9right\u7684\u5185\u5bb9\uff0c\u6211\u8981\u6eda\u52a8\u6211\u662f\u53f3\u8fb9right\u7684\u5185\u5bb9\uff0c\u6211\u8981\u6eda\u52a8\u6211\u662f\u53f3\u8fb9right\u7684\u5185\u5bb9\uff0c\u6211\u8981\u6eda\u52a8\u6211\u662f\u53f3\u8fb9right\u7684\u5185\u5bb9\uff0c&lt;\/div>\n        &lt;div>\u6211\u662f\u53f3\u8fb9right\u7684\u5185\u5bb9\uff0c\u6211\u8981\u6eda\u52a8\u6211\u662f\u53f3\u8fb9right\u7684\u5185\u5bb9\uff0c\u6211\u8981\u6eda\u52a8\u6211\u662f\u53f3\u8fb9right\u7684\u5185\u5bb9\uff0c\u6211\u8981\u6eda\u52a8\u6211\u662f\u53f3\u8fb9right\u7684\u5185\u5bb9\uff0c\u6211\u8981\u6eda\u52a8\u6211\u662f\u53f3\u8fb9right\u7684\u5185\u5bb9\uff0c&lt;\/div>\n        &lt;div>\u6211\u662f\u53f3\u8fb9right\u7684\u5185\u5bb9\uff0c\u6211\u8981\u6eda\u52a8\u6211\u662f\u53f3\u8fb9right\u7684\u5185\u5bb9\uff0c\u6211\u8981\u6eda\u52a8\u6211\u662f\u53f3\u8fb9right\u7684\u5185\u5bb9\uff0c\u6211\u8981\u6eda\u52a8\u6211\u662f\u53f3\u8fb9right\u7684\u5185\u5bb9\uff0c\u6211\u8981\u6eda\u52a8\u6211\u662f\u53f3\u8fb9right\u7684\u5185\u5bb9\uff0c&lt;\/div>\n        &lt;div>\u6211\u662f\u53f3\u8fb9right\u7684\u5185\u5bb9\uff0c\u6211\u8981\u6eda\u52a8\u6211\u662f\u53f3\u8fb9right\u7684\u5185\u5bb9\uff0c\u6211\u8981\u6eda\u52a8\u6211\u662f\u53f3\u8fb9right\u7684\u5185\u5bb9\uff0c\u6211\u8981\u6eda\u52a8\u6211\u662f\u53f3\u8fb9right\u7684\u5185\u5bb9\uff0c\u6211\u8981\u6eda\u52a8\u6211\u662f\u53f3\u8fb9right\u7684\u5185\u5bb9\uff0c&lt;\/div>\n        &lt;div>\u6211\u662f\u53f3\u8fb9right\u7684\u5185\u5bb9\uff0c\u6211\u8981\u6eda\u52a8\u6211\u662f\u53f3\u8fb9right\u7684\u5185\u5bb9\uff0c\u6211\u8981\u6eda\u52a8\u6211\u662f\u53f3\u8fb9right\u7684\u5185\u5bb9\uff0c\u6211\u8981\u6eda\u52a8\u6211\u662f\u53f3\u8fb9right\u7684\u5185\u5bb9\uff0c\u6211\u8981\u6eda\u52a8\u6211\u662f\u53f3\u8fb9right\u7684\u5185\u5bb9\uff0c&lt;\/div>\n        &lt;div>\u6211\u662f\u53f3\u8fb9right\u7684\u5185\u5bb9\uff0c\u6211\u8981\u6eda\u52a8\u6211\u662f\u53f3\u8fb9right\u7684\u5185\u5bb9\uff0c\u6211\u8981\u6eda\u52a8\u6211\u662f\u53f3\u8fb9right\u7684\u5185\u5bb9\uff0c\u6211\u8981\u6eda\u52a8\u6211\u662f\u53f3\u8fb9right\u7684\u5185\u5bb9\uff0c\u6211\u8981\u6eda\u52a8\u6211\u662f\u53f3\u8fb9right\u7684\u5185\u5bb9\uff0c&lt;\/div>\n        &lt;div>\u6211\u662f\u53f3\u8fb9right\u7684\u5185\u5bb9\uff0c\u6211\u8981\u6eda\u52a8\u6211\u662f\u53f3\u8fb9right\u7684\u5185\u5bb9\uff0c\u6211\u8981\u6eda\u52a8\u6211\u662f\u53f3\u8fb9right\u7684\u5185\u5bb9\uff0c\u6211\u8981\u6eda\u52a8\u6211\u662f\u53f3\u8fb9right\u7684\u5185\u5bb9\uff0c\u6211\u8981\u6eda\u52a8\u6211\u662f\u53f3\u8fb9right\u7684\u5185\u5bb9\uff0c&lt;\/div>\n      &lt;\/div>\n    &lt;\/div>\n&lt;\/body>\n\n&lt;\/html><\/code><\/pre>\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[4,1],"tags":[],"topic":[],"class_list":["post-68642","post","type-post","status-publish","format-standard","hentry","category-htmlcss","category-technology"],"_links":{"self":[{"href":"http:\/\/www.xiaoyebailong.com\/index.php\/wp-json\/wp\/v2\/posts\/68642","targetHints":{"allow":["GET"]}}],"collection":[{"href":"http:\/\/www.xiaoyebailong.com\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"http:\/\/www.xiaoyebailong.com\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"http:\/\/www.xiaoyebailong.com\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/www.xiaoyebailong.com\/index.php\/wp-json\/wp\/v2\/comments?post=68642"}],"version-history":[{"count":2,"href":"http:\/\/www.xiaoyebailong.com\/index.php\/wp-json\/wp\/v2\/posts\/68642\/revisions"}],"predecessor-version":[{"id":68645,"href":"http:\/\/www.xiaoyebailong.com\/index.php\/wp-json\/wp\/v2\/posts\/68642\/revisions\/68645"}],"wp:attachment":[{"href":"http:\/\/www.xiaoyebailong.com\/index.php\/wp-json\/wp\/v2\/media?parent=68642"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/www.xiaoyebailong.com\/index.php\/wp-json\/wp\/v2\/categories?post=68642"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/www.xiaoyebailong.com\/index.php\/wp-json\/wp\/v2\/tags?post=68642"},{"taxonomy":"topic","embeddable":true,"href":"http:\/\/www.xiaoyebailong.com\/index.php\/wp-json\/wp\/v2\/topic?post=68642"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}