{"id":2137,"date":"2006-05-02T16:39:06","date_gmt":"2006-05-02T23:39:06","guid":{"rendered":"http:\/\/hi-alex.com\/?p=2137"},"modified":"2006-05-02T16:39:06","modified_gmt":"2006-05-02T23:39:06","slug":"%e4%b8%80%e4%b8%aa%e5%be%88%e4%b8%8d%e9%94%99%e7%9a%84css-layout","status":"publish","type":"post","link":"http:\/\/www.hi-alex.com\/?p=2137","title":{"rendered":"\u4e00\u4e2a\u5f88\u4e0d\u9519\u7684CSS Layout"},"content":{"rendered":"<p>\u4e00\u4e2a\u5f88\u4e0d\u9519\u7684CSS Layout\u3002<br \/>\n\u4e0d\u8bb0\u5f97\u662f\u4ece\u54ea\u91cc\u770b\u5230\u7684\u4e86\u3002<br \/>\n[html]<!DOCTYPE HTML PUBLIC \"-\/\/W3C\/\/DTD HTML 4.01 Transitional\/\/EN\"\n\"http:\/\/www.w3.org\/TR\/html4\/loose.dtd\"><br \/>\n<html><br \/>\n<head><br \/>\n<meta http-equiv=\"Content-Type\" content=\"text\/html; charset=iso-8859-1\"><br \/>\n<title>Untitled Document<\/title><\/p>\n<style>\nbody {\nmargin: 0;\npadding: 0;\n}\n#header {\nbackground-color: #999;\nfont: 11px arial;\ncolor: #fff;\n}\n#topnav {\nbackground-color: #ab1;\nfont: 11px arial;\ncolor: #000;\n}\n#rightnav {\nbackground-color: #999;\nfont: 11px arial;\ncolor: #fff;\nfloat: right;\nwidth: 200px;\n}\n#content {\nfont: 11px arial;\ncolor: #999;\nmargin-right: 240px;\nmargin-left: 30px;\n}\n#footer {\nbackground-color: #000;\nfont: 11px arial;\ncolor: #fff;\nclear: both;\n}\np {\nmargin: 0;\npadding: 6px 0 6px 0;\n}\n<\/style>\n<style type=\"text\/css\">\nimg.wp-smiley,\nimg.emoji {\n\tdisplay: inline !important;\n\tborder: none !important;\n\tbox-shadow: none !important;\n\theight: 1em !important;\n\twidth: 1em !important;\n\tmargin: 0 .07em !important;\n\tvertical-align: -0.1em !important;\n\tbackground: none !important;\n\tpadding: 0 !important;\n}\n<\/style>\n<link rel='stylesheet' id='dashicons-css'  href='http:\/\/192.168.68.128\/blog\/wp-includes\/css\/dashicons.min.css?ver=5.5' media='all' \/>\n<link rel='stylesheet' id='admin-bar-css'  href='http:\/\/192.168.68.128\/blog\/wp-includes\/css\/admin-bar.min.css?ver=5.5' media='all' \/>\n<\/head><br \/>\n<body><\/p>\n<div id=\"header\">This is for the header information<\/div>\n<div id=\"topnav\">This is for the top nav<\/div>\n<div id=\"main\">\n<div id=\"rightnav\">This is for the right nav stuff <\/div>\n<div id=\"content\">\n  This area is for the main content. This area is for the main<br \/>\n     content. This area is for the main content. This area is for the<br \/>\nmain content.<br \/>\n     This area is for the main content. This area is for the main<br \/>\ncontent.This area<br \/>\n     is for the main content.This area is for the main content. This<br \/>\narea is for<br \/>\n     the main content. This area is for the main content. This area is<br \/>\nfor the main<br \/>\n     content. This area is for the main content. This area is for the<br \/>\nmain content.<br \/>\n     This area is for the main content. This area is for the main<br \/>\ncontent. This<br \/>\n     area is for the main content.<\/p>\n<p>This area is for the main content. This area is for the main<br \/>\ncontent. This<br \/>\n     area is for the main content. This area is for the main content.<br \/>\nThis area<br \/>\n     is for the main content. This area is for the main content.This<br \/>\narea is for<br \/>\n     the main content.This area is for the main content. This area is<br \/>\nfor the<br \/>\n     main content. This area is for the main content. This area is for<br \/>\nthe main<br \/>\n     content. This area is for the main content. This area is for the<br \/>\nmain content.<br \/>\n     This area is for the main content. This area is for the main<br \/>\ncontent. This<br \/>\n     area is for the main content.<\/p>\n<p>This area is for the main content. This area is for the main<br \/>\ncontent. This<br \/>\n     area is for the main content. This area is for the main content.<br \/>\nThis area<br \/>\n     is for the main content. This area is for the main content.This<br \/>\narea is for<br \/>\n     the main content.This area is for the main content. This area is<br \/>\nfor the<br \/>\n     main content. This area is for the main content. This area is for<br \/>\nthe main<br \/>\n     content. This area is for the main content. This area is for the<br \/>\nmain content.<br \/>\n     This area is for the main content. This area is for the main<br \/>\ncontent. This<br \/>\n     area is for the main content.This area is for the main content.<br \/>\nThis area<br \/>\n     is for the main content. This area is for the main content. This<br \/>\narea is<br \/>\n     for the main content. This area is for the main content. This area<br \/>\nis for<br \/>\n     the main content.This area is for the main content.This area is for<br \/>\nthe main<br \/>\n     content. This area is for the main content. This area is for the<br \/>\nmain content.<br \/>\n     This area is for the main content. This area is for the main<br \/>\ncontent. This<br \/>\n     area is for the main content. This area is for the main content.<br \/>\nThis area<br \/>\n     is for the main content. This area is for the main content.<\/p>\n<p>This area is for the main content. This area is for the main<br \/>\ncontent. This<br \/>\n     area is for the main content. This area is for the main content.<br \/>\nThis area<br \/>\n     is for the main content. This area is for the main content.This<br \/>\narea is for<br \/>\n     the main content.This area is for the main content. This area is<br \/>\nfor the<br \/>\n     main content. This area is for the main content. This area is for<br \/>\nthe main<br \/>\n     content. This area is for the main content. This area is for the<br \/>\nmain content.<br \/>\n     This area is for the main content. This area is for the main<br \/>\ncontent. This<br \/>\n     area is for the main content.<\/p>\n<\/div>\n<div id=\"footer\">This is for the footer information<\/div>\n<\/div>\n<p><!-- ngg_resource_manager_marker --><!-- ngg_resource_manager_marker --><script id='ajax-js-extra'>\nvar MyAjax = {\"ajaxurl\":\"http:\\\/\\\/192.168.68.128\\\/blog\\\/wp-admin\\\/admin-ajax.php\"};\n<\/script><br \/>\n<script type='text\/javascript'>\n\/* <![CDATA[ *\/\nvar userSettings = {\"url\":\"\\\/blog\\\/\",\"uid\":\"1\",\"time\":\"1598156711\",\"secure\":\"\"};\/* ]]> *\/\n<\/script><br \/>\n<script type='text\/javascript' src='http:\/\/192.168.68.128\/blog\/wp-admin\/load-scripts.php?c=0&amp;load%5Bchunk_0%5D=jquery,hoverIntent,utils&amp;ver=5.5'><\/script><br \/>\n<script src='http:\/\/ecn.dev.virtualearth.net\/mapcontrol\/mapcontrol.ashx?v=6.3&#038;mkt=en-US&#038;ver=5.5' id='bing-maps-js'><\/script><br \/>\n<script src='http:\/\/192.168.68.128\/blog\/wp-content\/plugins\/nextgen-gallery-geo\/js\/ajax.js?ver=5.5' id='ajax-js'><\/script><br \/>\n<script src='http:\/\/192.168.68.128\/blog\/wp-includes\/js\/dist\/vendor\/wp-polyfill.min.js?ver=7.4.4' id='wp-polyfill-js'><\/script><br \/>\n<script id='wp-polyfill-js-after'>\n( 'fetch' in window ) || document.write( '<script src=\"http:\/\/192.168.68.128\/blog\/wp-includes\/js\/dist\/vendor\/wp-polyfill-fetch.min.js?ver=3.0.0\"><\/scr' + 'ipt>' );( document.contains ) || document.write( '<script src=\"http:\/\/192.168.68.128\/blog\/wp-includes\/js\/dist\/vendor\/wp-polyfill-node-contains.min.js?ver=3.42.0\"><\/scr' + 'ipt>' );( window.DOMRect ) || document.write( '<script src=\"http:\/\/192.168.68.128\/blog\/wp-includes\/js\/dist\/vendor\/wp-polyfill-dom-rect.min.js?ver=3.42.0\"><\/scr' + 'ipt>' );( window.URL && window.URL.prototype && window.URLSearchParams ) || document.write( '<script src=\"http:\/\/192.168.68.128\/blog\/wp-includes\/js\/dist\/vendor\/wp-polyfill-url.min.js?ver=3.6.4\"><\/scr' + 'ipt>' );( window.FormData && window.FormData.prototype.keys ) || document.write( '<script src=\"http:\/\/192.168.68.128\/blog\/wp-includes\/js\/dist\/vendor\/wp-polyfill-formdata.min.js?ver=3.0.12\"><\/scr' + 'ipt>' );( Element.prototype.matches && Element.prototype.closest ) || document.write( '<script src=\"http:\/\/192.168.68.128\/blog\/wp-includes\/js\/dist\/vendor\/wp-polyfill-element-closest.min.js?ver=2.0.2\"><\/scr' + 'ipt>' );\n<\/script><br \/>\n<script src='http:\/\/192.168.68.128\/blog\/wp-includes\/js\/dist\/i18n.min.js?ver=bb7c3c45d012206bfcd73d6a31f84d9e' id='wp-i18n-js'><\/script><br \/>\n<script id='common-js-translations'>\n( function( domain, translations ) {\n\tvar localeData = translations.locale_data[ domain ] || translations.locale_data.messages;\n\tlocaleData[\"\"].domain = domain;\n\twp.i18n.setLocaleData( localeData, domain );\n} )( \"default\", { \"locale_data\": { \"messages\": { \"\": {} } } } );\n<\/script><br \/>\n<script src='http:\/\/192.168.68.128\/blog\/wp-admin\/js\/common.min.js?ver=5.5' id='common-js'><\/script><br \/>\n<script src='http:\/\/192.168.68.128\/blog\/wp-includes\/js\/hoverintent-js.min.js?ver=2.2.1' id='hoverintent-js-js'><\/script><br \/>\n<script src='http:\/\/192.168.68.128\/blog\/wp-includes\/js\/admin-bar.min.js?ver=5.5' id='admin-bar-js'><\/script><br \/>\n<script src='http:\/\/192.168.68.128\/blog\/wp-includes\/js\/jquery\/ui\/core.min.js?ver=1.11.4' id='jquery-ui-core-js'><\/script><br \/>\n<script src='http:\/\/192.168.68.128\/blog\/wp-includes\/js\/jquery\/ui\/widget.min.js?ver=1.11.4' id='jquery-ui-widget-js'><\/script><br \/>\n<script src='http:\/\/192.168.68.128\/blog\/wp-includes\/js\/jquery\/ui\/mouse.min.js?ver=1.11.4' id='jquery-ui-mouse-js'><\/script><br \/>\n<script src='http:\/\/192.168.68.128\/blog\/wp-includes\/js\/jquery\/ui\/draggable.min.js?ver=1.11.4' id='jquery-ui-draggable-js'><\/script><br \/>\n<script src='http:\/\/192.168.68.128\/blog\/wp-includes\/js\/jquery\/ui\/droppable.min.js?ver=1.11.4' id='jquery-ui-droppable-js'><\/script><br \/>\n<script id='piwigopress_a-js-extra'>\nvar PwgpAjax = {\"ajaxUrl\":\"http:\\\/\\\/192.168.68.128\\\/blog\\\/wp-admin\\\/admin-ajax.php\",\"nonce\":\"18fa522503\"};\n<\/script><br \/>\n<script src='http:\/\/192.168.68.128\/blog\/wp-content\/plugins\/piwigopress\/js\/piwigopress_adm.min.js?ver=2.3.2' id='piwigopress_a-js'><\/script><br \/>\n<script src='http:\/\/192.168.68.128\/blog\/wp-content\/plugins\/piwigopress\/js\/piwigopress.js?ver=2.3.2' id='piwigopress_s-js'><\/script><\/p>\n<div id=\"wpadminbar\" class=\"nojq nojs\">\n<div class=\"quicklinks\" id=\"wp-toolbar\" role=\"navigation\" aria-label=\"Toolbar\">\n<ul id='wp-admin-bar-root-default' class=\"ab-top-menu\">\n<li id='wp-admin-bar-menu-toggle'><a class='ab-item' href='#'><span class=\"ab-icon\"><\/span><span class=\"screen-reader-text\">Menu<\/span><\/a><\/li>\n<li id='wp-admin-bar-wp-logo' class=\"menupop\"><a class='ab-item' aria-haspopup=\"true\" href='http:\/\/192.168.68.128\/blog\/wp-admin\/about.php'><span class=\"ab-icon\"><\/span><span class=\"screen-reader-text\">About WordPress<\/span><\/a>\n<div class=\"ab-sub-wrapper\">\n<ul id='wp-admin-bar-wp-logo-default' class=\"ab-submenu\">\n<li id='wp-admin-bar-about'><a class='ab-item' href='http:\/\/192.168.68.128\/blog\/wp-admin\/about.php'>About WordPress<\/a><\/li>\n<\/ul>\n<ul id='wp-admin-bar-wp-logo-external' class=\"ab-sub-secondary ab-submenu\">\n<li id='wp-admin-bar-wporg'><a class='ab-item' href='https:\/\/wordpress.org\/'>WordPress.org<\/a><\/li>\n<li id='wp-admin-bar-documentation'><a class='ab-item' href='https:\/\/codex.wordpress.org\/'>Documentation<\/a><\/li>\n<li id='wp-admin-bar-support-forums'><a class='ab-item' href='https:\/\/wordpress.org\/support\/'>Support<\/a><\/li>\n<li id='wp-admin-bar-feedback'><a class='ab-item' href='https:\/\/wordpress.org\/support\/forum\/requests-and-feedback'>Feedback<\/a><\/li>\n<\/ul>\n<\/div>\n<\/li>\n<li id='wp-admin-bar-site-name' class=\"menupop\"><a class='ab-item' aria-haspopup=\"true\" href='http:\/\/192.168.68.128\/blog\/'>Hi! Alex<\/a>\n<div class=\"ab-sub-wrapper\">\n<ul id='wp-admin-bar-site-name-default' class=\"ab-submenu\">\n<li id='wp-admin-bar-view-site'><a class='ab-item' href='http:\/\/192.168.68.128\/blog\/'>Visit Site<\/a><\/li>\n<\/ul>\n<\/div>\n<\/li>\n<li id='wp-admin-bar-comments'><a class='ab-item' href='http:\/\/192.168.68.128\/blog\/wp-admin\/edit-comments.php'><span class=\"ab-icon\"><\/span><span class=\"ab-label awaiting-mod pending-count count-0\" aria-hidden=\"true\">0<\/span><span class=\"screen-reader-text comments-in-moderation-text\">0 Comments in moderation<\/span><\/a><\/li>\n<li id='wp-admin-bar-new-content' class=\"menupop\"><a class='ab-item' aria-haspopup=\"true\" href='http:\/\/192.168.68.128\/blog\/wp-admin\/post-new.php'><span class=\"ab-icon\"><\/span><span class=\"ab-label\">New<\/span><\/a>\n<div class=\"ab-sub-wrapper\">\n<ul id='wp-admin-bar-new-content-default' class=\"ab-submenu\">\n<li id='wp-admin-bar-new-post'><a class='ab-item' href='http:\/\/192.168.68.128\/blog\/wp-admin\/post-new.php'>Post<\/a><\/li>\n<li id='wp-admin-bar-new-media'><a class='ab-item' href='http:\/\/192.168.68.128\/blog\/wp-admin\/media-new.php'>Media<\/a><\/li>\n<li id='wp-admin-bar-new-link'><a class='ab-item' href='http:\/\/192.168.68.128\/blog\/wp-admin\/link-add.php'>Link<\/a><\/li>\n<li id='wp-admin-bar-new-page'><a class='ab-item' href='http:\/\/192.168.68.128\/blog\/wp-admin\/post-new.php?post_type=page'>Page<\/a><\/li>\n<li id='wp-admin-bar-new-user'><a class='ab-item' href='http:\/\/192.168.68.128\/blog\/wp-admin\/user-new.php'>User<\/a><\/li>\n<\/ul>\n<\/div>\n<\/li>\n<li id='wp-admin-bar-ngg-menu' class=\"menupop\"><a class='ab-item' aria-haspopup=\"true\" href='http:\/\/192.168.68.128\/blog\/wp-admin\/admin.php?page=nextgen-gallery'>Gallery<\/a>\n<div class=\"ab-sub-wrapper\">\n<ul id='wp-admin-bar-ngg-menu-default' class=\"ab-submenu\">\n<li id='wp-admin-bar-ngg-menu-overview'><a class='ab-item' href='http:\/\/192.168.68.128\/blog\/wp-admin\/admin.php?page=nextgen-gallery'>Overview<\/a><\/li>\n<li id='wp-admin-bar-ngg-menu-add-gallery'><a class='ab-item' href='http:\/\/192.168.68.128\/blog\/wp-admin\/admin.php?page=ngg_addgallery'>Add Gallery \/ Images<\/a><\/li>\n<li id='wp-admin-bar-ngg-menu-manage-gallery'><a class='ab-item' href='http:\/\/192.168.68.128\/blog\/wp-admin\/admin.php?page=nggallery-manage-gallery'>Manage Galleries<\/a><\/li>\n<li id='wp-admin-bar-ngg-menu-manage-album'><a class='ab-item' href='http:\/\/192.168.68.128\/blog\/wp-admin\/admin.php?page=nggallery-manage-album'>Manage Albums<\/a><\/li>\n<li id='wp-admin-bar-ngg-menu-tags'><a class='ab-item' href='http:\/\/192.168.68.128\/blog\/wp-admin\/admin.php?page=nggallery-tags'>Manage Tags<\/a><\/li>\n<li id='wp-admin-bar-ngg-menu-display_settings'><a class='ab-item' href='http:\/\/192.168.68.128\/blog\/wp-admin\/admin.php?page=ngg_display_settings'>Gallery Settings<\/a><\/li>\n<li id='wp-admin-bar-ngg-menu-other_options'><a class='ab-item' href='http:\/\/192.168.68.128\/blog\/wp-admin\/admin.php?page=ngg_other_options'>Other Options<\/a><\/li>\n<\/ul>\n<\/div>\n<\/li>\n<\/ul>\n<ul id='wp-admin-bar-top-secondary' class=\"ab-top-secondary ab-top-menu\">\n<li id='wp-admin-bar-my-account' class=\"menupop with-avatar\"><a class='ab-item' aria-haspopup=\"true\" href='http:\/\/192.168.68.128\/blog\/wp-admin\/profile.php'>Howdy, <span class=\"display-name\">Liyi<\/span><img alt='' src='http:\/\/1.gravatar.com\/avatar\/1784d132335901c6b08316b3cd7074de?s=26&#038;d=mm&#038;r=g' srcset='http:\/\/1.gravatar.com\/avatar\/1784d132335901c6b08316b3cd7074de?s=52&#038;d=mm&#038;r=g 2x' class='avatar avatar-26 photo' height='26' width='26' loading='lazy'\/><\/a>\n<div class=\"ab-sub-wrapper\">\n<ul id='wp-admin-bar-user-actions' class=\"ab-submenu\">\n<li id='wp-admin-bar-user-info'><a class='ab-item' tabindex=\"-1\" href='http:\/\/192.168.68.128\/blog\/wp-admin\/profile.php'><img alt='' src='http:\/\/1.gravatar.com\/avatar\/1784d132335901c6b08316b3cd7074de?s=64&#038;d=mm&#038;r=g' srcset='http:\/\/1.gravatar.com\/avatar\/1784d132335901c6b08316b3cd7074de?s=128&#038;d=mm&#038;r=g 2x' class='avatar avatar-64 photo' height='64' width='64' loading='lazy'\/><span class='display-name'>Liyi<\/span><span class='username'>alex<\/span><\/a><\/li>\n<li id='wp-admin-bar-edit-profile'><a class='ab-item' href='http:\/\/192.168.68.128\/blog\/wp-admin\/profile.php'>Edit Profile<\/a><\/li>\n<li id='wp-admin-bar-logout'><a class='ab-item' href='http:\/\/192.168.68.128\/blog\/wp-login.php?action=logout&#038;_wpnonce=bf798f23d4'>Log Out<\/a><\/li>\n<\/ul>\n<\/div>\n<\/li>\n<\/ul><\/div>\n<p>\t\t\t\t\t\t<a class=\"screen-reader-shortcut\" href=\"http:\/\/192.168.68.128\/blog\/wp-login.php?action=logout&#038;_wpnonce=bf798f23d4\">Log Out<\/a>\n\t\t\t\t\t<\/div>\n<p>\t\t<\/body><br \/>\n<\/html><br \/>\n[\/html]<\/p>\n","protected":false},"excerpt":{"rendered":"<p>\u4e00\u4e2a\u5f88\u4e0d\u9519\u7684CSS Layout\u3002 \u4e0d\u8bb0\u5f97\u662f\u4ece\u54ea\u91cc\u770b\u5230\u7684\u4e86\u3002 [html] Untitled Document This is for the header information This is for the top nav This is for the right nav stuff This area is for the main content. This area is for the main content. This area is for the main content. This area is for the main content. This area [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[5],"tags":[],"class_list":["post-2137","post","type-post","status-publish","format-standard","hentry","category-css-designing"],"_links":{"self":[{"href":"http:\/\/www.hi-alex.com\/index.php?rest_route=\/wp\/v2\/posts\/2137","targetHints":{"allow":["GET"]}}],"collection":[{"href":"http:\/\/www.hi-alex.com\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"http:\/\/www.hi-alex.com\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"http:\/\/www.hi-alex.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/www.hi-alex.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=2137"}],"version-history":[{"count":0,"href":"http:\/\/www.hi-alex.com\/index.php?rest_route=\/wp\/v2\/posts\/2137\/revisions"}],"wp:attachment":[{"href":"http:\/\/www.hi-alex.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=2137"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/www.hi-alex.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=2137"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/www.hi-alex.com\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=2137"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}