{"id":30504,"date":"2021-08-22T12:29:45","date_gmt":"2021-08-22T04:29:45","guid":{"rendered":"https:\/\/web4theme.com\/?p=30504"},"modified":"2021-08-23T23:12:31","modified_gmt":"2021-08-23T15:12:31","slug":"html%e7%b6%b2%e9%a0%81%e8%a8%ad%e8%a8%88%e7%af%84%e4%be%8b-%e5%b7%a6%e5%9c%96%e5%8f%b3%e5%ad%97","status":"publish","type":"post","link":"https:\/\/web4theme.com\/?p=30504","title":{"rendered":"HTML\u7db2\u9801\u8a2d\u8a08\u7bc4\u4f8b-\u5de6\u5716\u53f3\u5b57"},"content":{"rendered":"\n<p>\u5728\u505a\u9801\u9762\u958b\u767c\u7684\u6642\u5019\uff0c\u6709\u5f88\u591a\u7684\u6392\u7248\u65b9\u5f0f\uff0c\u5982\u679c\u7528\u4ee3\u78bc\u5c07\u5176\u4e00\u4e00\u5be6\u73fe\uff0c\u90a3\u5c31\u9700\u8981\u9ede\u8010\u5fc3\u4e86\uff0c\u4eca\u5929\u6211\u5011\u4f7f\u7528\u4ee3\u78bc\u4f86\u505a\u500b\u5716\u6587\u6392\u7248\u7684\u9801\u9762\uff0c\u5de6\u5074\u662f\u5716\u7247\u5340\uff0c\u53f3\u5074\u662f\u6587\u5b57\u89e3\u91cb\u5340\u3002\u9019\u662f\u5f88\u5e38\u898b\u7684\u6392\u7248\uff0c<\/p>\n\n\n\n<div id=\"ez-toc-container\" class=\"ez-toc-v2_0_73 counter-hierarchy ez-toc-counter ez-toc-grey ez-toc-container-direction\">\n<div class=\"ez-toc-title-container\">\n<p class=\"ez-toc-title\" style=\"cursor:inherit\">Table of Contents<\/p>\n<span class=\"ez-toc-title-toggle\"><a href=\"#\" class=\"ez-toc-pull-right ez-toc-btn ez-toc-btn-xs ez-toc-btn-default ez-toc-toggle\" aria-label=\"Toggle Table of Content\"><span class=\"ez-toc-js-icon-con\"><span class=\"\"><span class=\"eztoc-hide\" style=\"display:none;\">Toggle<\/span><span class=\"ez-toc-icon-toggle-span\"><svg style=\"fill: #999;color:#999\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"list-377408\" width=\"20px\" height=\"20px\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M6 6H4v2h2V6zm14 0H8v2h12V6zM4 11h2v2H4v-2zm16 0H8v2h12v-2zM4 16h2v2H4v-2zm16 0H8v2h12v-2z\" fill=\"currentColor\"><\/path><\/svg><svg style=\"fill: #999;color:#999\" class=\"arrow-unsorted-368013\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"10px\" height=\"10px\" viewBox=\"0 0 24 24\" version=\"1.2\" baseProfile=\"tiny\"><path d=\"M18.2 9.3l-6.2-6.3-6.2 6.3c-.2.2-.3.4-.3.7s.1.5.3.7c.2.2.4.3.7.3h11c.3 0 .5-.1.7-.3.2-.2.3-.5.3-.7s-.1-.5-.3-.7zM5.8 14.7l6.2 6.3 6.2-6.3c.2-.2.3-.5.3-.7s-.1-.5-.3-.7c-.2-.2-.4-.3-.7-.3h-11c-.3 0-.5.1-.7.3-.2.2-.3.5-.3.7s.1.5.3.7z\"\/><\/svg><\/span><\/span><\/span><\/a><\/span><\/div>\n<nav><ul class='ez-toc-list ez-toc-list-level-1 ' ><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-1\" href=\"https:\/\/web4theme.com\/?p=30504\/#%E6%9C%80%E7%B5%82%E6%95%88%E6%9E%9C%E5%9C%96%E5%A6%82%E4%B8%8B%EF%BC%9A\" title=\"\u6700\u7d42\u6548\u679c\u5716\u5982\u4e0b\uff1a\">\u6700\u7d42\u6548\u679c\u5716\u5982\u4e0b\uff1a<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/web4theme.com\/?p=30504\/#%E9%A6%96%E5%85%88%E5%85%88%E6%BA%96%E5%82%99%E5%9C%96%E7%89%87%E7%B4%A0%E6%9D%90%E5%92%8C%E6%96%87%E5%AD%97%E8%AA%9E%E8%A8%80\" title=\"\u9996\u5148\u5148\u6e96\u5099\u5716\u7247\u7d20\u6750\u548c\u6587\u5b57\u8a9e\u8a00\">\u9996\u5148\u5148\u6e96\u5099\u5716\u7247\u7d20\u6750\u548c\u6587\u5b57\u8a9e\u8a00<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-3\" href=\"https:\/\/web4theme.com\/?p=30504\/#%E9%96%8B%E5%A7%8B%E6%B7%BB%E5%8A%A0CSS%E6%A8%A3%E5%BC%8F%E4%BF%AE%E9%A3%BE\" title=\"\u958b\u59cb\u6dfb\u52a0CSS\u6a23\u5f0f\u4fee\u98fe\">\u958b\u59cb\u6dfb\u52a0CSS\u6a23\u5f0f\u4fee\u98fe<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-4\" href=\"https:\/\/web4theme.com\/?p=30504\/#%E6%83%B3%E8%A6%81%E5%B0%87%E5%9C%96%E6%96%87%E5%B7%A6%E5%8F%B3%E6%8E%92%E7%89%88%EF%BC%8C%E4%B8%BB%E8%A6%81%E6%98%AF%E5%AE%9A%E4%BD%8D%E6%88%96%E8%80%85%E6%B5%AE%E5%8B%95\" title=\"\u60f3\u8981\u5c07\u5716\u6587\u5de6\u53f3\u6392\u7248\uff0c\u4e3b\u8981\u662f\u5b9a\u4f4d\u6216\u8005\u6d6e\u52d5\">\u60f3\u8981\u5c07\u5716\u6587\u5de6\u53f3\u6392\u7248\uff0c\u4e3b\u8981\u662f\u5b9a\u4f4d\u6216\u8005\u6d6e\u52d5<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-5\" href=\"https:\/\/web4theme.com\/?p=30504\/#%E5%AE%8C%E6%95%B4%E4%BB%A3%E7%A2%BC%E5%A6%82%E4%B8%8B%EF%BC%9A\" title=\"\u5b8c\u6574\u4ee3\u78bc\u5982\u4e0b\uff1a\">\u5b8c\u6574\u4ee3\u78bc\u5982\u4e0b\uff1a<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-6\" href=\"https:\/\/web4theme.com\/?p=30504\/#%E5%BD%A9%E8%9B%8B\" title=\"\u5f69\u86cb\">\u5f69\u86cb<\/a><\/li><\/ul><\/nav><\/div>\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"%E6%9C%80%E7%B5%82%E6%95%88%E6%9E%9C%E5%9C%96%E5%A6%82%E4%B8%8B%EF%BC%9A\"><\/span>\u6700\u7d42\u6548\u679c\u5716\u5982\u4e0b\uff1a<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"blob:https:\/\/web4theme.com\/24acaed7-b57f-446d-8dd1-c748bff0aa55\" alt=\"\"\/><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"%E9%A6%96%E5%85%88%E5%85%88%E6%BA%96%E5%82%99%E5%9C%96%E7%89%87%E7%B4%A0%E6%9D%90%E5%92%8C%E6%96%87%E5%AD%97%E8%AA%9E%E8%A8%80\"><\/span>\u9996\u5148\u5148\u6e96\u5099\u5716\u7247\u7d20\u6750\u548c\u6587\u5b57\u8a9e\u8a00<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>\uff0c\u5728body\u4e2d\u7684\u624b\u5de5\u8f38\u5165\u57fa\u672c\u7684HTML\u7d50\u69cb\uff0c\u5982\u4e0b\uff1a<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code lang=\"markup\" class=\"language-markup line-numbers\">&lt;html&gt;\n  &lt;head&gt;\n    &lt;meta charset=\"utf-8\" &gt;\n    &lt;title&gt;\u7db2\u9801\u7bc4\u4f8b-\u5de6\u5716\u53f3\u5b57&lt;\/title&gt;\n  &lt;\/head&gt;\n  &lt;body&gt;\n    &lt;div class=\"happy\"&gt;\n      &lt;div class=\"bdcard\"&gt;\n        &lt;img src=\"pexels-giftpunditscom-2072181.jpg\" alt=\"\u751f\u65e5\u5361\" \/&gt;\n      &lt;\/div&gt;\n      &lt;div class=\"bdtext\"&gt;\n        &lt;h1&gt;\u751f\u65e5\u5feb\u6a02&lt;\/h1&gt;\n        &lt;p&gt;\u4e5f\u8a31\u4f60\u4e26\u4e0d\u662f\u70ba\u6211\u800c\u751f\uff0c\u53ef\u6211\u537b\u6709\u5e78\u8207\u4f60\u76f8\u4f34\u3002\u5e0c\u671b\u5728\u6211\u6709\u751f\u4e4b\u5e74\uff0c\u5e74\u5e74\u70ba\u4f60\u9ede\u71c3\u751f\u65e5\u7684\u71ed\u7130\u3002&lt;\/p&gt;\n        &lt;p&gt;\u5728\u4f60\u751f\u65e5\u9019\u4e00\u5929\uff0c\u4e5f\u7559\u4e0b\u6211\u7684\u9858\u671b\uff0c\u9858\u4f60\u5feb\u6a02\u6bcf\u4e00\u5929!&lt;\/p&gt;\n      &lt;\/div&gt;\n    &lt;\/div&gt;\n  &lt;\/body&gt;\n&lt;\/html&gt;<\/code><\/pre>\n\n\n\n<p>HTML\u6587\u4ef6\u540d\u70ba index.html \uff0c\u76f8\u7247\u662f\u5f9e\u7db2\u4e0a\u627e\u7684\u514d\u8cbb\u76f8\u7247\uff0c\u653e\u5728index.html \u6240\u5728\u7684\u6587\u4ef6\u593e\u5373\u53ef\u3002\u73fe\u6642\u9810\u89bd\u662f\u9019\u6a23\u7684\uff1a<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"780\" src=\"https:\/\/web4theme.com\/wp-content\/uploads\/2021\/08\/image-7-1024x780.png\" alt=\"\" class=\"wp-image-30532\" srcset=\"https:\/\/web4theme.com\/wp-content\/uploads\/2021\/08\/image-7-1024x780.png 1024w, https:\/\/web4theme.com\/wp-content\/uploads\/2021\/08\/image-7-300x229.png 300w, https:\/\/web4theme.com\/wp-content\/uploads\/2021\/08\/image-7-768x585.png 768w, https:\/\/web4theme.com\/wp-content\/uploads\/2021\/08\/image-7.png 1072w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"%E9%96%8B%E5%A7%8B%E6%B7%BB%E5%8A%A0CSS%E6%A8%A3%E5%BC%8F%E4%BF%AE%E9%A3%BE\"><\/span>\u958b\u59cb\u6dfb\u52a0CSS\u6a23\u5f0f\u4fee\u98fe<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>\uff0c\u6307\u5b9a\u5716\u7247\u8207\u6587\u5b57\u4f4d\u7f6e\u3002\u6700\u5916\u9762\u7684\u5927\u6846\u6dfb\u52a0\u5bec\u5ea6\u5c45\u4e2d\uff1b\u4e0b\u9762\u7684\u5716\u7247\u548c\u6587\u5b57\u8a2d\u7f6e<\/p>\n\n\n\n<p>\u73fe\u5728\u7684\u5716\u6587\u662f\u9019\u6a23\u6392\u7248\uff0c\u5982\u5716<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"959\" height=\"698\" src=\"https:\/\/web4theme.com\/wp-content\/uploads\/2021\/08\/image-8.png\" alt=\"\" class=\"wp-image-30533\" srcset=\"https:\/\/web4theme.com\/wp-content\/uploads\/2021\/08\/image-8.png 959w, https:\/\/web4theme.com\/wp-content\/uploads\/2021\/08\/image-8-300x218.png 300w, https:\/\/web4theme.com\/wp-content\/uploads\/2021\/08\/image-8-768x559.png 768w\" sizes=\"auto, (max-width: 959px) 100vw, 959px\" \/><\/figure>\n\n\n\n<pre class=\"wp-block-code\"><code lang=\"markup\" class=\"language-markup line-numbers\">&lt;html&gt;\n  &lt;head&gt;\n    &lt;meta charset=\"utf-8\" &gt;\n    &lt;title&gt;\u7db2\u9801\u7bc4\u4f8b-\u5de6\u5716\u53f3\u5b57&lt;\/title&gt;\n    &lt;style&gt;\n        .happy{\n          width: 800px;\n          margin: 50px auto;\n          border:solid 1px gray;\n        }\n        .bdcard{\n          width: 300px;\n        }\n        .bdcard img{\n          display: block;\n          width:100%;\n        }\n        .bdtext{\n          width: 430px;\n        }\n  &lt;\/style&gt;\n  &lt;\/head&gt;\n  &lt;body&gt;\n    &lt;div class=\"happy\"&gt;\n      &lt;div class=\"bdcard\"&gt;\n        &lt;img src=\"pexels-giftpunditscom-2072181.jpg\" alt=\"\u751f\u65e5\u5361\" \/&gt;\n      &lt;\/div&gt;\n      &lt;div class=\"bdtext\"&gt;\n        &lt;h1&gt;\u751f\u65e5\u5feb\u6a02&lt;\/h1&gt;\n        &lt;p&gt;\u4e5f\u8a31\u4f60\u4e26\u4e0d\u662f\u70ba\u6211\u800c\u751f\uff0c\u53ef\u6211\u537b\u6709\u5e78\u8207\u4f60\u76f8\u4f34\u3002\u5e0c\u671b\u5728\u6211\u6709\u751f\u4e4b\u5e74\uff0c\u5e74\u5e74\u70ba\u4f60\u9ede\u71c3\u751f\u65e5\u7684\u71ed\u7130\u3002&lt;\/p&gt;\n        &lt;p&gt;\u5728\u4f60\u751f\u65e5\u9019\u4e00\u5929\uff0c\u4e5f\u7559\u4e0b\u6211\u7684\u9858\u671b\uff0c\u9858\u4f60\u5feb\u6a02\u6bcf\u4e00\u5929!&lt;\/p&gt;\n      &lt;\/div&gt;\n    &lt;\/div&gt;\n  &lt;\/body&gt;\n&lt;\/html&gt;<\/code><\/pre>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"%E6%83%B3%E8%A6%81%E5%B0%87%E5%9C%96%E6%96%87%E5%B7%A6%E5%8F%B3%E6%8E%92%E7%89%88%EF%BC%8C%E4%B8%BB%E8%A6%81%E6%98%AF%E5%AE%9A%E4%BD%8D%E6%88%96%E8%80%85%E6%B5%AE%E5%8B%95\"><\/span>\u60f3\u8981\u5c07\u5716\u6587\u5de6\u53f3\u6392\u7248\uff0c\u4e3b\u8981\u662f\u5b9a\u4f4d\u6216\u8005\u6d6e\u52d5<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>\uff0c\u5c0d\u5716\u7247\u584a\u548c\u6587\u5b57\u584a\u90fd\u6dfb\u52a0\u4e86\u6d6e\u52d5\u6548\u679c\u5f8c\uff0c<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"859\" height=\"391\" src=\"https:\/\/web4theme.com\/wp-content\/uploads\/2021\/08\/image-9.png\" alt=\"\" class=\"wp-image-30534\" srcset=\"https:\/\/web4theme.com\/wp-content\/uploads\/2021\/08\/image-9.png 859w, https:\/\/web4theme.com\/wp-content\/uploads\/2021\/08\/image-9-300x137.png 300w, https:\/\/web4theme.com\/wp-content\/uploads\/2021\/08\/image-9-768x350.png 768w\" sizes=\"auto, (max-width: 859px) 100vw, 859px\" \/><\/figure>\n\n\n\n<p>\u5982\u5716\uff0c\u6dfb\u52a0\u6d6e\u52d5\u5f8c\uff0c\u6587\u5b57\u90e8\u5206\u56e0\u70ba\u6587\u5b57\u592a\u9577\u8d85\u51fa\u4e86\u4ed6\u6240\u7528\u90a3\u7684\u7bc4\u570d\uff0c\u6240\u4ee5\u88ab\u64e0\u5230\u5230\u4e86\u4e0b\u884c\u7684\u53f3\u5074\uff0c\u52a0\u500boverflow: hidden\u5c31\u6b63\u5e38<\/p>\n\n\n\n<p>\u540c\u6642\u5c07\u6587\u5b57\u5340\u57df\u8a2d\u7f6e\u4e0b\u5bec\u5ea6\uff0c\u4e0d\u8b93\u4ed6\u8d85\u904e\u6700\u5927\u7bc4\u570d\u5c31\u884c\u4e86\uff0c\u793a\u4f8b\u8a2d\u7f6e\u70bawidth: 430px<\/p>\n\n\n\n<p>\u7136\u5f8c\u518d\u9810\u89bd\u6548\u679c\u5716\uff0c\u52a0\u4e9bpadding\u8abf\u6574\u4e00\u4e0b\u5de6\u53f3\u7a7a\u9593\uff0c\u611f\u89ba\u5c31\u597d\u770b\u591a\u4e86\u3002<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"%E5%AE%8C%E6%95%B4%E4%BB%A3%E7%A2%BC%E5%A6%82%E4%B8%8B%EF%BC%9A\"><\/span>\u5b8c\u6574\u4ee3\u78bc\u5982\u4e0b\uff1a<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<pre class=\"wp-block-code\"><code class=\"\">&lt;html&gt;\n  &lt;head&gt;\n    &lt;meta charset=\"utf-8\" &gt;\n    &lt;title&gt;\u7db2\u9801\u7bc4\u4f8b-\u5de6\u5716\u53f3\u5b57&lt;\/title&gt;\n    &lt;style&gt;\n        .happy{\n          width: 800px;\n          margin: 50px auto;\n          border:solid 1px gray;\n          overflow: hidden; \/* \u907f\u514d\u9577\u65b9\u6846\u4e0b\u9762\u986f\u793a\u4e0d\u6b63\u5e38 *\/\n        }\n        .bdcard{\n          width: 300px;\n          float:left; \/* \u5716\u7247\u5728\u5de6\u908a *\/\n          padding: 20px;\n        }\n        .bdcard img{\n          display: block;\n          width:100%;\n        }\n        .bdtext{\n          float: right;  \/* \u6587\u5b57\u5728\u53f3\u908a *\/\n          width: 430px;\n          padding: 20px 20px 0px 0px;\n        }\n    &lt;\/style&gt;\n  &lt;\/head&gt;\n  &lt;body&gt;\n    &lt;div class=\"happy\"&gt;\n      &lt;div class=\"bdcard\"&gt;\n        &lt;img src=\"pexels-giftpunditscom-2072181.jpg\" alt=\"\u751f\u65e5\u5361\" \/&gt;\n      &lt;\/div&gt;\n      &lt;div class=\"bdtext\"&gt;\n        &lt;h1&gt;\u751f\u65e5\u5feb\u6a02&lt;\/h1&gt;\n        &lt;p&gt;\u4e5f\u8a31\u4f60\u4e26\u4e0d\u662f\u70ba\u6211\u800c\u751f\uff0c\u53ef\u6211\u537b\u6709\u5e78\u8207\u4f60\u76f8\u4f34\u3002\u5e0c\u671b\u5728\u6211\u6709\u751f\u4e4b\u5e74\uff0c\u5e74\u5e74\u70ba\u4f60\u9ede\u71c3\u751f\u65e5\u7684\u71ed\u7130\u3002&lt;\/p&gt;\n        &lt;p&gt;\u5728\u4f60\u751f\u65e5\u9019\u4e00\u5929\uff0c\u4e5f\u7559\u4e0b\u6211\u7684\u9858\u671b\uff0c\u9858\u4f60\u5feb\u6a02\u6bcf\u4e00\u5929!&lt;\/p&gt;\n      &lt;\/div&gt;\n    &lt;\/div&gt;\n  &lt;\/body&gt;\n&lt;\/html&gt;<\/code><\/pre>\n\n\n\n<p><\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"%E5%BD%A9%E8%9B%8B\"><\/span>\u5f69\u86cb<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>\u6211\u611f\u89ba\u770b\u5230\u9019\u88cf\u7684\u90fd\u5df2\u7d93\u5f88\u8a8d\u771f\u5b78\u7fd2\uff0c\u6240\u4ee5\u6211\u5728\u9019\u500bhtml\u7bc4\u4f8b\u4e0a\u518d\u52a0\u591a\u4e86\u6587\u5b57\u570d\u7e5e\u6587\u5b57\u7684\u4f8b\u5b50\uff0c\u5982\u679c\u6709\u5fc3\u5b78\u7fd2\uff0c\u53ef\u4ee5\u5728\u9019\u88cf\u770b<a href=\"https:\/\/web4theme.com\/wp-content\/demos\/html5demo1\/index.html\" target=\"_blank\" rel=\"noreferrer noopener nofollow\">\u9801\u9762\u4ee3\u78bc<\/a>\uff08\u53f3\u9375\u9078\u64c7\u67e5\u770b\u6e90\u78bc\u53ef\u770b\u5230\u9801\u9762\u6e90\u78bc\uff0c\u5728\u76f8\u7247\u53f3\u9375\u9ede\u64ca\u53ef\u9078\u64c7\u4e0b\u8f09\u5230\u672c\u5730\uff0c\u5c07\u9801\u9762\u6e90\u78bc\u8207\u76f8\u7247\u653e\u5728\u76f8\u540c\u4f4d\u7f6e\uff0c\u5c31\u53ef\u4ee5\u7528chrome\u76f4\u63a5\u9810\u89bd\uff09\uff0c\u6548\u679c\u5982\u4e0b\uff1a<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"900\" height=\"922\" src=\"https:\/\/web4theme.com\/wp-content\/uploads\/2021\/08\/image-10.png\" alt=\"\" class=\"wp-image-30535\" srcset=\"https:\/\/web4theme.com\/wp-content\/uploads\/2021\/08\/image-10.png 900w, https:\/\/web4theme.com\/wp-content\/uploads\/2021\/08\/image-10-293x300.png 293w, https:\/\/web4theme.com\/wp-content\/uploads\/2021\/08\/image-10-768x787.png 768w\" sizes=\"auto, (max-width: 900px) 100vw, 900px\" \/><\/figure>\n","protected":false},"excerpt":{"rendered":"<p>\u5728\u505a\u9801\u9762\u958b\u767c\u7684\u6642\u5019\uff0c\u6709\u5f88\u591a\u7684\u6392\u7248\u65b9\u5f0f\uff0c\u5982\u679c\u7528\u4ee3\u78bc\u5c07\u5176\u4e00\u4e00\u5be6\u73fe\uff0c\u90a3\u5c31\u9700\u8981\u9ede\u8010\u5fc3\u4e86\uff0c\u4eca\u5929\u6211\u5011\u4f7f\u7528\u4ee3\u78bc\u4f86\u505a\u500b\u5716\u6587\u6392\u7248\u7684\u9801\u9762\uff0c\u5de6\u5074\u662f\u5716\u7247\u5340\uff0c\u53f3\u5074\u662f\u6587\u5b57\u89e3\u91cb\u5340\u3002\u9019\u662f\u5f88\u5e38\u898b\u7684\u6392\u7248\uff0c \u6700\u7d42\u6548\u679c\u5716\u5982\u4e0b\uff1a \u9996\u5148\u5148\u6e96\u5099\u5716\u7247\u7d20\u6750\u548c\u6587\u5b57\u8a9e\u8a00 \uff0c\u5728body\u4e2d\u7684\u624b\u5de5\u8f38\u5165\u57fa\u672c\u7684HTML\u7d50\u69cb\uff0c\u5982\u4e0b\uff1a HTML\u6587\u4ef6\u540d\u70ba index.html \uff0c\u76f8\u7247\u662f\u5f9e\u7db2\u4e0a\u627e\u7684\u514d\u8cbb\u76f8\u7247\uff0c\u653e\u5728index.html \u6240\u5728\u7684\u6587\u4ef6\u593e\u5373\u53ef\u3002\u73fe\u6642\u9810\u89bd\u662f\u9019\u6a23\u7684\uff1a \u958b\u59cb\u6dfb\u52a0CSS\u6a23\u5f0f\u4fee\u98fe \uff0c\u6307\u5b9a\u5716\u7247\u8207\u6587\u5b57\u4f4d\u7f6e\u3002\u6700\u5916\u9762\u7684\u5927\u6846\u6dfb\u52a0\u5bec\u5ea6\u5c45\u4e2d\uff1b\u4e0b\u9762\u7684\u5716\u7247\u548c\u6587\u5b57\u8a2d\u7f6e \u73fe\u5728\u7684\u5716\u6587\u662f\u9019\u6a23\u6392\u7248\uff0c\u5982\u5716 \u60f3\u8981\u5c07\u5716\u6587\u5de6\u53f3\u6392\u7248\uff0c\u4e3b\u8981\u662f\u5b9a\u4f4d\u6216\u8005\u6d6e\u52d5 \uff0c\u5c0d\u5716\u7247\u584a\u548c\u6587\u5b57\u584a\u90fd\u6dfb\u52a0\u4e86\u6d6e\u52d5\u6548\u679c\u5f8c\uff0c \u5982\u5716\uff0c\u6dfb\u52a0\u6d6e\u52d5\u5f8c\uff0c\u6587\u5b57\u90e8\u5206\u56e0\u70ba\u6587\u5b57\u592a\u9577\u8d85\u51fa\u4e86\u4ed6\u6240\u7528\u90a3\u7684\u7bc4\u570d\uff0c\u6240\u4ee5\u88ab\u64e0\u5230\u5230\u4e86\u4e0b\u884c\u7684\u53f3\u5074\uff0c\u52a0\u500boverflow: hidden\u5c31\u6b63\u5e38 \u540c\u6642\u5c07\u6587\u5b57\u5340\u57df\u8a2d\u7f6e\u4e0b\u5bec\u5ea6\uff0c\u4e0d\u8b93\u4ed6\u8d85\u904e\u6700\u5927\u7bc4\u570d\u5c31\u884c\u4e86\uff0c\u793a\u4f8b\u8a2d\u7f6e\u70bawidth: 430px \u7136\u5f8c\u518d\u9810\u89bd\u6548\u679c\u5716\uff0c\u52a0\u4e9bpadding\u8abf\u6574\u4e00\u4e0b\u5de6\u53f3\u7a7a\u9593\uff0c\u611f\u89ba\u5c31\u597d\u770b\u591a\u4e86\u3002 \u5b8c\u6574\u4ee3\u78bc\u5982\u4e0b\uff1a \u5f69\u86cb \u6211\u611f\u89ba\u770b\u5230\u9019\u88cf\u7684\u90fd\u5df2\u7d93\u5f88\u8a8d\u771f\u5b78\u7fd2\uff0c\u6240\u4ee5\u6211\u5728\u9019\u500bhtml\u7bc4\u4f8b\u4e0a\u518d\u52a0\u591a\u4e86\u6587\u5b57\u570d\u7e5e\u6587\u5b57\u7684\u4f8b\u5b50\uff0c\u5982\u679c\u6709\u5fc3\u5b78\u7fd2\uff0c\u53ef\u4ee5\u5728\u9019\u88cf\u770b\u9801\u9762\u4ee3\u78bc\uff08\u53f3\u9375\u9078\u64c7\u67e5\u770b\u6e90\u78bc\u53ef\u770b\u5230\u9801\u9762\u6e90\u78bc\uff0c\u5728\u76f8\u7247\u53f3\u9375\u9ede\u64ca\u53ef\u9078\u64c7\u4e0b\u8f09\u5230\u672c\u5730\uff0c\u5c07\u9801\u9762\u6e90\u78bc\u8207\u76f8\u7247\u653e\u5728\u76f8\u540c\u4f4d\u7f6e\uff0c\u5c31\u53ef\u4ee5\u7528chrome\u76f4\u63a5\u9810\u89bd\uff09\uff0c\u6548\u679c\u5982\u4e0b\uff1a<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[103],"tags":[],"class_list":["post-30504","post","type-post","status-publish","format-standard","hentry","category-webdesign-example"],"_links":{"self":[{"href":"https:\/\/web4theme.com\/index.php?rest_route=\/wp\/v2\/posts\/30504","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/web4theme.com\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/web4theme.com\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/web4theme.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/web4theme.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=30504"}],"version-history":[{"count":18,"href":"https:\/\/web4theme.com\/index.php?rest_route=\/wp\/v2\/posts\/30504\/revisions"}],"predecessor-version":[{"id":30543,"href":"https:\/\/web4theme.com\/index.php?rest_route=\/wp\/v2\/posts\/30504\/revisions\/30543"}],"wp:attachment":[{"href":"https:\/\/web4theme.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=30504"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/web4theme.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=30504"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/web4theme.com\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=30504"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}