{"id":5132,"date":"2024-09-27T18:01:03","date_gmt":"2024-09-27T10:01:03","guid":{"rendered":""},"modified":"2024-09-27T18:01:03","modified_gmt":"2024-09-27T10:01:03","slug":"web\u524d\u7aef\u57fa\u7840\u77e5\u8bc6\u8bd5\u9898\u53ca\u7b54\u6848_web\u524d\u7aef\u5f00\u53d1\u9700\u8981\u638c\u63e1\u4ec0\u4e48","status":"publish","type":"post","link":"https:\/\/mushiming.com\/5132.html","title":{"rendered":"web\u524d\u7aef\u57fa\u7840\u77e5\u8bc6\u8bd5\u9898\u53ca\u7b54\u6848_web\u524d\u7aef\u5f00\u53d1\u9700\u8981\u638c\u63e1\u4ec0\u4e48"},"content":{"rendered":"<p><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"display: none;\"> \n <path stroke-linecap=\"round\" d=\"M5,0 0,2.5 5,5z\" id=\"raphael-marker-block\" style=\"-webkit-tap-highlight-color: rgba(0, 0, 0, 0);\"><\/path> \n<\/svg> <\/p>\n<h2>HTML&amp;CSS\u57fa\u7840\u7ecf\u5178\u7248<\/h2>\n<ol>\n<li>\n<p>HTML\uff1a\u7ed3\u6784\uff08<strong>\u9875\u9762\u5143\u7d20<\/strong>\u548c\u5185\u5bb9\uff09<\/p>\n<\/li>\n<li>\n<p>css\uff1a\u8868\u73b0\uff08\u7f51\u9875\u5143\u7d20\u7684\u5916\u89c2\u548c\u4f4d\u7f6e\u7b49<strong>\u9875\u9762\u6837\u5f0f<\/strong>\uff09<\/p>\n<\/li>\n<li>\n<p>\u884c\u4e3a\uff1aJavaScript\uff1a\u884c\u4e3a\uff08\u7f51\u9875\u6a21\u578b\u5b9a\u4e49\u4e0e<strong>\u9875\u9762\u4ea4\u4e92<\/strong>\uff09<\/p>\n<h4>\u6392\u7248\u6807\u7b7e<\/h4>\n<ol>\n<li>\n<p>\u6392\u7248\u6807\u7b7e\u6807\u9898\u6807\u7b7e\uff1ah\u7cfb\u5217\u6807\u7b7e \u91cd\u8981\u7a0b\u5ea6<strong>\u4f9d\u6b21\u9012\u51cf<\/strong><\/p>\n<p>\u7279\u70b9\uff1a\u72ec\u5360\u4e00\u884c\u3001h1-h6\u6587\u5b57\u9010\u6e10\u51cf\u5c0f<\/p>\n<\/li>\n<li>\n<p>\u6bb5\u843d\u6807\u7b7e\uff1ap<\/p>\n<p>\u7279\u70b9\uff1a\u6bb5\u843d\u4e4b\u95f4\u5b58\u5728\u95f4\u9699\u3001\u72ec\u5360\u4e00\u884c<\/p>\n<\/li>\n<li>\n<p>\u6362\u884c\u6807\u7b7e\uff1a<\/p>\n<\/li>\n<li>\n<p>\u6c34\u5e73\u5206\u5272\u7ebf\uff1a<\/p>\n<hr>\n<\/li>\n<\/ol>\n<\/li>\n<\/ol>\n<ul>\n<li>\n<h4>\u6587\u672c\u683c\u5f0f\u5316\u6807\u7b7e<\/h4>\n<\/li>\n<\/ul>\n<ol>\n<li>\u573a\u666f\uff1a\u8ba9\u6587\u5b57\u52a0\u7c97b strong\u3001\u4e0b\u5212\u7ebfu ins\u3001\u503e\u659ci em\u3001\u5220\u9664\u7ebfs del\u7b49<\/li>\n<li>\u8bed\u4e49\uff1a\u7a81\u51fa\u91cd\u8981\u6027\u7684\u5f3a\u8c03\u8bed\u5883 strong\u3001ins\u3001em\u3001del<\/li>\n<\/ol>\n<h4>\u56fe\u7247\u6807\u7b7e<\/h4>\n<ol>\n<li>\u7279\u70b9\uff1a\u5355\u6807\u7b7e <img decoding=\"async\" src=\"\" =\"\" =\"\" alt=\"web\u524d\u7aef\u57fa\u7840\u77e5\u8bc6\u8bd5\u9898\u53ca\u7b54\u6848_web\u524d\u7aef\u5f00\u53d1\u9700\u8981\u638c\u63e1\u4ec0\u4e48 (https:\/\/mushiming.com\/)  \u7b2c1\u5f20\" title=\"web\u524d\u7aef\u57fa\u7840\u77e5\u8bc6\u8bd5\u9898\u53ca\u7b54\u6848_web\u524d\u7aef\u5f00\u53d1\u9700\u8981\u638c\u63e1\u4ec0\u4e48  \u7b2c1\u5f20-\u7a46\u4e16\u660e\u535a\u5ba2\" ><\/li>\n<li>src alt\u4e3a\u56fe\u7247\u6807\u7b7e\u7684\u5c5e\u6027\u3001\u5c5e\u6027\u4e4b\u95f4\u6ca1\u6709\u987a\u5e8f<\/li>\n<li>src\u4e3a\u5c5e\u6027\u540d =\"\"\u4e3a\u5c5e\u6027\u503c<\/li>\n<li>alt\u662f\u66ff\u6362\u6587\u672c \u5f53\u56fe\u7247\u4e0d\u663e\u793a\u7684\u65f6\u5019\u663e\u793a\u7684\u6587\u5b57<\/li>\n<li>title\u65f6\u63d0\u793a\u6587\u672c \u4e0d\u4ec5\u53ef\u4ee5\u4e3a\u56fe\u7247\u6807\u7b7e\u6dfb\u52a0\uff0c\u8fd8\u53ef\u4ee5\u7528\u4e8e\u5176\u4ed6\u6807\u7b7e<\/li>\n<li>width\u548cheight\u5c5e\u6027\u53ea\u9700\u8981\u7ed9\u51fa\u4e00\u4e2a\u503c\uff0c\u53e6\u4e00\u4e2a\u7b49\u6bd4\u4f8b\u7f29\u653e\uff0c\u597d\u5904\u5c31\u662f\u56fe\u7247\u4e0d\u53d8\u5f62<\/li>\n<\/ol>\n<h4>\u8def\u5f84\u7684\u4ecb\u7ecd<\/h4>\n<ol>\n<li>\n<p>\u8def\u5f84\u53ef\u5206\u4e3a\uff1a\u7edd\u5bf9\u8def\u5f84\uff08\u4e86\u89e3\uff09<strong>\u76f8\u5bf9\u8def\u5f84\uff08\u5e38\u7528\uff09<\/strong><\/p>\n<\/li>\n<li>\n<p>\u7edd\u5bf9\u8def\u5f84\u4f8b\u5982\uff1a<strong>\u76d8\u7b26\u5f00\u5934<\/strong>\uff1aD\\day01\u3001<strong>\u5b8c\u6574\u7684\u7f51\u7edc\u5730\u5740<\/strong>\uff1ahttps:\/\/www.itcast.cn<\/p>\n<\/li>\n<li>\n<p>\u76f8\u5bf9\u8def\u5f84\uff1a\u4ece<strong>\u5f53\u524d\u6587\u4ef6\u51fa\u53d1<\/strong>\u627e\u76ee\u6807\u6587\u4ef6\u7684\u8fc7\u7a0b<\/p>\n<p>\u76f8\u5bf9\u8def\u5f84\u4e4b\u540c\u7ea7 **.\/**\u8868\u793a\u5f53\u524d\u4f4d\u7f6e<\/p>\n<p>\u76f8\u5bf9\u8def\u5f84\u4e4b\u4e0b\u7ea7 \uff1aimages\/baobao.jpg<\/p>\n<p>\u76f8\u5bf9\u8def\u5f84\u4e4b\u4e0a\u7ea7\uff1a**\u2026\/**\u8868\u793a\u4e0a\u7ea7<\/p>\n<\/li>\n<\/ol>\n<h4>\u97f3\u9891\u6807\u7b7e\uff1aaudio<\/h4>\n<p><img decoding=\"async\" src=\"https:\/\/img-blog.csdnimg.cn\/69cb948b6cdc4a9e8ec668ed43fb06b8.png\" =\"\" =\"\u5728\u8fd9\u91cc\u63d2\u5165\u56fe\u7247\u63cf\u8ff0\" alt=\"web\u524d\u7aef\u57fa\u7840\u77e5\u8bc6\u8bd5\u9898\u53ca\u7b54\u6848_web\u524d\u7aef\u5f00\u53d1\u9700\u8981\u638c\u63e1\u4ec0\u4e48 (https:\/\/mushiming.com\/)  \u7b2c2\u5f20\" title=\"web\u524d\u7aef\u57fa\u7840\u77e5\u8bc6\u8bd5\u9898\u53ca\u7b54\u6848_web\u524d\u7aef\u5f00\u53d1\u9700\u8981\u638c\u63e1\u4ec0\u4e48  \u7b2c2\u5f20-\u7a46\u4e16\u660e\u535a\u5ba2\" ><\/p>\n<h4>\u89c6\u9891\u6807\u7b7e\uff1avideo<\/h4>\n<ul>\n<li>\u6dfb\u52a0<code>muted<\/code>\u5728\u9759\u97f3\u72b6\u6001\u4e0b\u81ea\u52a8\u64ad\u653e<\/li>\n<\/ul>\n<h4>\u94fe\u63a5\u6807\u7b7e<\/h4>\n<ol>\n<li>href\u7684\u4f5c\u7528\u662f**<mark>\u8c03\u8f6c\u5730\u5740<\/mark>**<\/li>\n<\/ol>\n<p><img decoding=\"async\" src=\"https:\/\/img-blog.csdnimg.cn\/dfcb2c1d9ea84275b14152ff161be0c8.png\" =\"\" =\"\u5728\u8fd9\u91cc\u63d2\u5165\u56fe\u7247\u63cf\u8ff0\" alt=\"web\u524d\u7aef\u57fa\u7840\u77e5\u8bc6\u8bd5\u9898\u53ca\u7b54\u6848_web\u524d\u7aef\u5f00\u53d1\u9700\u8981\u638c\u63e1\u4ec0\u4e48 (https:\/\/mushiming.com\/)  \u7b2c3\u5f20\" title=\"web\u524d\u7aef\u57fa\u7840\u77e5\u8bc6\u8bd5\u9898\u53ca\u7b54\u6848_web\u524d\u7aef\u5f00\u53d1\u9700\u8981\u638c\u63e1\u4ec0\u4e48  \u7b2c3\u5f20-\u7a46\u4e16\u660e\u535a\u5ba2\" ><\/p>\n<ul>\n<li>\u5728\u65b0\u7a97\u53e3\u6253\u5f00\uff1a\u5c5e\u6027\u540d\u4e3a<code>target<\/code>\u3001\u53d6\u503c\uff1a<strong>_blank<\/strong><\/li>\n<\/ul>\n<h4>\u5217\u8868\u6807\u7b7e<\/h4>\n<ol>\n<li>\n<p>\u81ea\u5b9a\u4e49\u5217\u8868\uff1adl dt dd<\/p>\n<\/li>\n<li>\n<p>\u53bb\u6389\u65e0\u5e8f\u5217\u8868\u5c0f\u9ed1\u70b9\uff1a<\/p>\n<pre class=\"language-java prettyprint linenums\"><code>li { \/* \u53bb\u9664\u5c0f\u5706\u70b9 *\/ list-style: none; } <\/code><\/pre>\n<\/li>\n<\/ol>\n<h4>\u8868\u683c\u6807\u7b7e<\/h4>\n<ol>\n<li>table&gt;tr&gt;td<\/li>\n<li><strong>th<\/strong>\u4e3a\u8868\u5934\u6807\u7b7e\uff0c\u6709<strong>\u52a0\u7c97<\/strong>\u6548\u679c<\/li>\n<li>caption\u4e3a<strong>\u8868\u683c\u5927\u6807\u9898<\/strong><\/li>\n<li>\u7ed3\u6784\u6807\u7b7e\uff1athead,tbody,tfoot<\/li>\n<\/ol>\n<pre class=\"language-java prettyprint linenums\"><code>&lt;!-- \u7ed3\u6784\u6807\u7b7e\uff1athead,tbody,tfoot --&gt; &lt;body&gt; &lt;table border=\"1\"&gt; &lt;caption&gt;\u5b66\u751f\u6210\u7ee9\u5355&lt;\/caption&gt; &lt;thead&gt; &lt;tr&gt; &lt;th&gt;\u59d3\u540d&lt;\/th&gt; &lt;th&gt;\u5e74\u9f84&lt;\/th&gt; &lt;th&gt;\u6210\u7ee9&lt;\/th&gt; &lt;\/tr&gt; &lt;\/thead&gt; &lt;tbody&gt; &lt;tr&gt; &lt;td&gt;\u5f20\u4e09&lt;\/td&gt; &lt;td&gt;19&lt;\/td&gt; &lt;td&gt;33&lt;\/td&gt; &lt;\/tr&gt; &lt;tr&gt; &lt;td&gt;\u674e\u56db&lt;\/td&gt; &lt;td&gt;20&lt;\/td&gt; &lt;td&gt;44&lt;\/td&gt; &lt;\/tr&gt; &lt;\/tbody&gt; &lt;tfoot&gt; &lt;tr&gt; &lt;td&gt;\u738b\u4e8c&lt;\/td&gt; &lt;td&gt;20&lt;\/td&gt; &lt;td&gt;44&lt;\/td&gt; &lt;\/tr&gt; &lt;\/tfoot&gt; &lt;\/table&gt; &lt;\/body&gt; <\/code><\/pre>\n<h4>\u5408\u5e76\u5355\u5143\u683c<\/h4>\n<blockquote>\n<p>\u8de8\u884c\u5e76\u5217\uff1a<mark>rowspan<\/mark>\u3001\u8de8\u5217\u5e76\u5217\uff1a<mark>colspan<\/mark><\/p>\n<p>\u9075\u5faa<strong>\u5de6\u4e0a\u539f\u5219<\/strong><\/p>\n<\/blockquote>\n<h4>\u5217\u8868\u6807\u7b7e<\/h4>\n<ol>\n<li>\u5217\u8868\u7684\u5e94\u7528\u573a\u666f<\/li>\n<li>\u65e0\u5e8f\u5217\u8868<\/li>\n<li>\u6709\u5e8f\u5217\u8868<\/li>\n<li>\u81ea\u5b9a\u4e49\u5217\u8868<\/li>\n<\/ol>\n<h4>\u7edd\u5bf9\u8def\u5f84<\/h4>\n<ul>\n<li>\u7edd\u5bf9\u8def\u5f84\uff1a\u7edd\u5bf9\u8def\u5f84\u4f8b\u5982\uff1a\n<ul>\n<li><mark><strong>\u76d8\u7b26\u5f00\u5934<\/strong><\/mark>\uff1aD\\day01<\/li>\n<li>\u5b8c\u6574\u7684\u7f51\u7edc\u5730\u5740\uff1ahttp:\/\/wdianjun.vcn.ink<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<blockquote>\n<p><strong>\u7279\u70b9\uff1a<\/strong><mark>\u5730\u5740\u5f88\u957f<\/mark><\/p>\n<\/blockquote>\n<h4>\u76f8\u5bf9\u8def\u5f84<\/h4>\n<ul>\n<li>\u76f8\u5bf9\u8def\u5f84\u4e4b\u540c\u7ea7 <code>.\/<\/code>\u8868\u793a\u5f53\u524d\u4f4d\u7f6e<\/li>\n<li>\u76f8\u5bf9\u8def\u5f84\u4e4b\u4e0b\u7ea7\uff1a**\u5982\uff1a**images\/baobao.jpg<\/li>\n<li>\u76f8\u5bf9\u8def\u5f84\u4e4b\u4e0a\u7ea7\uff1a**\u5982\uff1a<code>..\/<\/code>**images\/baobao.jpg<\/li>\n<\/ul>\n<h4>\u8868\u5355\u6807\u7b7e-input<\/h4>\n<ul>\n<li><code>input type=\"text\"<\/code>\u6587\u672c\u6846<\/li>\n<li><code>input type=\"text\"<\/code>\u5bc6\u7801\u6846<\/li>\n<li><code>input type=\"radio\"<\/code>\u5355\u9009\u6846<\/li>\n<li><code>input type=\"checkbox\"<\/code>\u590d\u9009\u6846<\/li>\n<\/ul>\n<blockquote>\n<p><img decoding=\"async\" src=\"https:\/\/img-blog.csdnimg.cn\/f965008968c240c890f5492d512c479c.png\" =\"\" =\"\u5728\u8fd9\u91cc\u63d2\u5165\u56fe\u7247\u63cf\u8ff0\" alt=\"web\u524d\u7aef\u57fa\u7840\u77e5\u8bc6\u8bd5\u9898\u53ca\u7b54\u6848_web\u524d\u7aef\u5f00\u53d1\u9700\u8981\u638c\u63e1\u4ec0\u4e48 (https:\/\/mushiming.com\/)  \u7b2c4\u5f20\" title=\"web\u524d\u7aef\u57fa\u7840\u77e5\u8bc6\u8bd5\u9898\u53ca\u7b54\u6848_web\u524d\u7aef\u5f00\u53d1\u9700\u8981\u638c\u63e1\u4ec0\u4e48  \u7b2c4\u5f20-\u7a46\u4e16\u660e\u535a\u5ba2\" ><\/p>\n<\/blockquote>\n<p><mark>\u6ce8\u610f\uff1a<\/mark><\/p>\n<blockquote>\n<ul>\n<li>\u6709\u76f8\u540cname\u5c5e\u6027\u503c\u7684\u5355\u9009\u6846\u4e3a\u4e00\u7ec4\uff0c\u4e00\u7ec4\u4e2d\u53ea\u80fd\u540c\u65f6\u6709\u4e00\u4e2a\u88ab\u9009<\/li>\n<li>\u5c5e\u6027\u5bf9\u4e8e\u5355\u9009\u6846\u6709\u5206\u7ec4\u529f\u80fd<\/li>\n<\/ul>\n<\/blockquote>\n<p><mark>\u5360\u4f4d\u7b26\uff1a<\/mark><code>placeholder<\/code><\/p>\n<h5>button\u6309\u94ae\u6807\u7b7e<\/h5>\n<blockquote>\n<ul>\n<li>\u5982\u679c\u4e0d\u6307\u5b9atype\u503c\uff0cbutton\u6309\u94ae\u9ed8\u8ba4\u4e3a<strong>submit<\/strong>\u503c<\/li>\n<li>\u6309\u94ae\u8981\u653e\u5728==\u8868\u5355\u57df(form)==\u4e2d\u624d\u4f1a\u6709\u884c\u4e3a\uff0c\u5426\u5219\u5c31\u662f\u4e00\u4e2a<strong>\u666e\u901a\u6309\u94ae<\/strong><\/li>\n<\/ul>\n<\/blockquote>\n<p>\u6309\u94ae\u6807\u7b7e\u662f<strong>\u53cc\u6807\u7b7e<\/strong>\uff0c\u53ef\u4ee5\u63d2\u5165\u5176\u4ed6\u6807\u7b7e\u5982\uff1a\u56fe\u7247<\/p>\n<h5>select\u4e0b\u62c9\u83dc\u5355<\/h5>\n<blockquote>\n<ul>\n<li>select\u6807\u7b7e\uff1a\u4e0b\u62c9\u83dc\u5355\u7684\u6574\u4f53<\/li>\n<li>option\u6807\u7b7e\uff1a\u4e0b\u62c9\u83dc\u5355\u7684\u6bcf\u4e00\u9879<\/li>\n<\/ul>\n<\/blockquote>\n<p><mark>selected\u5c5e\u6027<\/mark>\uff1a\u4e0b\u6765\u83dc\u5355\u7684<strong>\u9ed8\u8ba4\u9009\u4e2d<\/strong><\/p>\n<h5>lable\u6807\u7b7e<\/h5>\n<blockquote>\n<p>\u5f3a\u8c03\u6587\u672c\u7684\u4f5c\u7528<\/p>\n<\/blockquote>\n<h5>\u6ca1\u6709\u8bed\u4e49\u5316\u7684\u6807\u7b7e<\/h5>\n<blockquote>\n<ul>\n<li><code>div<\/code>\uff1a\u72ec\u5360\u4e00\u884c<\/li>\n<li><code>span<\/code>\uff1a<\/li>\n<\/ul>\n<\/blockquote>\n<h5>\u8bed\u4e49\u5316\u6807\u7b7e<\/h5>\n<blockquote>\n<p>\u200b <\/p>\n<header>\n   \u7f51\u9875\u5934\u90e8<br \/>\n <\/header>\n<\/p>\n<p>\u200b <\/p>\n<nav>\n   \u7f51\u9875\u5bfc\u822a<br \/>\n <\/nav>\n<\/p>\n<p>\u200b <\/p>\n<footer>\n   \u7f51\u9875\u5e95\u90e8<br \/>\n <\/footer>\n<\/p>\n<p>\u200b <\/p>\n<aside>\n   \u7f51\u9875\u4fa7\u8fb9\u680f<br \/>\n <\/aside>\n<\/p>\n<p>\u200b <\/p>\n<section>\n   \u7f51\u9875\u533a\u5757<br \/>\n <\/section>\n<\/p>\n<p>\u200b <\/p>\n<article>\n   \u7f51\u9875\u6587\u7ae0<br \/>\n <\/article>\n<\/p>\n<\/blockquote>\n<h2>CSS\uff1a\u5c42\u53e0\u6837\u5f0f\u8868<\/h2>\n<ul>\n<li>\n<h3>css\u7684\u5f15\u5165\u65b9\u5f0f<\/h3>\n<\/li>\n<\/ul>\n<blockquote>\n<ol>\n<li>\n<p>==\u5185\u5d4c\u5f0f\uff1a==\u5199\u5728style\u6807\u7b7e\u4e2d,\u4e00\u822c\u5199\u5728head\u91cc<\/p>\n<pre class=\"language-java prettyprint linenums\"><code>&lt;style&gt; li { color: brown; width: 200px; height: 200px; list-style: none; } .wuyu { width: 100px; height: 100px; background-color: bisque; } &lt;\/style&gt; <\/code><\/pre>\n<\/li>\n<li>\n<p>==\u5916\u8054\u5f0f\uff1a==\u5199\u5728\u4e00\u4e2a\u5355\u72ec\u7684.css\u6587\u4ef6\u4e2d<\/p>\n<pre class=\"language-java prettyprint linenums\"><code>&lt;style&gt; &lt;link rel=\"stylesheet\" href=\".\/style\/test.css\"&gt; &lt;\/style&gt; <\/code><\/pre>\n<\/li>\n<li>\n<p>==\u884c\u5185\u5f0f\uff1a==\u5199\u5728\u6807\u7b7e\u7684style\u5c5e\u6027\u4e2d\uff0c\u5927\u591a\u6570\u914d\u5408js\u4f7f\u7528<\/p>\n<\/li>\n<\/ol>\n<\/blockquote>\n<h3>\u57fa\u7840\u9009\u62e9\u5668<\/h3>\n<h4>\u6807\u7b7e\u9009\u62e9\u5668<\/h4>\n<h4>\u7c7b\u9009\u62e9\u5668<\/h4>\n<h4>id\u9009\u62e9\u5668<\/h4>\n<blockquote>\n<p>id\u5fc5\u987b\u662f<strong>\u552f\u4e00<\/strong>\u7684\uff0c\u4e0d\u80fd\u51fa\u73b0\u4e24\u4e2a\u6807\u7b7e\u6709\u76f8\u540c\u7684id<\/p>\n<pre class=\"language-java prettyprint linenums\"><code>&lt;div id=\"w\"&gt;\u4f60\u597d\uff0chello&lt;\/div&gt; <\/code><\/pre>\n<\/blockquote>\n<ul>\n<li>\n<h3>\u901a\u914d\u7b26\u9009\u62e9\u5668<\/h3>\n<ul>\n<li>\n<h4><mark>\u6e05\u9664\u5185\u5916\u8fb9\u8ddd,\u83b7\u53d6\u6240\u6709\u6807\u7b7e<\/mark><\/h4>\n<\/li>\n<\/ul>\n<blockquote>\n<pre class=\"language-java prettyprint linenums\"><code> * { margin: 0; padding: 0; } <\/code><\/pre>\n<\/blockquote>\n<\/li>\n<\/ul>\n<h3>\u5b57\u4f53\u548c\u6587\u672c\u6837\u5f0f<\/h3>\n<h3><mark>\u5b57\u4f53\uff1a<\/mark><\/h3>\n<h4>\u5b57\u4f53\u5927\u5c0f<\/h4>\n<blockquote>\n<pre class=\"language-java prettyprint linenums\"><code>font-size: 14px; <\/code><\/pre>\n<\/blockquote>\n<h4>\u5b57\u4f53\u7c97\u7ec6<\/h4>\n<blockquote>\n<pre class=\"language-java prettyprint linenums\"><code>font=weight <\/code><\/pre>\n<\/blockquote>\n<h4>\u5b57\u4f53\u6837\u5f0f<\/h4>\n<blockquote>\n<pre class=\"language-java prettyprint linenums\"><code>font-style <\/code><\/pre>\n<\/blockquote>\n<h4>\u5b57\u4f53\u7c7b\u578b<\/h4>\n<blockquote>\n<pre class=\"language-java prettyprint linenums\"><code>font-family <\/code><\/pre>\n<\/blockquote>\n<h4>\u5c42\u53e0\u6027<\/h4>\n<blockquote>\n<p>\u5efa\u7acb\u5728\u76f8\u540c\u7684\u6743\u91cd\u4e0b\uff0c\u5982\u76f8\u540c\u7684\u9009\u62e9\u5668\uff0c\u540e\u9762\u7684\u4f1a\u8986\u76d6\u524d\u9762\u7684<\/p>\n<\/blockquote>\n<h4>\u590d\u5408\u5c5e\u6027<\/h4>\n<blockquote>\n<pre class=\"language-java prettyprint linenums\"><code>font\u590d\u5408\u4e66\u5199\u987a\u5e8f\uff1afont\uff1astyle weight size family <\/code><\/pre>\n<p><mark>\u6ce8\u610f\uff1a<\/mark><\/p>\n<ul>\n<li>\u987a\u5e8f\u4e0d\u80fd\u4e71<\/li>\n<li>\u5982\u679c\u4e4b\u524d\u5df2\u7ecf\u5199\u4e86\u96f6\u6563\u7684font\u5c5e\u6027\uff0c\u5f53\u5fc3\u53ef\u80fd\u4f1a\u8986\u76d6\u6389\u4e4b\u524d\u7684<\/li>\n<\/ul>\n<\/blockquote>\n<h4>\u6c34\u5e73\u5c45\u4e2d\u5bf9\u9f50 text-aling:center<\/h4>\n<blockquote>\n<p>\u5982\u679c\u9700\u8981\u8ba9\u6587\u672c\u6c34\u5e73\u5c45\u4e2d\uff0ctext-align\u5c5e\u6027\u7ed9\u6587\u672c\u6240\u5728\u6807\u7b7e\uff08\u6587\u672c\u7684<strong>\u7236\u5143\u7d20<\/strong>\uff09\u8bbe\u7f6e<\/p>\n<\/blockquote>\n<h4>\u6587\u672c\u4fee\u9970<\/h4>\n<ul>\n<li>\n<p><mark>\u6dfb\u52a0\u4e0b\u5212\u7ebf<\/mark><\/p>\n<ul>\n<li>\n<pre class=\"language-java prettyprint linenums\"><code>text-decoration: underline; <\/code><\/pre>\n<\/li>\n<\/ul>\n<\/li>\n<li>\n<p><mark>\u5220\u9664\u7ebf<\/mark><\/p>\n<ul>\n<li>\n<pre class=\"language-java prettyprint linenums\"><code>text-decoration: line-through; <\/code><\/pre>\n<\/li>\n<\/ul>\n<\/li>\n<li>\n<p><mark>\u4e0a\u5212\u7ebf<\/mark><\/p>\n<ul>\n<li>\n<pre class=\"language-java prettyprint linenums\"><code>text-decoration: overline; <\/code><\/pre>\n<\/li>\n<\/ul>\n<\/li>\n<li>\n<p><mark>\u6e05\u9664\u4e0b\u5212\u7ebf<\/mark><\/p>\n<ul>\n<li>\n<pre class=\"language-java prettyprint linenums\"><code>text-decoration: none; <\/code><\/pre>\n<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<h4>\u884c\u9ad8line-height<\/h4>\n<blockquote>\n<p>\u63a7\u5236\u4e00\u884c\u7684\u4e0a\u4e0b\u884c\u95f4\u8ddd<\/p>\n<\/blockquote>\n<ul>\n<li>\u8ba9\u5355\u884c\u6587\u672c\u5782\u76f4\u5c45\u4e2d\u53ef\u4ee5\u8bbe\u7f6e line-height : <strong>\u6587\u5b57\u7236\u5143\u7d20\u9ad8\u5ea6<\/strong><\/li>\n<li><mark>\u6ce8\u610f<\/mark>\u5982\u679c\u540c\u65f6\u8bbe\u7f6e\u4e86\u884c\u9ad8\u548cfont\u590d\u5408\uff0c\u6ce8\u610f\u8986\u76d6\u95ee\u9898<\/li>\n<li>\u4e66\u5199\u987a\u5e8f\uff1a<code>font\uff1astyle weight size\/line-height family<\/code><\/li>\n<\/ul>\n<h4>\u989c\u8272\u53d6\u503c<\/h4>\n<ul>\n<li>rgba\u8868\u793a\u6cd5\uff1a( 0 , 0 , 0 , 0.5 ) \u53ef\u4ee5\u7701\u7565\u5199\u6210 rgba ( 0 , 0 , 0 , .5 )\n<ul>\n<li>\u53d6\u503c\u8303\u56f40~1 \uff0c1\u8868\u793a\u5b8c\u5168\u4e0d\u900f\u660e<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<h3>\u9009\u62e9\u5668\u8fdb\u9636<\/h3>\n<h4>\u590d\u5408\u9009\u62e9\u5668<\/h4>\n<h5>\u540e\u4ee3\u9009\u62e9\u5668<\/h5>\n<ul>\n<li>\n<p>\u6839\u636eHTML\u6807\u7b7e\u7684\u5d4c\u5957\u5173\u7cfb\uff0c\u9009\u62e9\u7236\u5143\u7d20\u540e\u4ee3\u4e2d\u6ee1\u8db3\u6761\u4ef6\u7684\u5143\u7d20<\/p>\n<\/li>\n<li>\n<p>\u8bed\u6cd5\uff1a\u9009\u62e9\u56681 \u9009\u62e9\u56682 {} <strong>\u7a7a\u683c\u9694\u5f00<\/strong><\/p>\n<\/li>\n<li>\n<p>\u6ce8\u610f\uff1a\u540e\u4ee3\u5305\u62ec\uff1a\u513f\u5b50\u3001\u5b59\u5b50\u2026<\/p>\n<\/li>\n<\/ul>\n<h5>\u5e76\u96c6\u9009\u62e9\u5668<\/h5>\n<ul>\n<li>\u4f5c\u7528\uff1a\u9009\u4e2d\u9875\u9762\u4e2d \u540c\u65f6\u6ee1\u8db3 \u591a\u4e2a\u9009\u62e9\u5668\u7684\u6807\u7b7e<\/li>\n<li>\u8bed\u6cd5\uff1a\u9009\u62e9\u56681\u9009\u62e9\u56682 { css }<\/li>\n<li>\u6ce8\u610f\uff1a\u4ea4\u96c6\u9009\u62e9\u5668\u4e2d\u7684\u9009\u62e9\u5668\u4e4b\u95f4\u662f\u7d27\u6328\u7740\u7684\uff0c\u6ca1\u6709\u4e1c\u897f\u5206\u9694 \uff0c\u4ea4\u96c6\u9009\u62e9\u5668\u4e2d\u5982\u679c\u6709\u6807\u7b7e\u9009\u62e9\u5668\uff0c\u6807\u7b7e\u9009\u62e9\u5668\u5fc5\u987b\u5199\u5728\u6700\u524d\u9762<\/li>\n<\/ul>\n<h5>\u4ea4\u96c6\u9009\u62e9\u5668<\/h5>\n<blockquote>\n<ul>\n<li>\u4ea4\u96c6\u9009\u62e9\u5668\uff1a\u6807\u7b7e\u9009\u62e9\u5668\u5728\u524d\uff0c\u7c7b\u9009\u62e9\u5668\u5728\u540e\uff0c\u4e2d\u95f4\u6ca1\u6709\u7a7a\u683c<\/li>\n<li>id\u662f\u552f\u4e00\u7684\uff0c\u4e0d\u80fd\u505a\u4ea4\u96c6<\/li>\n<li>\u4ea4\u96c6\u9009\u62e9\u5668\u53ea\u53ef\u80fd\u662f \u6807\u7b7e\u9009\u62e9\u5668 + \u7c7b\u9009\u62e9\u5668<\/li>\n<\/ul>\n<\/blockquote>\n<h5>hover\u4f2a\u7c7b\u9009\u62e9\u5668<\/h5>\n<blockquote>\n<ul>\n<li>\u9f20\u6807\u60ac\u505c\u5728\u5143\u7d20\u4e0a\u7684\u72b6\u6001<\/li>\n<li>\u53ef\u4ee5\u7528\u5728<strong>\u4efb\u4f55<\/strong>\u6807\u7b7e\u4e0a<\/li>\n<\/ul>\n<\/blockquote>\n<h3>\u80cc\u666f\u76f8\u5173\u5c5e\u6027<\/h3>\n<ul>\n<li>\n<h5>\u80cc\u666f\u590d\u5408<\/h5>\n<ul>\n<li>\n<h5><mark>\u590d\u5408\u5199\u6cd5<\/mark>\uff1a<code>\u63a8\u8350\uff1abackground\uff1acolor image repeat position<\/code><\/h5>\n<\/li>\n<\/ul>\n<\/li>\n<li>\n<p>\u80cc\u666f\u4f4d\u7f6e\u5982\u679c\u662f\u82f1\u6587\u72b6\u6001\u4e0b<strong>\u53ef\u4ee5\u98a0\u5012\u4f4d\u7f6e<\/strong><\/p>\n<\/li>\n<\/ul>\n<h3>\u5143\u7d20\u663e\u793a\u6a21\u5f0f\u4e4b\u5757\u7ea7\u5143\u7d20<\/h3>\n<blockquote>\n<ul>\n<li>\u72ec\u5360\u4e00\u884c\uff0c\u53ef\u4ee5\u8bbe\u7f6e\u5bbd\u9ad8<\/li>\n<li>\u5bbd\u5ea6\u9ed8\u8ba4\u662f\u7236\u5143\u7d20\u7684\u5bbd\u5ea6\uff0c\u9ad8\u5ea6\u9ed8\u8ba4\u7531\u5185\u5bb9\u6491\u5f00<\/li>\n<\/ul>\n<\/blockquote>\n<h3>\u5143\u7d20\u663e\u793a\u6a21\u5f0f\u4e4b\u884c\u5185\u5143\u7d20<\/h3>\n<blockquote>\n<p>\u4e0d\u53ef\u4ee5\u8bbe\u7f6e\u5bbd\u9ad8\uff0c\u4e00\u884c\u591a\u4e2a\u663e\u793a<\/p>\n<\/blockquote>\n<h3>\u5143\u7d20\u663e\u793a\u6a21\u5f0f\u4e4b\u884c\u5185\u5757\u5143\u7d20<\/h3>\n<blockquote>\n<ul>\n<li>\u4e00\u884c\u53ef\u4ee5\u663e\u793a\u591a\u4e2a<\/li>\n<li>\u53ef\u4ee5\u8bbe\u7f6e\u5bbd\u9ad8<\/li>\n<li>\u4ee3\u8868\u6807\u7b7e\uff1ainput\u3001textarea\u3001button\u3001select\u2026<\/li>\n<li>img\u6807\u7b7e\u6709\u884c\u5185\u5757\u5143\u7d20\u7279\u70b9<\/li>\n<\/ul>\n<\/blockquote>\n<h3>\u5143\u7d20\u663e\u793a\u6a21\u5f0f\u8f6c\u6362<\/h3>\n<blockquote>\n<ul>\n<li>\u8f6c\u6362\u6210\u5757\u7ea7\u5143\u7d20<code>display:block<\/code><\/li>\n<li>\u8f6c\u6362\u6210\u884c\u5185\u5757\u5143\u7d20<code>display:inline-block<\/code><\/li>\n<li>\u8f6c\u6362\u6210\u884c\u5185\u5143\u7d20<code>display:inline<\/code><\/li>\n<\/ul>\n<\/blockquote>\n<h3>html\u5d4c\u5957\u89c4\u8303<\/h3>\n<ol>\n<li>p\u6807\u7b7e\u4e2d\u4e0d\u8981\u5d4c\u5957div\u3001p\u3001h\u7b49\u5757\u7ea7\u5143\u7d20<\/li>\n<li>a\u6807\u7b7e\u4e0d\u80fd\u5d4c\u5957a\u6807\u7b7e<\/li>\n<\/ol>\n<h3>css\u7279\u6027<\/h3>\n<ul>\n<li>\u7ee7\u627f\u6027<\/li>\n<\/ul>\n<blockquote>\n<ul>\n<li>\u5b50\u5143\u7d20\u6709\u9ed8\u8ba4\u7ee7\u627f\u7236\u5143\u7d20\u7684\u7279\u70b9<\/li>\n<li>**<mark>\u63a7\u5236\u6587\u5b57\u7684\u5c5e\u6027<\/mark>**\u90fd\u53ef\u4ee5\u7ee7\u627f<\/li>\n<\/ul>\n<p><img decoding=\"async\" src=\"https:\/\/img-blog.csdnimg.cn\/cba3a48714954b71acfdbd089ec882dc.png#pic_center\" =\"\" =\"\u5728\u8fd9\u91cc\u63d2\u5165\u56fe\u7247\u63cf\u8ff0\" alt=\"web\u524d\u7aef\u57fa\u7840\u77e5\u8bc6\u8bd5\u9898\u53ca\u7b54\u6848_web\u524d\u7aef\u5f00\u53d1\u9700\u8981\u638c\u63e1\u4ec0\u4e48 (https:\/\/mushiming.com\/)  \u7b2c5\u5f20\" title=\"web\u524d\u7aef\u57fa\u7840\u77e5\u8bc6\u8bd5\u9898\u53ca\u7b54\u6848_web\u524d\u7aef\u5f00\u53d1\u9700\u8981\u638c\u63e1\u4ec0\u4e48  \u7b2c5\u5f20-\u7a46\u4e16\u660e\u535a\u5ba2\" ><\/p>\n<\/blockquote>\n<blockquote>\n<ul>\n<li>\u539f\u5219\uff1a\u672c\u8eab\u6709\u5c31\u4e0d\u4f1a\u7ee7\u627f\uff0c\u6ca1\u6709\u5c31\u7ee7\u627f\u7236\u7ea7<\/li>\n<\/ul>\n<\/blockquote>\n<ul>\n<li>\n<p>\u5c42\u53e0\u6027<\/p>\n<blockquote>\n<ul>\n<li>\u5728\u4f18\u5148\u7ea7\u76f8\u540c\u7684\u6761\u4ef6\u4e0b\uff0c\u540e\u9762\u7684\u8986\u76d6\u524d\u9762\u7684<\/li>\n<li>\u82e5\u4f18\u5148\u7ea7\u4e0d\u540c\u8c01\u7684\u4f18\u5148\u7ea7\u9ad8\uff0c\u8c01\u5c31\u8986\u76d6<\/li>\n<\/ul>\n<\/blockquote>\n<\/li>\n<\/ul>\n<h3>\u80cc\u666f\u7684\u590d\u5408\u5199\u6cd5<\/h3>\n<blockquote>\n<ul>\n<li><code>\u80cc\u666f\u590d\u5408\u5199\u6cd5\u5efa\u8bae\uff1a color URL\uff08\uff09 \u5e73\u94fa \u4f4d\u7f6e<\/code>-<\/li>\n<\/ul>\n<pre class=\"language-java prettyprint linenums\"><code> background: skyblue url(.\/images\/1.jpg) no-repeat bottom right; <\/code><\/pre>\n<ul>\n<li><mark>\u6ce8\u610f<\/mark>\uff1a\u4f7f\u7528\u82f1\u6587\u65b9\u4f4d\u8bcd\u4e0d\u8003\u8651\u987a\u5e8f \u6570\u5b57\u4e0b\u7b2c\u4e00\u4e2a\u5fc5\u987b\u662fx\uff0c\u7b2c\u4e8c\u4e2a\u5fc5\u987b\u662fy<\/li>\n<\/ul>\n<\/blockquote>\n<h2>\u76d2\u5b50\u6a21\u578b<\/h2>\n<h3>padding\u5185\u8fb9\u8ddd<\/h3>\n<blockquote>\n<pre class=\"language-java prettyprint linenums\"><code> \/* \u56db\u4e2a\u503c\uff1a\u4e0a\u53f3\u4e0b\u5de6 \u987a\u65f6\u9488*\/ \/* padding: 10px 20px 40px 80px; *\/ \/* \u4e09\u4e2a\u503c\uff1a\u4e0a \u5de6\u53f3 \u4e0b *\/ \/* padding: 10px 20px 15px; *\/ \/* \u4e24\u4e2a\u503c\uff1a\u4e0a\u4e0b \u5de6\u53f3 *\/ \/* padding: 10px 20px; *\/ \/* \u4e00\u4e2a\u503c\uff1a\u4e0a\u4e0b\u5de6\u53f3 *\/ padding: 60px; <\/code><\/pre>\n<\/blockquote>\n<h3>css3\u76d2\u5b50\u6a21\u578b<\/h3>\n<blockquote>\n<p><mark>\u81ea\u52a8\u5185\u51cf\uff1a<\/mark><code>box-sizing:border-box<\/code><\/p>\n<\/blockquote>\n<h3>margin\u5916\u8fb9\u8ddd<\/h3>\n<h4>\u5408\u5e76\u73b0\u8c61<\/h4>\n<blockquote>\n<p>\u5782\u76f4\u5e03\u5c40\u7684\u5757\u7ea7\u5143\u7d20\uff0c\u4e0a\u4e0bmargin\u4f1a\u5408\u5e76<\/p>\n<ul>\n<li>\u6700\u7ec8\u8ddd\u79bb\u4e3a\u4e24\u8005margin\u6700\u5927\u503c<\/li>\n<li><strong>\u89e3\u51b3\u529e\u6cd5<\/strong>\uff1a\u53ea\u7ed9\u4e00\u4e2a\u76d2\u5b50\u8bbe\u7f6emargin\u5373\u53ef<\/li>\n<\/ul>\n<\/blockquote>\n<blockquote>\n<p><strong>\u884c\u5185\u5143\u7d20\u8bbe\u7f6e\u4e0a\u4e0b\u5916\u8fb9\u8ddd\u65e0\u6548 \u4e0a\u4e0b\u5185\u8fb9\u8ddd\u4e5f\u65e0\u6548<\/strong><\/p>\n<\/blockquote>\n<h3>margin\u7684\u584c\u9677\u95ee\u9898\uff08\u91cd\u8981\uff09<\/h3>\n<blockquote>\n<p>\u73b0\u8c61\uff1a<mark>\u4e92\u76f8\u5d4c\u5957<\/mark>\u7684\u5757\u7ea7\u5143\u7d20\uff0c\u5b50\u5143\u7d20\u7684margin-top \u4f1a\u4f5c\u7528\u5728\u7236\u5143\u7d20\u4e0a<\/p>\n<p>\u7ed3\u679c\uff1a\u5bfc\u81f4\u7236\u5143\u7d20\u4e00\u8d77\u79fb\u52a8<\/p>\n<\/blockquote>\n<blockquote>\n<p><mark>\u89e3\u51b3\u65b9\u6cd5\uff1a<\/mark><\/p>\n<blockquote>\n<p>\u89e6\u53d1<mark>BFC<\/mark>\uff08<strong>\u5757\u7ea7\u76d2\u5b50\u683c\u5f0f\u5316\u4e0a\u4e0b\u6587<\/strong>\uff09<\/p>\n<p>BFC\u53ef\u4ee5\u89e3\u51b3\u6d6e\u52a8\u548c\u584c\u9677\u95ee\u9898<\/p>\n<\/blockquote>\n<ol>\n<li>\u7ed9\u7236\u5143\u7d20\u8bbe\u7f6eborder-top \u6216\u8005 padding-top\uff08\u5206\u9694\u7236\u5b50\u5143\u7d20\u7684margin-top\uff09<\/li>\n<li>\u7ed9<strong>\u7236\u5143\u7d20<\/strong>\u8bbe\u7f6e<code>overflow\uff1ahidden<\/code>\uff08\u8d85\u51fa\u90e8\u5206\u9690\u85cf\uff09<\/li>\n<li>\u8f6c\u6362\u6210\u884c\u5185\u5757\u5143\u7d20<\/li>\n<li>\u8bbe\u7f6e<strong>\u6d6e\u52a8<\/strong><\/li>\n<\/ol>\n<\/blockquote>\n<ul>\n<li><mark>\u89e3\u51b3\u584c\u9677<strong>\u6700\u4f73\u529e\u6cd5<\/strong>\u7ed9\u7236\u7ea7\u6dfb\u52a0overflow\uff1ahidden<\/mark><\/li>\n<\/ul>\n<h4>\u884c\u5185\u5143\u7d20\u7684margin\u548cpadding\u65e0\u6548\u60c5\u51b5<\/h4>\n<blockquote>\n<ol>\n<li><mark>\u6c34\u5e73\u65b9\u5411<\/mark>\u7684margin\u548cpadding\u5e03\u5c40\u4e2d\u6709\u6548\uff01<\/li>\n<li>\u5782\u76f4\u65b9\u5411\u7684margin\u548cpadding\u5e03\u5c40\u4e2d\u65e0\u6548\uff01<\/li>\n<\/ol>\n<\/blockquote>\n<h2>\u7ed3\u6784\u4f2a\u7c7b\u9009\u62e9\u5668<\/h2>\n<blockquote>\n<ul>\n<li>\u8fd9\u4e2a\u9009\u62e9\u5668\u662f\u4e2a\u903b\u8f91\u5e76\u4e14\u7684\u5173\u7cfb<\/li>\n<li>\u6bd4\u5982<code>div:nth-child(n)<\/code>\u8868\u793a\u8981\u627e\u4e00\u4e2adiv\uff0c\u8fd9\u4e2adiv\u5fc5\u987b\u662f\u67d0\u4e2a\u5143\u7d20\u7684\u4e00\u4e2a\u5b50\u5143\u7d20<\/li>\n<\/ul>\n<\/blockquote>\n<blockquote>\n<pre class=\"language-java prettyprint linenums\"><code>\/* \u9009\u62e9\u7b2c\u4e00\u4e2ali *\/ \/* li:first-child { background-color: blue; } *\/ \/* \u9009\u4e2d\u6700\u540e\u4e00\u4e2ali *\/ \/* li:last-child { background-color: blue; } *\/ \/* \u4efb\u9009\u4e00\u4e2a *\/ \/* li:nth-child(n) { background-color: skyblue; } *\/ \/* \u9009\u62e9\u5012\u6570\u7b2c3\u4e2a *\/ li:nth-last-child(3) { background-color: blue; } \/* \u9009\u62e9\u540e\u4e09\u4e2a*\/ li:nth-last-child(-n+3) <\/code><\/pre>\n<\/blockquote>\n<h3>\u7ed3\u6784\u4f2a\u7c7b\u9009\u62e9\u5668\u4e4b\u516c\u5f0f(\u91cd\u8981)<\/h3>\n<blockquote>\n<pre class=\"language-java prettyprint linenums\"><code>\/* li:nth-child(n) \u5c0f\u62ec\u53f7\u91cc\u4e0d\u4ec5\u53ef\u4ee5\u5199\u6570\u5b57\u8fd8\u53ef\u4ee5\u5199\u516c\u5f0f *\/ \/* \u9009\u62e9\u5076\u6570 even\u6216\u80052n*\/ \/* li:nth-child(even) { background-color: red; } *\/ \/* \u9009\u62e9\u5947\u6570 odd\u6216\u80052n+1 *\/ \/* li:nth-child(odd) { background-color: blue; } *\/ \/* \u9009\u62e9\u524d5\u4e2a -n+5 *\/ li:nth-child(-n+5) { background-color: pink; } <\/code><\/pre>\n<h4>\u6613\u9519\u70b9<\/h4>\n<pre class=\"language-java prettyprint linenums\"><code>\/* \u627e\u5230\u7b2c\u4e00\u4e2ali\u91cc\u9762\u7684a \u4e24\u79cd\u5199\u6cd5*\/ \/* li:nth-child(1) a { background-color: red; } *\/ \/* li:first-child a { background-color: red; } *\/ \/* \u627e\u5230\u7b2c\u4e94\u4e2ali\u91cc\u7684\u7b2c3\u4e2aa *\/ li:nth-child(5) a:nth-child(3) { background-color: blue; } \/* \u627e\u5230\u540e\u4e94\u4e2ali\u91cc\u7684a *\/ li:nth-last-child(-n+3) { } <\/code><\/pre>\n<\/blockquote>\n<h2>\u4f2a\u5143\u7d20::before&amp;::after<\/h2>\n<blockquote>\n<ul>\n<li>\u5fc5\u987b\u8bbe\u7f6e==<strong>content\u5c5e\u6027<\/strong>==\u624d\u80fd\u751f\u6548<\/li>\n<li>\u4f2a\u5143\u7d20\u9ed8\u8ba4\u662f<mark>\u884c\u5185\u5143\u7d20<\/mark><\/li>\n<\/ul>\n<\/blockquote>\n<blockquote>\n<pre class=\"language-java prettyprint linenums\"><code>&lt;!-- \u4f2a\u5143\u7d20\u7684\u4f5c\u7528\uff1a\u5728\u7f51\u9875\u4e2d\u88c5\u9970\u4e00\u4e9b\u5c0f\u56fe\u7247 \u7ed9\u7236\u7ea7\u6dfb\u52a0\u4f2a\u5143\u7d20--&gt; &lt;style&gt; .father { width: 300px; height: 300px; background-color: pink; } .father::before { \/* \u5185\u5bb9\u5fc5\u987b\u5199 *\/ content: '\u52a0\u6cb9'; } .father::after { content: '\u5965\u5229\u7ed9'; } &lt;\/style&gt; <\/code><\/pre>\n<\/blockquote>\n<p>==\u6ce8\u610f\uff1a==\u4f2a\u5143\u7d20<strong>\u9ed8\u8ba4<\/strong>\u662f\u884c\u5185\u5143\u7d20\uff0c\u5bbd\u9ad8\u4e0d\u751f\u6548<\/p>\n<blockquote>\n<pre class=\"language-java prettyprint linenums\"><code>.father::before { display: inline-block; \/* \u5185\u5bb9\u5fc5\u987b\u5199 *\/ content: '\u52a0\u6cb9'; width: 100px; height: 100px; background-color: blue; } <\/code><\/pre>\n<p>[\u5916\u94fe\u56fe\u7247\u8f6c\u5b58\u5931\u8d25,\u6e90\u7ad9\u53ef\u80fd\u6709\u9632\u76d7\u94fe\u673a\u5236,\u5efa\u8bae\u5c06\u56fe\u7247\u4fdd\u5b58\u4e0b\u6765\u76f4\u63a5\u4e0a\u4f20(img-usglb9AS-89)(C:\\Users\\Y\\Desktop\\\u535a\u5ba2\u5185\u5bb9\\pic\\\u6548\u679c1.png)]<\/p>\n<\/blockquote>\n<h2>\u6807\u51c6\u6d41\uff08\u6587\u6863\u6d41\uff09<\/h2>\n<blockquote>\n<ul>\n<li>\u6807\u51c6\u6d41\u5c31\u662f**\u6807\u7b7e\u9ed8\u8ba4\u7684\u6392\u5217\u65b9\u5f0f **\u5982\uff1adiv\u72ec\u5360\u4e00\u884c<\/li>\n<li>\u6807\u51c6\u6d41\u914d\u5408\u6d6e\u52a8\u548c\u5b9a\u4f4d\u5b8c\u6210\u7f51\u9875\u5e03\u5c40<\/li>\n<\/ul>\n<\/blockquote>\n<h2>\u51e0\u79cd\u5c45\u4e2d\u603b\u7ed3<\/h2>\n<blockquote>\n<ul>\n<li><strong>margin:0 auto<\/strong>\n<ul>\n<li>\u4f5c\u7528\u662f\u8ba9\u5177\u6709\u5bbd\u5ea6\u7684<mark>\u5757\u7ea7<\/mark>\u5143\u7d20\u5c45\u4e2d\uff0c\u884c\u5185\u5757\u4e0d\u884c<\/li>\n<\/ul>\n<\/li>\n<li><strong>text-align: center;<\/strong>\n<ul>\n<li>\u7ed9\u4e00\u4e2a\u5757\u7ea7\u5143\u7d20\u6216\u8005\u884c\u5185\u5757\u5143\u7d20\u8bbe\u7f6e\uff0c\u8ba9\u5176<mark>\u5185\u90e8\u6587\u5b57\u6216\u8005\u884c\u5185\u5757<\/mark>\u5b9e\u73b0\u6c34\u5e73\u5c45\u4e2d<\/li>\n<\/ul>\n<\/li>\n<li><strong>line-height: ;<\/strong>\n<ul>\n<li>\u5728\u5c55\u793a\u6587\u5b57\u7684\u65f6\u5019\u4f1a\u6709\u4e00\u4e2a\u9ed8\u8ba4\u7684\u884c\u9ad8\uff0c\u6587\u5b57\u5728\u884c\u4e2d\u80af\u5b9a\u662f\u9ed8\u8ba4\u5c45\u4e2d\u7684\uff0c\u5982\u679c\u884c\u9ad8\u8bbe\u7f6e\u7684\u548c\u5143\u7d20\u4e00\u6837\u9ad8\uff0c\u90a3\u4e48\u6587\u5b57\u5c31\u4f1a\u5728\u884c\u4e2d\u5782\u76f4\u5c45\u4e2d\u3002<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<\/blockquote>\n<h2>\u6d6e\u52a8<\/h2>\n<blockquote>\n<ul>\n<li>\u6d4f\u89c8\u5668\u5728\u89e3\u6790\u884c\u5185\u6216\u884c\u5185\u5757\u5143\u7d20\u7684\u65f6\u5019\uff0c\u5982\u679c\u5143\u7d20\u6362\u884c\u4e4b\u95f4\u4f1a\u6709<strong>\u5c0f\u7f1d\u9699<\/strong><\/li>\n<li>\u6d6e\u52a8\u4f5c\u7528\uff1a\n<ul>\n<li>1.\u56fe\u6587\u73af\u7ed5<\/li>\n<li>2.\u8ba9\u5757\u7ea7\u76d2\u5b50\u5728\u4e00\u884c\u663e\u793a<\/li>\n<\/ul>\n<\/li>\n<li><img decoding=\"async\" src=\"https:\/\/img-blog.csdnimg.cn\/7a1603c8e2ad4edfa90364ed1717957a.png\" =\"\" =\"\u5728\u8fd9\u91cc\u63d2\u5165\u56fe\u7247\u63cf\u8ff0\" alt=\"web\u524d\u7aef\u57fa\u7840\u77e5\u8bc6\u8bd5\u9898\u53ca\u7b54\u6848_web\u524d\u7aef\u5f00\u53d1\u9700\u8981\u638c\u63e1\u4ec0\u4e48 (https:\/\/mushiming.com\/)  \u7b2c6\u5f20\" title=\"web\u524d\u7aef\u57fa\u7840\u77e5\u8bc6\u8bd5\u9898\u53ca\u7b54\u6848_web\u524d\u7aef\u5f00\u53d1\u9700\u8981\u638c\u63e1\u4ec0\u4e48  \u7b2c6\u5f20-\u7a46\u4e16\u660e\u535a\u5ba2\" ><\/li>\n<\/ul>\n<\/blockquote>\n<blockquote>\n<ul>\n<li><mark>\u6d6e\u52a8\u7684\u7279\u70b9\uff1a<\/mark><br \/> 1.\u6d6e\u52a8\u540e\u7684\u5143\u7d20\u4f1a\u8131\u79bb\u6807\u51c6\u6d41\uff08<strong>\u8131\u6807<\/strong>\uff09\uff0c\u4e0d\u5360\u6807\u51c6\u6d41\u7684\u4f4d\u7f6e<br \/> 2.\u6d6e\u52a8\u5143\u7d20\u6bd4\u6807\u51c6\u6d41\u9ad8\u534a\u4e2a\u7ea7\u522b\uff0c\u53ef\u4ee5\u8986\u76d6\u6807\u51c6\u6d41\u4e2d\u7684\u5143\u7d20<br \/> 3.\u4e0b\u4e00\u4e2a\u6d6e\u52a8\u5143\u7d20\u4f1a\u5728\u4e0a\u4e00\u4e2a\u6d6e\u52a8\u5143\u7d20\u540e\u9762\u5de6\u53f3\u6d6e\u52a8<br \/> 4.\u6d6e\u52a8\u4e00\u884c\u663e\u793a\u591a\u4e2a\uff0c<strong>\u53ef\u4ee5\u8bbe\u7f6e\u5bbd\u9ad8<\/strong><br \/> \u6ce8\u610f\uff1a\u6d6e\u52a8\u7684\u5143\u7d20\u4e0d\u80fd\u901a\u8fc7text-align:center\u6216\u8005margin:0 auto<\/li>\n<li>\u6d6e\u52a8\u5143\u7d20\u5177\u6709\u6807\u51c6\u6d41\u5143\u7d20\u7684\u7279\u6027\uff0c\u53ef\u4ee5\u8bbe\u7f6e\u5bbd\u9ad8\uff0c\u5e76\u4e14\u5728\u4e00\u884c\u5c55\u793a\u591a\u4e2a<\/li>\n<li>\n<h3>\u6d6e\u52a8\u7684\u4e0d\u826f\u5f71\u54cd<\/h3>\n<\/li>\n<\/ul>\n<\/blockquote>\n<h2>css\u4e66\u5199\u987a\u5e8f\uff08\u91cd\u8981\uff09<\/h2>\n<blockquote>\n<p>\u4f5c\u7528\uff1a\u6d4f\u89c8\u5668\u6267\u884c\u6548\u7387\u66f4\u9ad8<\/p>\n<p><mark>\u4e66\u5199\u987a\u5e8f\uff1a<\/mark><\/p>\n<ol>\n<li>display\/\u6d6e\u52a8\/\u5b9a\u4f4d<\/li>\n<li>\u76d2\u5b50\u6a21\u578b\uff1amargin\u3001padding\u3001\u5bbd\u9ad8\u3001\u80cc\u666f\u8272<\/li>\n<li>\u6587\u5b57\u6837\u5f0f\uff1afont:<\/li>\n<\/ol>\n<\/blockquote>\n<h2>\u6e05\u9664\u6d6e\u52a8<\/h2>\n<h3>1.\u7ed9\u7236\u7ea7\u8bbe\u7f6e\u9ad8\u5ea6<\/h3>\n<h3>2.\u989d\u5916\u6807\u7b7e\u6cd5<\/h3>\n<blockquote>\n<ol>\n<li>\u5728\u7236\u5143\u7d20\u5185\u5bb9\u7684\u6700\u540e\u6dfb\u52a0\u4e00\u4e2a\u5757\u7ea7\u5143\u7d20<\/li>\n<li>\u7ed9\u6dfb\u52a0\u7684\u5757\u7ea7\u5143\u7d20\u8bbe\u7f6e clear:both<\/li>\n<li><mark>\u7f3a\u70b9<\/mark>\uff1a\u4f1a\u5728\u9875\u9762\u4e2d\u6dfb\u52a0\u989d\u5916\u7684\u6807\u7b7e\uff0c\u4f1a\u8ba9\u9875\u9762\u7684HTML\u7ed3\u6784\u53d8\u5f97\u590d\u6742<\/li>\n<\/ol>\n<\/blockquote>\n<h3>3.\u5355\u4f2a\u5143\u7d20\u6e05\u9664\u6cd5<\/h3>\n<blockquote>\n<p>\u7ed9\u7236\u7ea7\u6dfb\u52a0\u4e00\u4e2a\u7c7b<code>clearfix<\/code><\/p>\n<p><code>&lt;div class=\"box1 clearfix\"&gt;<\/code><\/p>\n<\/blockquote>\n<pre class=\"language-java prettyprint linenums\"><code>.clearfix::after { content: ''; display: block; clear: both; \/* \u8865\u5145\u4ee3\u7801\uff0c\u5728\u7f51\u9875\u4e2d\u770b\u4e0d\u5230\u4f2a\u5143\u7d20 *\/ height: 0; visibility: hidden; } <\/code><\/pre>\n<h3>4.\u53cc\u4f2a\u5143\u7d20\u6e05\u9664\u6d6e\u52a8\uff08\u5e38\u7528\uff09<\/h3>\n<blockquote>\n<p>==\u7279\u70b9\uff1a==\u4e0d\u5149\u80fd\u6e05\u9664\u6d6e\u52a8\u8fd8\u80fd\u89e3\u51b3<strong>\u584c\u9677<\/strong>\uff08\u5751\u7239\u73b0\u8c61\uff09\u95ee\u9898<\/p>\n<\/blockquote>\n<pre class=\"language-java prettyprint linenums\"><code>.clearfix:before,.clearfix:after { content:\"\"; display:table; } .clearfix:after { clear:both; } .clearfix { *zoom:1; } <\/code><\/pre>\n<h3>5.\u7ed9\u7236\u5143\u7d20\u8bbe\u7f6eoverflow : hidden<\/h3>\n<blockquote>\n<p>\u89e6\u53d1bfc<\/p>\n<\/blockquote>\n<blockquote>\n<ul>\n<li>\u76f4\u63a5\u7ed9\u7236\u5143\u7d20\u8bbe\u7f6e<code>overflow : hidden<\/code><\/li>\n<li>\u7279\u70b9\uff1a\u65b9\u4fbf<\/li>\n<\/ul>\n<\/blockquote>\n<h3>\u6ce8\u610f<\/h3>\n<blockquote>\n<p><mark>\u7248\u5fc3<\/mark> \u6ce8\u610f\uff1a\u8981\u6e05\u9664\u6d6e\u52a8\u7684\u5f71\u54cd\uff0c\u5728\u4e0a\u4e00\u7ea7\u7684\u7236\u7ea7 --&gt;<\/p>\n<p>\u200b &lt;!-- \u56e0\u4e3ali\u6d6e\u52a8\u8131\u6807 \u6491\u4e0d\u5f00\u7236\u7ea7\u7684\u9ad8\u5ea6<\/p>\n<\/blockquote>\n<h2>\u9879\u76ee\u901a\u7528css<\/h2>\n<pre class=\"language-java prettyprint linenums\"><code>\/* \u6e05\u9664\u5185\u5916\u8fb9\u8ddd *\/ * { margin: 0; padding: 0; \/* \u5185\u51cf\u6a21\u5f0f *\/ box-sizing: border-box; } a { \/* \u6e05\u9664\u4e0b\u5212\u7ebf *\/ text-decoration: none; } li { \/* \u6e05\u9664\u5c0f\u5706\u70b9 *\/ list-style: none; } \/* \u6e05\u9664\u6d6e\u52a8 *\/ .clearfix:before, .clearfix:after { content: \"\"; display: table; } .clearfix:after { clear: both; } .clearfix { \/* \u7248\u672c\u517c\u5bb9 *\/ *zoom: 1; } body { background-color: #f3f5f7; } \/* \u7248\u5fc3 *\/ .wrapper { width: 1226px; margin: 0 auto; } <\/code><\/pre>\n<h2>\u5b9a\u4f4d<\/h2>\n<h3>\u5e03\u5c40\u7f51\u9875\u7684\u4e09\u79cd\u65b9\u5f0f<\/h3>\n<blockquote>\n<ul>\n<li><strong>\u6807\u51c6\u6d41<\/strong>\n<ul>\n<li>\u5757\u7ea7\u5143\u7d20\u72ec\u5360\u4e00\u884c \u2192 \u5782\u76f4\u5e03\u5c40<\/li>\n<li>\u884c\u5185\u5143\u7d20\/\u884c\u5185\u5757\u5143\u7d20\u4e00\u884c\u663e\u793a\u591a\u4e2a \u2192 \u6c34\u5e73\u5e03\u5c40<\/li>\n<\/ul>\n<\/li>\n<li><strong>\u6d6e\u52a8<\/strong>\n<ul>\n<li>\u53ef\u4ee5\u8ba9\u539f\u672c\u5782\u76f4\u5e03\u5c40\u7684 \u5757\u7ea7\u5143\u7d20\u53d8\u6210\u6c34\u5e73\u5e03\u5c40<\/li>\n<\/ul>\n<\/li>\n<li><strong>\u5b9a\u4f4d<\/strong>\n<ul>\n<li>\u53ef\u4ee5\u8ba9\u5143\u7d20\u81ea\u7531\u7684\u6446\u653e\u5728\u7f51\u9875\u7684\u4efb\u610f\u4f4d\u7f6e<\/li>\n<li>\u4e00\u822c\u7528\u4e8e \u76d2\u5b50\u4e4b\u95f4\u7684\u5c42\u53e0\u60c5\u51b5<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<\/blockquote>\n<h3>\u8bbe\u7f6e\u5b9a\u4f4d\u7684\u6b65\u9aa4<\/h3>\n<ul>\n<li>\n<p>\u5c5e\u6027\u540d\uff1a<strong>position<\/strong><\/p>\n<ul>\n<li><img decoding=\"async\" src=\"https:\/\/img-blog.csdnimg.cn\/27a844daaa5d4de1bf66279c33ec6479.png\" =\"\" =\"\u5728\u8fd9\u91cc\u63d2\u5165\u56fe\u7247\u63cf\u8ff0\" alt=\"web\u524d\u7aef\u57fa\u7840\u77e5\u8bc6\u8bd5\u9898\u53ca\u7b54\u6848_web\u524d\u7aef\u5f00\u53d1\u9700\u8981\u638c\u63e1\u4ec0\u4e48 (https:\/\/mushiming.com\/)  \u7b2c7\u5f20\" title=\"web\u524d\u7aef\u57fa\u7840\u77e5\u8bc6\u8bd5\u9898\u53ca\u7b54\u6848_web\u524d\u7aef\u5f00\u53d1\u9700\u8981\u638c\u63e1\u4ec0\u4e48  \u7b2c7\u5f20-\u7a46\u4e16\u660e\u535a\u5ba2\" ><\/li>\n<\/ul>\n<\/li>\n<li>\n<h4>\u8bbe\u7f6e\u504f\u79fb\u503c<\/h4>\n<ul>\n<li>\u504f\u79fb\u503c\u8bbe\u7f6e\u5206\u4e3a\u4e24\u4e2a\u65b9\u5411\uff0c\u6c34\u5e73\u548c\u5782\u76f4\u65b9\u5411\u5404\u9009\u4e00\u4e2a\u4f7f\u7528\u5373\u53ef<\/li>\n<li>\u9009\u53d6\u7684\u539f\u5219\u4e00\u822c\u662f\u5c31\u8fd1\u539f\u5219 \uff08\u79bb\u54ea\u8fb9\u8fd1\u7528\u54ea\u4e2a\uff09<\/li>\n<li><img decoding=\"async\" src=\"https:\/\/img-blog.csdnimg.cn\/0e52bc6dbee549cb990ade38ce783fb6.png#pic_center\" =\"\" =\"\u5728\u8fd9\u91cc\u63d2\u5165\u56fe\u7247\u63cf\u8ff0\" alt=\"web\u524d\u7aef\u57fa\u7840\u77e5\u8bc6\u8bd5\u9898\u53ca\u7b54\u6848_web\u524d\u7aef\u5f00\u53d1\u9700\u8981\u638c\u63e1\u4ec0\u4e48 (https:\/\/mushiming.com\/)  \u7b2c8\u5f20\" title=\"web\u524d\u7aef\u57fa\u7840\u77e5\u8bc6\u8bd5\u9898\u53ca\u7b54\u6848_web\u524d\u7aef\u5f00\u53d1\u9700\u8981\u638c\u63e1\u4ec0\u4e48  \u7b2c8\u5f20-\u7a46\u4e16\u660e\u535a\u5ba2\" ><\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<h3>\u9759\u6001\u5b9a\u4f4d<\/h3>\n<blockquote>\n<p>\u9759\u6001\u5b9a\u4f4d\uff0c\u9ed8\u8ba4\u503c\u4e3a\u6807\u51c6\u6d41<\/p>\n<\/blockquote>\n<h3>\u76f8\u5bf9\u5b9a\u4f4d<\/h3>\n<blockquote>\n<p><mark>\u7279\u70b9<\/mark><\/p>\n<ul>\n<li>\u76f8\u5bf9\u4e8e\u81ea\u5df1\u539f\u6765\u4f4d\u7f6e\u8fdb\u884c\u79fb\u52a8<\/li>\n<li><mark>\u5360\u6709<\/mark>\u539f\u6765\u7684\u4f4d\u7f6e-<strong>\u6ca1\u6709\u8131\u6807<\/strong><\/li>\n<li>\u4ecd\u7136\u5177\u6709\u6807\u7b7e\u539f\u6709\u7684\u663e\u793a\u6a21\u5f0f\u7279\u70b9 \u5982\uff1adiv\u76f8\u5bf9\u5b9a\u4f4d\u540e\u8fd8\u662f\u72ec\u5360\u4e00\u884c<\/li>\n<li>\u914d\u5408\u5b50\u7edd\u7236\u76f8\u4f7f\u7528<\/li>\n<\/ul>\n<\/blockquote>\n<h3>\u5b9a\u4f4d\u5c0f\u7ec6\u8282<\/h3>\n<blockquote>\n<p>\u5982\u679c\u6709\u6c34\u5e73\u6709left\u548cright\uff0c\u4ee5<code>left<\/code>\u4e3a\u51c6\uff0c\u5782\u76f4\u6709top\u548cbottom\uff0c\u4ee5<code>top<\/code>\u4e3a\u51c6<\/p>\n<\/blockquote>\n<h3>\u7edd\u5bf9\u5b9a\u4f4d<\/h3>\n<blockquote>\n<ul>\n<li>\u5148\u627e\u4ee5\u5b9a\u4f4d\u7684\u7236\u7ea7\uff0c\u5982\u679c\u6709\u8fd9\u6837\u7684\u7236\u7ea7\u5c31\u4ee5\u8fd9\u4e2a\u7236\u7ea7\u4e3a\u53c2\u7167\u7269\u8fdb\u884c\u5b9a\u4f4d<\/li>\n<li>\u6709\u7236\u7ea7\uff0c\u4f46\u7236\u7ea7\u6ca1\u6709\u5b9a\u4f4d\uff0c\u4ee5<strong>\u6d4f\u89c8\u5668\u7a97\u53e3<\/strong>\u4e3a\u53c2\u7167\u8fdb\u884c\u5b9a\u4f4d<\/li>\n<\/ul>\n<\/blockquote>\n<blockquote>\n<p><mark>\u7279\u70b9<\/mark><\/p>\n<ul>\n<li>\n<p>\u5982\u679c\u4e0d\u7ed9\u76f8\u5bf9\u5b9a\u4f4d\u8bbe\u7f6e\u4f4d\u79fb\uff0c\u90a3\u4e48\u5c31\u4e0d\u4f1a\u5f71\u54cd\u5143\u7d20\u7684\u4f4d\u79fb\uff0c\u53ea\u662f\u6539\u53d8\u4e86\u5b9a\u4f4d<\/p>\n<\/li>\n<li>\n<p><strong>\u8131\u6807<\/strong>\uff0c\u4e0d\u5360\u6709\u539f\u6765\u7684\u4f4d\u7f6e,\u4e0e\u6d6e\u52a8\u4e0d\u540c\uff0c\u6587\u5b57\u65e0\u6cd5\u73af\u7ed5\u7edd\u5bf9\u5b9a\u4f4d<\/p>\n<\/li>\n<li>\n<p>\u6539\u53d8\u6807\u7b7e\u7684\u663e\u793a\u6a21\u5f0f\u7279\u70b9\uff1a\u5177\u6709==<strong>\u884c\u5185\u5757\u7279\u70b9<\/strong>==\uff08\u5728\u4e00\u884c\u5171\u5b58\uff0c\u5bbd\u9ad8\u751f\u6548\uff09<\/p>\n<\/li>\n<li>\n<p>\u5982\u679c\u6ca1\u6709\u5bbd\u9ad8\u4e5f\u6ca1\u6709\u5185\u5bb9\uff0c\u76d2\u5b50\u7684\u5bbd\u5ea6\u5c3a\u5bf8\u5c31\u662f0<\/p>\n<\/li>\n<li>\n<p>\u5982\u679c\u5b50\u7ea7\u548c\u7236\u7ea7\u7684\u5bbd\u5ea6\u76f8\u540c \u53ef\u4ee5\u8bbe\u7f6ewidth\uff1a100%<\/p>\n<\/li>\n<\/ul>\n<\/blockquote>\n<h3>\u56fa\u5b9a\u5b9a\u4f4d<\/h3>\n<blockquote>\n<p><mark>\u7279\u70b9<\/mark><\/p>\n<ul>\n<li>\u8131\u6807\u4e0d\u5360\u4f4d\u7f6e<\/li>\n<li>\u6539\u53d8\u4f4d\u7f6e\u53c2\u8003\u6d4f\u89c8\u5668\u7a97\u53e3<\/li>\n<li>\u5177\u5907\u884c\u5185\u5757\u7279\u70b9<\/li>\n<\/ul>\n<\/blockquote>\n<h3>\u4f7f\u7528\u5b9a\u4f4d\u8ba9\u76d2\u5b50\u5c45\u4e2d<\/h3>\n<blockquote>\n<ul>\n<li>\n<p>\u7edd\u5bf9\u5b9a\u4f4d\u7684\u76d2\u5b50\u4e0d\u80fd\u4f7f\u7528\u5de6\u53f3<code>margin auto<\/code>\u5c45\u4e2d<\/p>\n<ul>\n<li>\n<pre class=\"language-java prettyprint linenums\"><code> .box { position: absolute; left: 50%; margin-left: -150px; top: 50%; margin-top: -150px; width: 300px; height: 300px; background-color: pink; } <\/code><\/pre>\n<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<\/blockquote>\n<blockquote>\n<ul>\n<li><code>left\uff1a50%<\/code>\u6574\u4e2a\u76d2\u5b50\u79fb\u52a8\u5230\u6d4f\u89c8\u5668\u7684<mark>\u4e2d\u95f4\u504f\u53f3<\/mark>\u7684\u4f4d\u7f6e\n<ul>\n<li>\u5728<code>margin-left:<\/code><strong>\u76d2\u5b50\u5bbd\u5ea6\u7684\u4e00\u534a\u53d6\u8d1f\u6570<\/strong>\u4f7f\u76d2\u5b50\u6c34\u5e73\u5c45\u4e2d<\/li>\n<\/ul>\n<\/li>\n<li>top\uff1a50%\u6574\u4e2a\u76d2\u5b50\u79fb\u52a8\u5230\u6d4f\u89c8\u5668\u7684<mark>\u4e2d\u95f4\u504f\u4e0b<\/mark>\u7684\u4f4d\u7f6e\n<ul>\n<li>\u5728<code>margin-top:<\/code>\u76d2\u5b50\u9ad8\u5ea6\u7684\u4e00\u534a\u53d6\u8d1f\u6570<\/li>\n<\/ul>\n<\/li>\n<li><code>transform: translate(-50% -50%);<\/code> \uff08\u81ea\u5df1\u5bbd\u5ea6\u9ad8\u5ea6\u7684\u4e00\u534a\uff09\u81ea\u52a8\u8ba1\u7b97\u76d2\u5b50\u5bbd\u5ea6<\/li>\n<\/ul>\n<\/blockquote>\n<h2>\u56fe\u7247\u5782\u76f4\u5c45\u4e2d\u5bf9\u9f50<\/h2>\n<blockquote>\n<p>\u8bbe\u7f6e\u56fe\u7247<strong>\u5782\u76f4\u5c45\u4e2d<\/strong> middle\u5c45\u4e2d :<code>vertical-align: middle;<\/code><\/p>\n<\/blockquote>\n<h2>\u4e0d\u540c\u5e03\u5c40\u65b9\u5f0f\u5143\u7d20\u5c42\u7ea7\u5173\u7cfb<\/h2>\n<blockquote>\n<ul>\n<li><strong>\u6807\u51c6\u6d41&lt;\u6d6e\u52a8&lt;\u5b9a\u4f4d<\/strong><\/li>\n<li>\u9ed8\u8ba4\u60c5\u51b5\u4e0b\u5b9a\u4f4d\u7684\u76d2\u5b50 \u540e\u6765\u8005\u5c45\u4e0a<\/li>\n<li>**z-index\uff1a**\u53d6\u6574\uff1b\u53d6\u503c\u8d8a\u5927\uff0c\u663e\u793a\u987a\u5e8f\u8d8a\u9760\u4e0a\uff0c\u9ed8\u8ba4\u503c\u4e3a0\uff0c\u5fc5<mark>\u987b\u914d\u5408\u5b9a\u4f4d\u624d\u80fd\u751f\u6548<\/mark>\u3002<\/li>\n<li><strong>\u6d4f\u89c8\u5668\u9ed8\u8ba4\u628a\u884c\u5185\u548c\u884c\u5185\u5757\u6807\u7b7e\u5f53\u505a<mark>\u6587\u5b57<\/mark>\u5904\u7406<\/strong>\uff0c\u9ed8\u8ba4\u57fa\u7ebf\u5bf9\u9f50<\/li>\n<\/ul>\n<\/blockquote>\n<h2>\u88c5\u9970<\/h2>\n<h3>\u57fa\u7ebf<\/h3>\n<blockquote>\n<p>\u57fa\u7ebf\uff1a\u6d4f\u89c8\u5668\u6587\u5b57\u7c7b\u578b\u5143\u7d20\u6392\u7248\u4e2d\u5b58\u5728\u7528\u4e8e\u5bf9\u9f50\u7684\u57fa\u7ebf\uff08baseline\uff09<\/p>\n<p><img decoding=\"async\" src=\"https:\/\/img-blog.csdnimg.cn\/11cd90c84bef495aa3a8332c5f67924d.png#pic_center\" =\"\" =\"\u5728\u8fd9\u91cc\u63d2\u5165\u56fe\u7247\u63cf\u8ff0\" alt=\"web\u524d\u7aef\u57fa\u7840\u77e5\u8bc6\u8bd5\u9898\u53ca\u7b54\u6848_web\u524d\u7aef\u5f00\u53d1\u9700\u8981\u638c\u63e1\u4ec0\u4e48 (https:\/\/mushiming.com\/)  \u7b2c9\u5f20\" title=\"web\u524d\u7aef\u57fa\u7840\u77e5\u8bc6\u8bd5\u9898\u53ca\u7b54\u6848_web\u524d\u7aef\u5f00\u53d1\u9700\u8981\u638c\u63e1\u4ec0\u4e48  \u7b2c9\u5f20-\u7a46\u4e16\u660e\u535a\u5ba2\" ><\/p>\n<\/blockquote>\n<blockquote>\n<ul>\n<li>\u89e3\u51b3\u884c\u5185\/\u884c\u5185\u5757\u5143\u7d20\u5782\u76f4\u5bf9\u9f50\u95ee\u9898<\/li>\n<li>\u5f53\u56fe\u7247\u548c\u6587\u5b57\u5728\u4e00\u884c\u4e2d\u663e\u793a\u65f6\uff0c\u5176\u5b9e\u5e95\u90e8\u4e0d\u662f\u5bf9\u9f50\u7684<\/li>\n<\/ul>\n<\/blockquote>\n<h3>\u5782\u76f4\u5bf9\u9f50\u65b9\u5f0f<\/h3>\n<blockquote>\n<p><mark>\u5c5e\u6027\u540d:<\/mark><code>vertical-align<\/code><\/p>\n<p><mark>\u5c5e\u6027\u503c<\/mark><\/p>\n<p><img decoding=\"async\" src=\"https:\/\/img-blog.csdnimg.cn\/74df9753034c4872a589af0293994a74.png#pic_center\" =\"\" =\"\u5728\u8fd9\u91cc\u63d2\u5165\u56fe\u7247\u63cf\u8ff0\" alt=\"web\u524d\u7aef\u57fa\u7840\u77e5\u8bc6\u8bd5\u9898\u53ca\u7b54\u6848_web\u524d\u7aef\u5f00\u53d1\u9700\u8981\u638c\u63e1\u4ec0\u4e48 (https:\/\/mushiming.com\/)  \u7b2c10\u5f20\" title=\"web\u524d\u7aef\u57fa\u7840\u77e5\u8bc6\u8bd5\u9898\u53ca\u7b54\u6848_web\u524d\u7aef\u5f00\u53d1\u9700\u8981\u638c\u63e1\u4ec0\u4e48  \u7b2c10\u5f20-\u7a46\u4e16\u660e\u535a\u5ba2\" ><\/p>\n<\/blockquote>\n<blockquote>\n<p>\u9879\u76ee\u4e2d <strong>vertical-align<\/strong> \u53ef\u4ee5\u89e3\u51b3\u7684\u95ee\u9898<\/p>\n<ol>\n<li>\u6587\u672c\u6846\u548c\u8868\u5355\u6309\u94ae\u65e0\u6cd5\u5bf9\u9f50\u95ee\u9898<\/li>\n<li>input\u548cimg\u65e0\u6cd5\u5bf9\u9f50\u95ee\u9898<\/li>\n<li>div\u4e2d\u7684\u6587\u672c\u6846\uff0c\u6587\u672c\u6846\u65e0\u6cd5\u8d34\u9876\u95ee\u9898<\/li>\n<li>div\u4e0d\u8bbe\u9ad8\u5ea6\u7531img\u6807\u7b7e\u6491\u5f00\uff0c\u6b64\u65f6img\u6807\u7b7e\u4e0b\u9762\u4f1a\u5b58\u5728\u989d\u5916\u95f4\u9699\u95ee\u9898<\/li>\n<li>\u4f7f\u7528line-height\u8ba9img\u6807\u7b7e\u5782\u76f4\u5c45\u4e2d\u95ee\u9898<\/li>\n<\/ol>\n<\/blockquote>\n<h3>input\u4e0einput\u6807\u7b7e\u5bf9\u9f50\u65b9\u5f0f<\/h3>\n<blockquote>\n<pre class=\"language-java prettyprint linenums\"><code> vertical-align: middle; box-sizing: border-box; <\/code><\/pre>\n<p><img decoding=\"async\" src=\"https:\/\/img-blog.csdnimg.cn\/5cfd73fc4d9244e4bbb1cab6a85fc035.png#pic_center\" =\"\" =\"\u5728\u8fd9\u91cc\u63d2\u5165\u56fe\u7247\u63cf\u8ff0\" alt=\"web\u524d\u7aef\u57fa\u7840\u77e5\u8bc6\u8bd5\u9898\u53ca\u7b54\u6848_web\u524d\u7aef\u5f00\u53d1\u9700\u8981\u638c\u63e1\u4ec0\u4e48 (https:\/\/mushiming.com\/)  \u7b2c11\u5f20\" title=\"web\u524d\u7aef\u57fa\u7840\u77e5\u8bc6\u8bd5\u9898\u53ca\u7b54\u6848_web\u524d\u7aef\u5f00\u53d1\u9700\u8981\u638c\u63e1\u4ec0\u4e48  \u7b2c11\u5f20-\u7a46\u4e16\u660e\u535a\u5ba2\" ><br \/> <strong>\u6ca1\u5bf9\u9f50\u524d<\/strong><\/p>\n<p><img decoding=\"async\" src=\"https:\/\/img-blog.csdnimg.cn\/8374d3cba20e42b7a694d9c74f4ba17b.png#pic_center\" =\"\" =\"\u5728\u8fd9\u91cc\u63d2\u5165\u56fe\u7247\u63cf\u8ff0\" alt=\"web\u524d\u7aef\u57fa\u7840\u77e5\u8bc6\u8bd5\u9898\u53ca\u7b54\u6848_web\u524d\u7aef\u5f00\u53d1\u9700\u8981\u638c\u63e1\u4ec0\u4e48 (https:\/\/mushiming.com\/)  \u7b2c12\u5f20\" title=\"web\u524d\u7aef\u57fa\u7840\u77e5\u8bc6\u8bd5\u9898\u53ca\u7b54\u6848_web\u524d\u7aef\u5f00\u53d1\u9700\u8981\u638c\u63e1\u4ec0\u4e48  \u7b2c12\u5f20-\u7a46\u4e16\u660e\u535a\u5ba2\" ><br \/> <strong>\u5bf9\u9f50\u540e<\/strong><\/p>\n<\/blockquote>\n<h3>\u56fe\u7247\u5728\u76d2\u5b50\u91cc\u586b\u4e0d\u6ee1\u6709\u7f1d\u9699\u95ee\u9898<\/h3>\n<blockquote>\n<p><img decoding=\"async\" src=\"https:\/\/img-blog.csdnimg.cn\/79c69213fbd145968c0faf9f77aa1725.png\" =\"\" =\"\u5728\u8fd9\u91cc\u63d2\u5165\u56fe\u7247\u63cf\u8ff0\" alt=\"web\u524d\u7aef\u57fa\u7840\u77e5\u8bc6\u8bd5\u9898\u53ca\u7b54\u6848_web\u524d\u7aef\u5f00\u53d1\u9700\u8981\u638c\u63e1\u4ec0\u4e48 (https:\/\/mushiming.com\/)  \u7b2c13\u5f20\" title=\"web\u524d\u7aef\u57fa\u7840\u77e5\u8bc6\u8bd5\u9898\u53ca\u7b54\u6848_web\u524d\u7aef\u5f00\u53d1\u9700\u8981\u638c\u63e1\u4ec0\u4e48  \u7b2c13\u5f20-\u7a46\u4e16\u660e\u535a\u5ba2\" ><br \/> <mark>\u524d<\/mark><\/p>\n<p><img decoding=\"async\" src=\"https:\/\/img-blog.csdnimg.cn\/f9c034acfc4e4843bce439e0b6904725.png\" =\"\" =\"\u5728\u8fd9\u91cc\u63d2\u5165\u56fe\u7247\u63cf\u8ff0\" alt=\"web\u524d\u7aef\u57fa\u7840\u77e5\u8bc6\u8bd5\u9898\u53ca\u7b54\u6848_web\u524d\u7aef\u5f00\u53d1\u9700\u8981\u638c\u63e1\u4ec0\u4e48 (https:\/\/mushiming.com\/)  \u7b2c14\u5f20\" title=\"web\u524d\u7aef\u57fa\u7840\u77e5\u8bc6\u8bd5\u9898\u53ca\u7b54\u6848_web\u524d\u7aef\u5f00\u53d1\u9700\u8981\u638c\u63e1\u4ec0\u4e48  \u7b2c14\u5f20-\u7a46\u4e16\u660e\u535a\u5ba2\" ><br \/> <mark>\u540e<\/mark><\/p>\n<blockquote>\n<p>\u7ed9<mark>img\u6dfb\u52a0<\/mark>\u4ee3\u7801\uff1a<\/p>\n<ul>\n<li>\n<pre class=\"language-java prettyprint linenums\"><code>img { \/* vertical-align: middle; *\/ display: block; } <\/code><\/pre>\n<\/li>\n<li>\n<pre class=\"language-java prettyprint linenums\"><code>==\u6216== img { vertical-align: middle; \/* display: block; *\/ } <\/code><\/pre>\n<\/li>\n<\/ul>\n<\/blockquote>\n<\/blockquote>\n<h3>\u5149\u6807\u7c7b\u578b<\/h3>\n<blockquote>\n<p>\u573a\u666f\uff1a\u8bbe\u7f6e\u9f20\u6807\u5149\u6807\u5728\u5143\u7d20\u4e0a\u65f6\u663e\u793a\u7684\u6837\u5f0f<\/p>\n<ul>\n<li>\u5c5e\u6027\u540d\uff1a<code>cursor<\/code><\/li>\n<li>\u5e38\u89c1\u5c5e\u6027\u503c\uff1a\n<ul>\n<li><img decoding=\"async\" src=\"https:\/\/img-blog.csdnimg.cn\/6a98e5ddfd44438ea5eb437a18fd918d.png\" =\"\" =\"\u5728\u8fd9\u91cc\u63d2\u5165\u56fe\u7247\u63cf\u8ff0\" alt=\"web\u524d\u7aef\u57fa\u7840\u77e5\u8bc6\u8bd5\u9898\u53ca\u7b54\u6848_web\u524d\u7aef\u5f00\u53d1\u9700\u8981\u638c\u63e1\u4ec0\u4e48 (https:\/\/mushiming.com\/)  \u7b2c15\u5f20\" title=\"web\u524d\u7aef\u57fa\u7840\u77e5\u8bc6\u8bd5\u9898\u53ca\u7b54\u6848_web\u524d\u7aef\u5f00\u53d1\u9700\u8981\u638c\u63e1\u4ec0\u4e48  \u7b2c15\u5f20-\u7a46\u4e16\u660e\u535a\u5ba2\" ><\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<\/blockquote>\n<h3>\u5706\u89d2\u8fb9\u6846\uff1aborder-radius<\/h3>\n<blockquote>\n<ul>\n<li>\u5e38\u89c1\u53d6\u503c\uff1a<code>border-radius<\/code><\/li>\n<li>\u8d4b\u503c\u89c4\u5219\uff1a\u4ece\u5de6\u4e0a\u89d2\u5f00\u59cb\u8d4b\u503c\uff0c\u7136\u540e\u987a\u65f6\u9488\u8d4b\u503c\uff0c\u6ca1\u6709\u8d4b\u503c\u7684\u770b\u5bf9\u89d2\uff01<\/li>\n<\/ul>\n<\/blockquote>\n<h3>overflow\u6ea2\u51fa\u90e8\u5206\u663e\u793a\u6548\u679c<\/h3>\n<blockquote>\n<ul>\n<li>\u63a7\u5236\u5185\u5bb9\u6ea2\u51fa\u90e8\u5206\u7684\u663e\u793a\u6548\u679c\uff0c\u5982\uff1a\u663e\u793a\u3001\u9690\u85cf\u3001\u6eda\u52a8\u6761\u2026\u2026<br \/> -<img decoding=\"async\" src=\"https:\/\/img-blog.csdnimg.cn\/87ec50417d054a8e88f74f680ffe9665.png#pic_center\" =\"\" =\"\u5728\u8fd9\u91cc\u63d2\u5165\u56fe\u7247\u63cf\u8ff0\" alt=\"web\u524d\u7aef\u57fa\u7840\u77e5\u8bc6\u8bd5\u9898\u53ca\u7b54\u6848_web\u524d\u7aef\u5f00\u53d1\u9700\u8981\u638c\u63e1\u4ec0\u4e48 (https:\/\/mushiming.com\/)  \u7b2c16\u5f20\" title=\"web\u524d\u7aef\u57fa\u7840\u77e5\u8bc6\u8bd5\u9898\u53ca\u7b54\u6848_web\u524d\u7aef\u5f00\u53d1\u9700\u8981\u638c\u63e1\u4ec0\u4e48  \u7b2c16\u5f20-\u7a46\u4e16\u660e\u535a\u5ba2\" ><\/li>\n<\/ul>\n<\/blockquote>\n<h3>\u5143\u7d20\u672c\u8eab\u9690\u85cf<\/h3>\n<blockquote>\n<p>\u8ba9\u67d0\u5143\u7d20\u672c\u8eab\u5728\u5c4f\u5e55\u4e2d\u4e0d\u53ef\u89c1\u3002\u5982\uff1a\u9f20\u6807:hover\u4e4b\u540e\u5143\u7d20\u9690\u85cf<\/p>\n<p>\u5e38\u89c1\u5c5e\u6027\u503c\uff1a<\/p>\n<ol>\n<li>visibility\uff1ahidden<\/li>\n<li>display\uff1anone<\/li>\n<li>\u533a\u522b\uff1a\n<ol>\n<li>visibility\uff1ahidden \u9690\u85cf\u5143\u7d20\u672c\u8eab\uff0c\u5e76\u4e14\u5728\u7f51\u9875\u4e2d \u5360\u4f4d\u7f6e<\/li>\n<li>display\uff1anone \u9690\u85cf\u5143\u7d20\u672c\u8eab\uff0c\u5e76\u4e14\u5728\u7f51\u9875\u4e2d \u4e0d\u5360\u4f4d\u7f6e \u27a2<\/li>\n<\/ol>\n<\/li>\n<li>\u6ce8\u610f\u70b9\uff1a\n<ol>\n<li>\u5f00\u53d1\u4e2d\u7ecf\u5e38\u4f1a\u901a\u8fc7 display\u5c5e\u6027\u5b8c\u6210\u5143\u7d20\u7684\u663e\u793a\u9690\u85cf\u5207\u6362<\/li>\n<li>display\uff1anone\uff1b\uff08\u9690\u85cf\uff09\u3001 display\uff1ablock\uff1b\uff08\u663e\u793a\uff09<\/li>\n<\/ol>\n<\/li>\n<\/ol>\n<\/blockquote>\n<h3>\u5143\u7d20\u6574\u4f53\u900f\u660e\u5ea6<\/h3>\n<blockquote>\n<p>\u5c5e\u6027\u540d\uff1a<strong>opacity<\/strong><\/p>\n<p>\u5c5e\u6027\u503c\uff1a0~1\u4e4b\u95f4\u7684\u6570\u5b57<\/p>\n<p>1\uff1a\u8868\u793a\u5b8c\u5168\u4e0d\u900f\u660e \u2022 0\uff1a\u8868\u793a\u5b8c\u5168\u900f\u660e<\/p>\n<p>\u6ce8\u610f\u70b9\uff1a opacity\u4f1a\u8ba9\u5143\u7d20\u6574\u4f53\u900f\u660e\uff0c\u5305\u62ec\u91cc\u9762\u7684\u5185\u5bb9\uff0c\u5982\uff1a\u6587\u5b57\u3001\u5b50\u5143\u7d20\u7b49\u2026\u2026<\/p>\n<pre class=\"language-java prettyprint linenums\"><code>.box { width: 600px; height: 600px; background-color: blue; opacity: 0.5; } <\/code><\/pre>\n<\/blockquote>\n<h3>\u8fb9\u6846\u5408\u5e76<\/h3>\n<blockquote>\n<ul>\n<li>\u8ba9\u76f8\u90bb\u8868\u683c\u8fb9\u6846\u8fdb\u884c\u5408\u5e76\uff0c\u5f97\u5230\u7ec6\u7ebf\u8fb9\u6846\u6548\u679c<\/li>\n<li>\u4ee3\u7801\uff1a<code>border-collapse\uff1acollapse\uff1b<\/code><\/li>\n<\/ul>\n<\/blockquote>\n<h2>\u7528css\u5236\u4f5c\u4e09\u89d2\u5f62\uff08\u9762\u8bd5\uff09<\/h2>\n<blockquote>\n<p><mark>\u6b65\u9aa4<\/mark><\/p>\n<ul>\n<li>\n<p>1.\u5bbd\u9ad8\u8bbe\u4e3a0<\/p>\n<\/li>\n<li>\n<p>2.\u56db\u4e2a\u8fb9\u6846\u8bbe\u7f6e\u4e0d\u540c\u989c\u8272<\/p>\n<\/li>\n<li>\n<p>3.\u60f3\u8981\u54ea\u4e2a\u65b9\u5411\u7684\u89d2\uff0c\u5c31\u628a\u5176\u4f59\u4e09\u4e2a\u65b9\u5411\u89d2\u7684\u8fb9\u6846\u989c\u8272\u8bbe\u4e3a\u900f\u660e\u8272<code>transparent<\/code><\/p>\n<\/li>\n<li>\n<pre class=\"language-java prettyprint linenums\"><code>.box { width: 0; height: 0; border-top: 50px solid blue; border-bottom: 50px solid transparent; border-left: 50px solid transparent; border-right: 50px solid transparent; } <\/code><\/pre>\n<\/li>\n<\/ul>\n<\/blockquote>\n<h2>\u7126\u70b9\u4f2a\u7c7b\u9009\u62e9\u5668<\/h2>\n<blockquote>\n<ul>\n<li>\n<p>\u7528\u4e8e\u9009\u4e2d\u5143\u7d20\u83b7\u53d6\u7126\u70b9\u65f6\u72b6\u6001\uff0c\u5e38\u7528\u4e8e\u8868\u5355\u63a7\u4ef6<\/p>\n<\/li>\n<li>\n<pre class=\"language-java prettyprint linenums\"><code>input:focus { background-color: skyblue; } <\/code><\/pre>\n<\/li>\n<li>\n<p>\u83b7\u5f97\u7126\u70b9\uff1a\u628a\u5149\u6807\u70b9\u8fdbinput \u5931\u53bb\u7126\u70b9\uff1a\u628a\u5149\u6807\u4eceinput\u91cc\u62ff\u51fa\u53bb<\/p>\n<\/li>\n<\/ul>\n<\/blockquote>\n<h2>\u94fe\u63a5\u4f2a\u7c7b\u9009\u62e9\u5668<\/h2>\n<blockquote>\n<p><img decoding=\"async\" src=\"https:\/\/img-blog.csdnimg.cn\/ffdd76b3b4b24bc6b21a4c6fc89a4b06.png\" =\"\" =\"\u5728\u8fd9\u91cc\u63d2\u5165\u56fe\u7247\u63cf\u8ff0\" alt=\"web\u524d\u7aef\u57fa\u7840\u77e5\u8bc6\u8bd5\u9898\u53ca\u7b54\u6848_web\u524d\u7aef\u5f00\u53d1\u9700\u8981\u638c\u63e1\u4ec0\u4e48 (https:\/\/mushiming.com\/)  \u7b2c17\u5f20\" title=\"web\u524d\u7aef\u57fa\u7840\u77e5\u8bc6\u8bd5\u9898\u53ca\u7b54\u6848_web\u524d\u7aef\u5f00\u53d1\u9700\u8981\u638c\u63e1\u4ec0\u4e48  \u7b2c17\u5f20-\u7a46\u4e16\u660e\u535a\u5ba2\" ><\/p>\n<\/blockquote>\n<h2>\u5c5e\u6027\u9009\u62e9\u5668<\/h2>\n<blockquote>\n<p><img decoding=\"async\" src=\"https:\/\/img-blog.csdnimg.cn\/a4f6408af66646d8aeb0fedd086d41bf.png#pic_center\" =\"\" =\"\u5728\u8fd9\u91cc\u63d2\u5165\u56fe\u7247\u63cf\u8ff0\" alt=\"web\u524d\u7aef\u57fa\u7840\u77e5\u8bc6\u8bd5\u9898\u53ca\u7b54\u6848_web\u524d\u7aef\u5f00\u53d1\u9700\u8981\u638c\u63e1\u4ec0\u4e48 (https:\/\/mushiming.com\/)  \u7b2c18\u5f20\" title=\"web\u524d\u7aef\u57fa\u7840\u77e5\u8bc6\u8bd5\u9898\u53ca\u7b54\u6848_web\u524d\u7aef\u5f00\u53d1\u9700\u8981\u638c\u63e1\u4ec0\u4e48  \u7b2c18\u5f20-\u7a46\u4e16\u660e\u535a\u5ba2\" ><\/p>\n<\/blockquote>\n<blockquote>\n<p><mark>\u4ee3\u7801\uff1a<\/mark><img decoding=\"async\" src=\"https:\/\/img-blog.csdnimg.cn\/8054582036b04552af1579caf366d30a.png\" =\"\" =\"\u5728\u8fd9\u91cc\u63d2\u5165\u56fe\u7247\u63cf\u8ff0\" alt=\"web\u524d\u7aef\u57fa\u7840\u77e5\u8bc6\u8bd5\u9898\u53ca\u7b54\u6848_web\u524d\u7aef\u5f00\u53d1\u9700\u8981\u638c\u63e1\u4ec0\u4e48 (https:\/\/mushiming.com\/)  \u7b2c19\u5f20\" title=\"web\u524d\u7aef\u57fa\u7840\u77e5\u8bc6\u8bd5\u9898\u53ca\u7b54\u6848_web\u524d\u7aef\u5f00\u53d1\u9700\u8981\u638c\u63e1\u4ec0\u4e48  \u7b2c19\u5f20-\u7a46\u4e16\u660e\u535a\u5ba2\" ><\/p>\n<\/blockquote>\n<blockquote>\n<p><mark>\u6548\u679c\uff1a<\/mark><img decoding=\"async\" src=\"https:\/\/img-blog.csdnimg.cn\/6c09185b04364c02b58a277a4b1dd44e.png#pic_center\" =\"\" =\"\u5728\u8fd9\u91cc\u63d2\u5165\u56fe\u7247\u63cf\u8ff0\" alt=\"web\u524d\u7aef\u57fa\u7840\u77e5\u8bc6\u8bd5\u9898\u53ca\u7b54\u6848_web\u524d\u7aef\u5f00\u53d1\u9700\u8981\u638c\u63e1\u4ec0\u4e48 (https:\/\/mushiming.com\/)  \u7b2c20\u5f20\" title=\"web\u524d\u7aef\u57fa\u7840\u77e5\u8bc6\u8bd5\u9898\u53ca\u7b54\u6848_web\u524d\u7aef\u5f00\u53d1\u9700\u8981\u638c\u63e1\u4ec0\u4e48  \u7b2c20\u5f20-\u7a46\u4e16\u660e\u535a\u5ba2\" ><\/p>\n<\/blockquote>\n<h2>\u62d3\u5c55<\/h2>\n<h3>\u7cbe\u7075\u56fe<\/h3>\n<blockquote>\n<ul>\n<li>\u4f18\u70b9\uff1a\u51cf\u5c11\u670d\u52a1\u5668\u53d1\u9001\u6b21\u6570\uff0c\u51cf\u8f7b\u670d\u52a1\u5668\u7684\u538b\u529b\uff0c\u63d0\u9ad8\u9875\u9762\u52a0\u8f7d\u901f\u5ea6<\/li>\n<li>\u7cbe\u7075\u56fe\u7684\u4f7f\u7528\u6b65\u9aa4\n<ol>\n<li>\u521b\u5efa\u4e00\u4e2a\u76d2\u5b50<\/li>\n<li>\u901a\u8fc7PxCook\u91cf\u53d6\u5c0f\u56fe\u7247\u5927\u5c0f\uff0c\u5c06\u5c0f\u56fe\u7247\u7684\u5bbd\u9ad8\u8bbe\u7f6e\u7ed9\u76d2\u5b50<\/li>\n<li>\u5c06\u7cbe\u7075\u56fe\u8bbe\u7f6e\u4e3a\u76d2\u5b50\u7684\u80cc\u666f\u56fe\u7247<\/li>\n<li>\u901a\u8fc7PxCook\u6d4b\u91cf\u5c0f\u56fe\u7247\u5de6\u4e0a\u89d2\u5750\u6807\uff0c\u5206\u522b\u53d6\u8d1f\u503c\u8bbe\u7f6e\u7ed9\u76d2\u5b50\u7684background-position\uff1ax y<\/li>\n<\/ol>\n<\/li>\n<li>background\u590d\u5408\u5199\u6cd5\u62d3\u5c55\uff1a<\/li>\n<\/ul>\n<p><img decoding=\"async\" src=\"https:\/\/img-blog.csdnimg.cn\/da2af1288b364046ab2418b41d9f269e.png#pic_center\" =\"\" =\"\u5728\u8fd9\u91cc\u63d2\u5165\u56fe\u7247\u63cf\u8ff0\" alt=\"web\u524d\u7aef\u57fa\u7840\u77e5\u8bc6\u8bd5\u9898\u53ca\u7b54\u6848_web\u524d\u7aef\u5f00\u53d1\u9700\u8981\u638c\u63e1\u4ec0\u4e48 (https:\/\/mushiming.com\/)  \u7b2c21\u5f20\" title=\"web\u524d\u7aef\u57fa\u7840\u77e5\u8bc6\u8bd5\u9898\u53ca\u7b54\u6848_web\u524d\u7aef\u5f00\u53d1\u9700\u8981\u638c\u63e1\u4ec0\u4e48  \u7b2c21\u5f20-\u7a46\u4e16\u660e\u535a\u5ba2\" ><\/p>\n<\/blockquote>\n<blockquote>\n<ul>\n<li>\u6ce8\u610f\u70b9\uff1a\n<ol>\n<li>background-size\u548cbackground\u8fde\u5199\u540c\u65f6\u8bbe\u7f6e\u65f6\uff0c\u9700\u8981\u6ce8\u610f\u8986\u76d6\u95ee\u9898<\/li>\n<li>\u89e3\u51b3\uff1a\u8981\u4e48\u5355\u72ec\u7684\u6837\u5f0f\u5199\u8fde\u5199\u7684\u4e0b\u9762 ,\u8981\u4e48\u5355\u72ec\u7684\u6837\u5f0f\u5199\u5728\u8fde\u5199\u7684\u91cc\u9762<\/li>\n<li>\u7cbe\u7075\u56fe\u7684\u6807\u7b7e\u90fd\u7528\u884c\u5185\u6807\u7b7e\uff1aspan\u3001b\u3001em<\/li>\n<\/ol>\n<\/li>\n<\/ul>\n<\/blockquote>\n<h3>\u76d2\u5b50\u9634\u5f71<\/h3>\n<blockquote>\n<p>\u5c5e\u6027\u540d\uff1a<code>box-shadow<\/code><\/p>\n<p><img decoding=\"async\" src=\"https:\/\/img-blog.csdnimg.cn\/4407cf384ec04cc88e2917f47747bd4c.png#pic_center\" =\"\" =\"\u5728\u8fd9\u91cc\u63d2\u5165\u56fe\u7247\u63cf\u8ff0\" alt=\"web\u524d\u7aef\u57fa\u7840\u77e5\u8bc6\u8bd5\u9898\u53ca\u7b54\u6848_web\u524d\u7aef\u5f00\u53d1\u9700\u8981\u638c\u63e1\u4ec0\u4e48 (https:\/\/mushiming.com\/)  \u7b2c22\u5f20\" title=\"web\u524d\u7aef\u57fa\u7840\u77e5\u8bc6\u8bd5\u9898\u53ca\u7b54\u6848_web\u524d\u7aef\u5f00\u53d1\u9700\u8981\u638c\u63e1\u4ec0\u4e48  \u7b2c22\u5f20-\u7a46\u4e16\u660e\u535a\u5ba2\" ><\/p>\n<\/blockquote>\n<blockquote>\n<p>\u9ed8\u8ba4\u60c5\u51b5\u4e0b\u662f\u5916\u9634\u5f71\uff08outset\uff09\u3001\u5916\u9634\u5f71\uff08insert\uff09\u76d2\u5b50\u9634\u5f71<\/p>\n<\/blockquote>\n<h3>\u8fc7\u5ea6<\/h3>\n<blockquote>\n<p>\u8ba9\u5143\u7d20\u6837\u5f0f\u6162\u6162\u53d8\u5316\uff0c<strong>\u914d\u5408hover\u4f7f\u7528<\/strong>\uff0c\u589e\u5f3a\u7f51\u9875\u4ea4\u4e92\u4f53\u9a8c<\/p>\n<p>\u5c5e\u6027\u540d\uff1atransition<\/p>\n<p>\u5e38\u89c1\u53d6\u503c\uff1a<\/p>\n<p><img decoding=\"async\" src=\"https:\/\/img-blog.csdnimg.cn\/848a8868c5464fb49a62781329202936.png#pic_center\" =\"\" =\"\u5728\u8fd9\u91cc\u63d2\u5165\u56fe\u7247\u63cf\u8ff0\" alt=\"web\u524d\u7aef\u57fa\u7840\u77e5\u8bc6\u8bd5\u9898\u53ca\u7b54\u6848_web\u524d\u7aef\u5f00\u53d1\u9700\u8981\u638c\u63e1\u4ec0\u4e48 (https:\/\/mushiming.com\/)  \u7b2c23\u5f20\" title=\"web\u524d\u7aef\u57fa\u7840\u77e5\u8bc6\u8bd5\u9898\u53ca\u7b54\u6848_web\u524d\u7aef\u5f00\u53d1\u9700\u8981\u638c\u63e1\u4ec0\u4e48  \u7b2c23\u5f20-\u7a46\u4e16\u660e\u535a\u5ba2\" ><\/p>\n<\/blockquote>\n<blockquote>\n<p>\u6ce8\u610f\u70b9\uff1a<\/p>\n<ol>\n<li>\u8fc7\u6e21\u9700\u8981\uff1a\u9ed8\u8ba4\u72b6\u6001 \u548c hover\u72b6\u6001\u6837\u5f0f\u4e0d\u540c\uff0c\u624d\u80fd\u6709\u8fc7\u6e21\u6548\u679c<\/li>\n<li>transition\u5c5e\u6027\u7ed9\u9700\u8981\u8fc7\u6e21\u7684\u5143\u7d20\u672c\u8eab\u52a0<\/li>\n<li>transition\u5c5e\u6027\u8bbe\u7f6e\u5728\u4e0d\u540c\u72b6\u6001\u4e2d\uff0c\u6548\u679c\u4e0d\u540c\u7684 \u2460 \u7ed9\u9ed8\u8ba4\u72b6\u6001\u8bbe\u7f6e\uff0c\u9f20\u6807\u79fb\u5165\u79fb\u51fa\u90fd\u6709\u8fc7\u6e21\u6548\u679c \u2461 \u7ed9hover\u72b6\u6001\u8bbe\u7f6e\uff0c\u9f20\u6807\u79fb\u5165\u6709\u8fc7\u6e21\u6548\u679c\uff0c\u79fb\u51fa\u6ca1\u6709\u8fc7\u6e21\u6548\u679c<\/li>\n<\/ol>\n<p><strong>\u6848\u4f8b\uff1a<\/strong><\/p>\n<pre class=\"language-java prettyprint linenums\"><code>.box { width: 100px; height: 100px; background-color: skyblue; transition: all 0.5s; } .box:hover { width: 600px; background-color: orange; box-shadow: 5px 10px 10px 5px #ccc; } <\/code><\/pre>\n<p><strong>\u6548\u679c\u56fe\uff1a<\/strong><\/p>\n<p><img decoding=\"async\" src=\"https:\/\/img-blog.csdnimg.cn\/2bd73e534a464653a1e29576dbdfa785.png#pic_center\" =\"\" =\"\u5728\u8fd9\u91cc\u63d2\u5165\u56fe\u7247\u63cf\u8ff0\" alt=\"web\u524d\u7aef\u57fa\u7840\u77e5\u8bc6\u8bd5\u9898\u53ca\u7b54\u6848_web\u524d\u7aef\u5f00\u53d1\u9700\u8981\u638c\u63e1\u4ec0\u4e48 (https:\/\/mushiming.com\/)  \u7b2c24\u5f20\" title=\"web\u524d\u7aef\u57fa\u7840\u77e5\u8bc6\u8bd5\u9898\u53ca\u7b54\u6848_web\u524d\u7aef\u5f00\u53d1\u9700\u8981\u638c\u63e1\u4ec0\u4e48  \u7b2c24\u5f20-\u7a46\u4e16\u660e\u535a\u5ba2\" ><br \/> <img decoding=\"async\" src=\"https:\/\/img-blog.csdnimg.cn\/426e81fed3d14869ac484391e7d71828.png#pic_center\" =\"\" =\"\u5728\u8fd9\u91cc\u63d2\u5165\u56fe\u7247\u63cf\u8ff0\" alt=\"web\u524d\u7aef\u57fa\u7840\u77e5\u8bc6\u8bd5\u9898\u53ca\u7b54\u6848_web\u524d\u7aef\u5f00\u53d1\u9700\u8981\u638c\u63e1\u4ec0\u4e48 (https:\/\/mushiming.com\/)  \u7b2c25\u5f20\" title=\"web\u524d\u7aef\u57fa\u7840\u77e5\u8bc6\u8bd5\u9898\u53ca\u7b54\u6848_web\u524d\u7aef\u5f00\u53d1\u9700\u8981\u638c\u63e1\u4ec0\u4e48  \u7b2c25\u5f20-\u7a46\u4e16\u660e\u535a\u5ba2\" ><\/p>\n<\/blockquote>\n<blockquote><\/blockquote>\n<h3>\u9aa8\u67b6\u7ed3\u6784\u6807\u7b7e<\/h3>\n<blockquote>\n<ul>\n<li><strong>DOCTYPE\u6587\u6863\u8bf4\u660e<\/strong>\n<ul>\n<li>\u6587\u6863\u7c7b\u578b\u58f0\u660e\uff0c\u544a\u8bc9\u6d4f\u89c8\u5668\u8be5\u7f51\u9875\u7684 <strong>HTML\u7248\u672c<\/strong><\/li>\n<\/ul>\n<\/li>\n<li><strong>\u7f51\u9875\u8bed\u8a00<\/strong>\n<ul>\n<li>\u5e38\u89c1\u8bed\u8a00\uff1azh-CN \u7b80\u4f53\u4e2d\u6587 \/ en \u82f1<\/li>\n<li><code>&lt;html lang=\"en\"&gt; ``&lt;html lang=\"zh-CN\"&gt;<\/code><\/li>\n<\/ul>\n<\/li>\n<li><strong>\u5b57\u7b26\u7f16\u7801<\/strong>\n<ul>\n<li><img decoding=\"async\" src=\"https:\/\/img-blog.csdnimg.cn\/394e01a8d0c145d38bf2d6d470ac8753.png#pic_center\" =\"\" =\"\u5728\u8fd9\u91cc\u63d2\u5165\u56fe\u7247\u63cf\u8ff0\" alt=\"web\u524d\u7aef\u57fa\u7840\u77e5\u8bc6\u8bd5\u9898\u53ca\u7b54\u6848_web\u524d\u7aef\u5f00\u53d1\u9700\u8981\u638c\u63e1\u4ec0\u4e48 (https:\/\/mushiming.com\/)  \u7b2c26\u5f20\" title=\"web\u524d\u7aef\u57fa\u7840\u77e5\u8bc6\u8bd5\u9898\u53ca\u7b54\u6848_web\u524d\u7aef\u5f00\u53d1\u9700\u8981\u638c\u63e1\u4ec0\u4e48  \u7b2c26\u5f20-\u7a46\u4e16\u660e\u535a\u5ba2\" ><\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<\/blockquote>\n<blockquote>\n<ul>\n<li>\u4f5c\u7528\uff1a\u4fdd\u5b58\u548c\u6253\u5f00\u7684\u5b57\u7b26\u7f16\u7801\u9700\u8981\u7edf\u4e00\u8bbe\u7f6e\uff0c\u5426\u5219\u53ef\u80fd\u4f1a\u51fa\u73b0 \u4e71\u7801<\/li>\n<\/ul>\n<\/blockquote>\n<h3>SEO\uff1a\u641c\u7d22\u5f15\u64ce\u4f18\u5316<\/h3>\n<blockquote>\n<ul>\n<li>\u4f5c\u7528\uff1a\u8ba9\u7f51\u7ad9\u5728\u641c\u7d22\u5f15\u64ce\u4e0a\u7684\u6392\u540d\u9760\u524d<\/li>\n<li>\u63d0\u5347SEO\u7684\u5e38\u89c1\u65b9\u6cd5\uff1a<\/li>\n<li>\n<ol>\n<li>\u7ade\u4ef7\u6392\u540d<\/li>\n<\/ol>\n<\/li>\n<li>\n<ol start=\"2\">\n<li>\u5c06\u7f51\u9875\u5236\u4f5c\u6210html\u540e\u7f00<\/li>\n<li>\u6807\u7b7e\u8bed\u4e49\u5316\uff08\u5728\u5408\u9002\u7684\u5730\u65b9\u4f7f\u7528\u5408\u9002\u7684\u6807\u7b7e\uff09<\/li>\n<\/ol>\n<\/li>\n<\/ul>\n<p><img decoding=\"async\" src=\"https:\/\/img-blog.csdnimg.cn\/30466dc63b1e489786cac35b7921e629.png\" =\"\" =\"\u5728\u8fd9\u91cc\u63d2\u5165\u56fe\u7247\u63cf\u8ff0\" alt=\"web\u524d\u7aef\u57fa\u7840\u77e5\u8bc6\u8bd5\u9898\u53ca\u7b54\u6848_web\u524d\u7aef\u5f00\u53d1\u9700\u8981\u638c\u63e1\u4ec0\u4e48 (https:\/\/mushiming.com\/)  \u7b2c27\u5f20\" title=\"web\u524d\u7aef\u57fa\u7840\u77e5\u8bc6\u8bd5\u9898\u53ca\u7b54\u6848_web\u524d\u7aef\u5f00\u53d1\u9700\u8981\u638c\u63e1\u4ec0\u4e48  \u7b2c27\u5f20-\u7a46\u4e16\u660e\u535a\u5ba2\" ><\/p>\n<\/blockquote>\n<h3>\u8ba9\u6587\u5b57\u6d88\u5931<\/h3>\n<p>2)]<\/p>\n<blockquote>\n<p>\u6ce8\u610f\u70b9\uff1a<\/p>\n<ol>\n<li>\u8fc7\u6e21\u9700\u8981\uff1a\u9ed8\u8ba4\u72b6\u6001 \u548c hover\u72b6\u6001\u6837\u5f0f\u4e0d\u540c\uff0c\u624d\u80fd\u6709\u8fc7\u6e21\u6548\u679c<\/li>\n<li>transition\u5c5e\u6027\u7ed9\u9700\u8981\u8fc7\u6e21\u7684\u5143\u7d20\u672c\u8eab\u52a0<\/li>\n<li>transition\u5c5e\u6027\u8bbe\u7f6e\u5728\u4e0d\u540c\u72b6\u6001\u4e2d\uff0c\u6548\u679c\u4e0d\u540c\u7684 \u2460 \u7ed9\u9ed8\u8ba4\u72b6\u6001\u8bbe\u7f6e\uff0c\u9f20\u6807\u79fb\u5165\u79fb\u51fa\u90fd\u6709\u8fc7\u6e21\u6548\u679c \u2461 \u7ed9hover\u72b6\u6001\u8bbe\u7f6e\uff0c\u9f20\u6807\u79fb\u5165\u6709\u8fc7\u6e21\u6548\u679c\uff0c\u79fb\u51fa\u6ca1\u6709\u8fc7\u6e21\u6548\u679c<\/li>\n<\/ol>\n<p><strong>\u6848\u4f8b\uff1a<\/strong><\/p>\n<pre class=\"language-java prettyprint linenums\"><code>.box { width: 100px; height: 100px; background-color: skyblue; transition: all 0.5s; } .box:hover { width: 600px; background-color: orange; box-shadow: 5px 10px 10px 5px #ccc; } <\/code><\/pre>\n<\/blockquote>\n<h3>\u9aa8\u67b6\u7ed3\u6784\u6807\u7b7e<\/h3>\n<blockquote>\n<ul>\n<li><strong>DOCTYPE\u6587\u6863\u8bf4\u660e<\/strong>\n<ul>\n<li>\u6587\u6863\u7c7b\u578b\u58f0\u660e\uff0c\u544a\u8bc9\u6d4f\u89c8\u5668\u8be5\u7f51\u9875\u7684 <strong>HTML\u7248\u672c<\/strong><\/li>\n<\/ul>\n<\/li>\n<li><strong>\u7f51\u9875\u8bed\u8a00<\/strong>\n<ul>\n<li>\u5e38\u89c1\u8bed\u8a00\uff1azh-CN \u7b80\u4f53\u4e2d\u6587 \/ en \u82f1<\/li>\n<li><code>&lt;html lang=\"en\"&gt; ``&lt;html lang=\"zh-CN\"&gt;<\/code><\/li>\n<\/ul>\n<\/li>\n<li><strong>\u5b57\u7b26\u7f16\u7801<\/strong>\n<ul>\n<li>\u4e07\u56fd\u7801\uff1a<img decoding=\"async\" src=\"https:\/\/img-blog.csdnimg.cn\/1b30d145644e415abd92ad280ab9ac4d.png#pic_center\" =\"\" =\"\u5728\u8fd9\u91cc\u63d2\u5165\u56fe\u7247\u63cf\u8ff0\" alt=\"web\u524d\u7aef\u57fa\u7840\u77e5\u8bc6\u8bd5\u9898\u53ca\u7b54\u6848_web\u524d\u7aef\u5f00\u53d1\u9700\u8981\u638c\u63e1\u4ec0\u4e48 (https:\/\/mushiming.com\/)  \u7b2c28\u5f20\" title=\"web\u524d\u7aef\u57fa\u7840\u77e5\u8bc6\u8bd5\u9898\u53ca\u7b54\u6848_web\u524d\u7aef\u5f00\u53d1\u9700\u8981\u638c\u63e1\u4ec0\u4e48  \u7b2c28\u5f20-\u7a46\u4e16\u660e\u535a\u5ba2\" ><\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<\/blockquote>\n<blockquote>\n<ul>\n<li>\u4f5c\u7528\uff1a\u4fdd\u5b58\u548c\u6253\u5f00\u7684\u5b57\u7b26\u7f16\u7801\u9700\u8981\u7edf\u4e00\u8bbe\u7f6e\uff0c\u5426\u5219\u53ef\u80fd\u4f1a\u51fa\u73b0 \u4e71\u7801<\/li>\n<\/ul>\n<\/blockquote>\n<h3>SEO\uff1a\u641c\u7d22\u5f15\u64ce\u4f18\u5316<\/h3>\n<blockquote>\n<ul>\n<li>\u4f5c\u7528\uff1a\u8ba9\u7f51\u7ad9\u5728\u641c\u7d22\u5f15\u64ce\u4e0a\u7684\u6392\u540d\u9760\u524d<\/li>\n<li>\u63d0\u5347SEO\u7684\u5e38\u89c1\u65b9\u6cd5\uff1a<\/li>\n<li>\n<ol>\n<li>\u7ade\u4ef7\u6392\u540d<\/li>\n<\/ol>\n<\/li>\n<li>\n<ol start=\"2\">\n<li>\u5c06\u7f51\u9875\u5236\u4f5c\u6210html\u540e\u7f00<\/li>\n<li>\u6807\u7b7e\u8bed\u4e49\u5316\uff08\u5728\u5408\u9002\u7684\u5730\u65b9\u4f7f\u7528\u5408\u9002\u7684\u6807\u7b7e\uff09<\/li>\n<\/ol>\n<\/li>\n<\/ul>\n<p><img decoding=\"async\" src=\"https:\/\/img-blog.csdnimg.cn\/c9c78405243f4f7c88f6313f6ec1738d.png\" =\"\" =\"\u5728\u8fd9\u91cc\u63d2\u5165\u56fe\u7247\u63cf\u8ff0\" alt=\"web\u524d\u7aef\u57fa\u7840\u77e5\u8bc6\u8bd5\u9898\u53ca\u7b54\u6848_web\u524d\u7aef\u5f00\u53d1\u9700\u8981\u638c\u63e1\u4ec0\u4e48 (https:\/\/mushiming.com\/)  \u7b2c29\u5f20\" title=\"web\u524d\u7aef\u57fa\u7840\u77e5\u8bc6\u8bd5\u9898\u53ca\u7b54\u6848_web\u524d\u7aef\u5f00\u53d1\u9700\u8981\u638c\u63e1\u4ec0\u4e48  \u7b2c29\u5f20-\u7a46\u4e16\u660e\u535a\u5ba2\" ><\/p>\n<\/blockquote>\n<h3>\u8ba9\u6587\u5b57\u6d88\u5931<\/h3>\n<blockquote>\n<p><code>font-size: 0;<\/code> \u6216\u8005<code>text-indent\uff1a\u53d6\u8d1f\u503c<\/code><\/p>\n<\/blockquote>\n","protected":false},"excerpt":{"rendered":"web\u524d\u7aef\u57fa\u7840\u77e5\u8bc6\u8bd5\u9898\u53ca\u7b54\u6848_web\u524d\u7aef\u5f00\u53d1\u9700\u8981\u638c\u63e1\u4ec0\u4e48HTML&amp;CSS\u57fa\u7840\u7ecf\u5178\u7248HTML\uff1a\u7ed3\u6784\uff08\u9875\u9762\u5143\u7d20\u548c\u5185\u5bb9\uff09css\uff1a\u8868\u73b0\uff08\u7f51\u9875\u5143...","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[],"tags":[],"_links":{"self":[{"href":"https:\/\/mushiming.com\/wp-json\/wp\/v2\/posts\/5132"}],"collection":[{"href":"https:\/\/mushiming.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/mushiming.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/mushiming.com\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/mushiming.com\/wp-json\/wp\/v2\/comments?post=5132"}],"version-history":[{"count":0,"href":"https:\/\/mushiming.com\/wp-json\/wp\/v2\/posts\/5132\/revisions"}],"wp:attachment":[{"href":"https:\/\/mushiming.com\/wp-json\/wp\/v2\/media?parent=5132"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/mushiming.com\/wp-json\/wp\/v2\/categories?post=5132"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/mushiming.com\/wp-json\/wp\/v2\/tags?post=5132"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}