{"id":810,"date":"2019-08-01T23:19:19","date_gmt":"2019-08-01T15:19:19","guid":{"rendered":"http:\/\/joserenfu.com\/?p=810"},"modified":"2020-07-05T02:49:46","modified_gmt":"2020-07-04T18:49:46","slug":"how-know-web-html-css","status":"publish","type":"post","link":"https:\/\/joserenfu.com\/how-know-web-html-css\/","title":{"rendered":"\u5982\u4f55\u67e5\u770b\u7db2\u9801HTML\u3001CSS\uff1f\u7db2\u9801\u8a2d\u8a08\u5fc5\u61c2\uff0c\u5916\u639b\u5de5\u5177\u3001\u8a9e\u6cd5\u61f6\u4eba\u5305\u5206\u4eab"},"content":{"rendered":"\n<p>\u5728<a rel=\"noreferrer noopener\" aria-label=\" (\u5728\u65b0\u5206\u9801\u4e2d\u958b\u555f)\" href=\"http:\/\/joserenfu.com\/become-web-designer-part2\/\" target=\"_blank\">\u81ea\u5b78\u6210\u70ba\u7db2\u9801\u8a2d\u8a08\u5e2b\uff1f(\u4e0b)<\/a>\u9019\u7bc7\u6709\u63d0\u5230\u7db2\u9801\u8a2d\u8a08\u5e2b\u7684\u80fd\u529b\u8981\u5982\u4f55\u63d0\u5347\uff0c\u9664\u4e86\u8981\u53bb\u770b\u5f88\u591a\u4e0d\u540c\u7684\u7db2\u7ad9\u4ee5\u5916\uff0c\u66f4\u9032\u968e\u9084\u9700\u8981\u6709HTML\u548cCSS\u7684\u77e5\u8b58\u8207\u7de8\u5beb\u80fd\u529b<br><\/p>\n\n\n\n<p class=\"has-background has-very-light-gray-background-color\">\u5ef6\u4f38\u95b1\u8b80\uff1a<a rel=\"noreferrer noopener\" aria-label=\" (\u5728\u65b0\u5206\u9801\u4e2d\u958b\u555f)\" href=\"http:\/\/joserenfu.com\/become-web-designer-part2\/\" target=\"_blank\">\u81ea\u5b78\u6210\u70ba\u7db2\u9801\u8a2d\u8a08\u5e2b\uff1f\u975e\u672c\u79d1\u751f\u8a2d\u8a08\u5e2b\u7684\u544a\u767d(\u4e0b)<\/a><\/p>\n\n\n\n<p>\u4e0d\u77e5\u9053\u525b\u958b\u59cb\u5b78\u7fd2\u7684\u4f60\u770b\u4e86\u5f88\u591a\u7db2\u7ad9\u4e4b\u5f8c\uff0c\u6709\u6c92\u6709\u51fa\u73fe\u4ee5\u4e0b\u7684\u72c0\u6cc1<\/p>\n\n\n\n<ul><li>\u7db2\u7ad9\u4e2d\u6709\u5f88\u591a\u5716\u7247\u548c\u5340\u584a\uff0c\u6211\u8981\u600e\u9ebc\u77e5\u9053CSS\u8a2d\u5b9a\u591a\u5c11\u5bec\u5ea6\u5462\uff1f<\/li><li>\u7db2\u7ad9\u7528\u7684\u5b57\u9ad4\u597d\u7279\u5225\uff0c\u6211\u8981\u600e\u9ebc\u77e5\u9053CSS\u8a2d\u5b9a\u4ec0\u9ebc\u5b57\u9ad4\u6216\u5927\u5c0f\u5462\uff1f<\/li><li>\u7db2\u7ad9\u7684\u4e3b\u8272\u8abf\u597d\u7f8e\u5594\uff01\u4f46\u6211\u8981\u600e\u9ebc\u77e5\u9053CSS\u984f\u8272\u7684\u8272\u78bc\uff1f<\/li><\/ul>\n\n\n\n<p>&#8230;\u7b49\u7b49\u4ee5\u4e0a\u7684\u554f\u984c<br><\/p>\n\n\n\n<p>\u900f\u904e\u9019\u7bc7\u9664\u4e86\u60f3\u8981\u5206\u4eabHTML\u548cCSS\u7684\u57fa\u672c\u77e5\u8b58\u4ee5\u5916\uff0c\u9084\u8981\u5206\u4eab2\u500b\u5de5\u5177\u4f86\u8b93\u4f60\u80fd\u5920\u627e\u5230\u7db2\u9801\u4e0a\u7684CSS\u6a23\u5f0f\u8a2d\u5b9a<\/p>\n\n\n\n<div style=\"height:50px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<div id=\"ez-toc-container\" class=\"ez-toc-v2_0_63 counter-hierarchy ez-toc-counter ez-toc-custom ez-toc-container-direction\">\n<p class=\"ez-toc-title\">\u5167\u5bb9\u76ee\u9304<\/p>\n<label for=\"ez-toc-cssicon-toggle-item-6602a097b508f\" class=\"ez-toc-cssicon-toggle-label\"><span class=\"\"><span class=\"eztoc-hide\" style=\"display:none;\">Toggle<\/span><span class=\"ez-toc-icon-toggle-span\"><svg style=\"fill: #333333;color:#333333\" 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: #333333;color:#333333\" 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><\/label><input type=\"checkbox\"  id=\"ez-toc-cssicon-toggle-item-6602a097b508f\"  aria-label=\"Toggle\" \/><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:\/\/joserenfu.com\/how-know-web-html-css\/#%E4%B8%80%E3%80%81CSS%E6%98%AF%E4%BB%80%E9%BA%BC%EF%BC%9FHTML%E5%8F%88%E6%98%AF%E4%BB%80%E9%BA%BC%EF%BC%9F\" title=\"\u4e00\u3001CSS\u662f\u4ec0\u9ebc\uff1fHTML\u53c8\u662f\u4ec0\u9ebc\uff1f\">\u4e00\u3001CSS\u662f\u4ec0\u9ebc\uff1fHTML\u53c8\u662f\u4ec0\u9ebc\uff1f<\/a><ul class='ez-toc-list-level-3' ><li class='ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/joserenfu.com\/how-know-web-html-css\/#1HTML%E6%98%AF%E4%BB%80%E9%BA%BC%EF%BC%9F\" title=\"1.HTML\u662f\u4ec0\u9ebc\uff1f\">1.HTML\u662f\u4ec0\u9ebc\uff1f<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-3\" href=\"https:\/\/joserenfu.com\/how-know-web-html-css\/#2%E9%82%A3CSS%E5%8F%88%E6%98%AF%E4%BB%80%E9%BA%BC%EF%BC%9F\" title=\"2.\u90a3CSS\u53c8\u662f\u4ec0\u9ebc\uff1f\">2.\u90a3CSS\u53c8\u662f\u4ec0\u9ebc\uff1f<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-4\" href=\"https:\/\/joserenfu.com\/how-know-web-html-css\/#3%E5%B9%BE%E5%80%8B%E9%97%9C%E6%96%BCHTML%E3%80%81CSS%E7%96%91%E5%95%8F\" title=\"3.\u5e7e\u500b\u95dc\u65bcHTML\u3001CSS\u7591\u554f\">3.\u5e7e\u500b\u95dc\u65bcHTML\u3001CSS\u7591\u554f<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-5\" href=\"https:\/\/joserenfu.com\/how-know-web-html-css\/#%E4%BA%8C%E3%80%81CSSViewer%E5%A4%96%E6%8E%9B%E6%8E%A8%E8%96%A6%EF%BC%88%E7%B0%A1%E6%98%93%E5%BF%AB%E9%80%9F%EF%BC%89\" title=\"\u4e8c\u3001CSSViewer\u5916\u639b\u63a8\u85a6\uff08\u7c21\u6613\u5feb\u901f\uff09\">\u4e8c\u3001CSSViewer\u5916\u639b\u63a8\u85a6\uff08\u7c21\u6613\u5feb\u901f\uff09<\/a><ul class='ez-toc-list-level-3' ><li class='ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-6\" href=\"https:\/\/joserenfu.com\/how-know-web-html-css\/#1%E4%B8%8B%E8%BC%89%E5%AE%89%E8%A3%9D\" title=\"1.\u4e0b\u8f09\/\u5b89\u88dd\">1.\u4e0b\u8f09\/\u5b89\u88dd<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-7\" href=\"https:\/\/joserenfu.com\/how-know-web-html-css\/#2%E5%95%9F%E7%94%A8CSSViewer\" title=\"2.\u555f\u7528CSSViewer\">2.\u555f\u7528CSSViewer<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-8\" href=\"https:\/\/joserenfu.com\/how-know-web-html-css\/#3%E5%A6%82%E4%BD%95%E4%BD%BF%E7%94%A8\" title=\"3.\u5982\u4f55\u4f7f\u7528\">3.\u5982\u4f55\u4f7f\u7528<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-9\" href=\"https:\/\/joserenfu.com\/how-know-web-html-css\/#%E4%B8%89%E3%80%81Chrome%E7%80%8F%E8%A6%BD%E5%99%A8%E9%96%8B%E7%99%BC%E8%80%85%E5%B7%A5%E5%85%B7%EF%BC%88%E9%80%B2%E9%9A%8E%E5%B7%A5%E5%85%B7%EF%BC%89\" title=\"\u4e09\u3001Chrome\u700f\u89bd\u5668\u958b\u767c\u8005\u5de5\u5177\uff08\u9032\u968e\u5de5\u5177\uff09\">\u4e09\u3001Chrome\u700f\u89bd\u5668\u958b\u767c\u8005\u5de5\u5177\uff08\u9032\u968e\u5de5\u5177\uff09<\/a><ul class='ez-toc-list-level-3' ><li class='ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-10\" href=\"https:\/\/joserenfu.com\/how-know-web-html-css\/#1%E9%96%8B%E7%99%BC%E8%80%85%E5%B7%A5%E5%85%B7%E4%BB%8B%E7%B4%B9\" title=\"1.\u958b\u767c\u8005\u5de5\u5177\u4ecb\u7d39\">1.\u958b\u767c\u8005\u5de5\u5177\u4ecb\u7d39<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-11\" href=\"https:\/\/joserenfu.com\/how-know-web-html-css\/#2%E5%B0%8B%E6%89%BEHTML%E8%A2%AB%E5%A5%97%E7%94%A8%E7%9A%84CSS%E6%A8%A3%E5%BC%8F\" title=\"2.\u5c0b\u627eHTML\u88ab\u5957\u7528\u7684CSS\u6a23\u5f0f\">2.\u5c0b\u627eHTML\u88ab\u5957\u7528\u7684CSS\u6a23\u5f0f<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-12\" href=\"https:\/\/joserenfu.com\/how-know-web-html-css\/#3%E8%A8%AD%E5%AE%9ACSS%E7%9C%8B%E7%9C%8B%E6%95%88%E6%9E%9C\" title=\"3.\u8a2d\u5b9aCSS\u770b\u770b\u6548\u679c\">3.\u8a2d\u5b9aCSS\u770b\u770b\u6548\u679c<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-13\" href=\"https:\/\/joserenfu.com\/how-know-web-html-css\/#%E5%9B%9B%E3%80%81%E5%A6%82%E4%BD%95%E5%9C%A8%E9%9B%BB%E8%85%A6%E4%B8%8A%E6%A8%A1%E6%93%AC%E6%89%8B%E6%A9%9F%E8%9E%A2%E5%B9%95\" title=\"\u56db\u3001\u5982\u4f55\u5728\u96fb\u8166\u4e0a\u6a21\u64ec\u624b\u6a5f\u87a2\u5e55\">\u56db\u3001\u5982\u4f55\u5728\u96fb\u8166\u4e0a\u6a21\u64ec\u624b\u6a5f\u87a2\u5e55<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-14\" href=\"https:\/\/joserenfu.com\/how-know-web-html-css\/#%E4%BA%94%E3%80%81%E5%B8%B8%E7%94%A8CSS%E8%AA%9E%E6%B3%95%E6%87%B6%E4%BA%BA%E5%8C%85\" title=\"\u4e94\u3001\u5e38\u7528CSS\u8a9e\u6cd5\u61f6\u4eba\u5305\">\u4e94\u3001\u5e38\u7528CSS\u8a9e\u6cd5\u61f6\u4eba\u5305<\/a><ul class='ez-toc-list-level-3' ><li class='ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-15\" href=\"https:\/\/joserenfu.com\/how-know-web-html-css\/#%E6%96%87%E5%AD%97CSS\" title=\"\u6587\u5b57CSS\">\u6587\u5b57CSS<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-16\" href=\"https:\/\/joserenfu.com\/how-know-web-html-css\/#%E5%AD%97%E9%AB%94CSS\" title=\"\u5b57\u9ad4CSS\">\u5b57\u9ad4CSS<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-17\" href=\"https:\/\/joserenfu.com\/how-know-web-html-css\/#%E8%83%8C%E6%99%AFCSS\" title=\"\u80cc\u666fCSS\">\u80cc\u666fCSS<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-18\" href=\"https:\/\/joserenfu.com\/how-know-web-html-css\/#%E5%86%85%E9%82%8A%E8%B7%9DCSS\" title=\"\u5185\u908a\u8dddCSS\">\u5185\u908a\u8dddCSS<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-19\" href=\"https:\/\/joserenfu.com\/how-know-web-html-css\/#%E9%82%8A%E6%A1%86CSS\" title=\"\u908a\u6846CSS\">\u908a\u6846CSS<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-20\" href=\"https:\/\/joserenfu.com\/how-know-web-html-css\/#%E5%A4%96%E9%82%8A%E8%B7%9DCSS\" title=\"\u5916\u908a\u8dddCSS\">\u5916\u908a\u8dddCSS<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-21\" href=\"https:\/\/joserenfu.com\/how-know-web-html-css\/#%E5%85%AD%E3%80%81%E7%B5%90%E8%AA%9E\" title=\"\u516d\u3001\u7d50\u8a9e\">\u516d\u3001\u7d50\u8a9e<\/a><\/li><\/ul><\/nav><\/div>\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"%E4%B8%80%E3%80%81CSS%E6%98%AF%E4%BB%80%E9%BA%BC%EF%BC%9FHTML%E5%8F%88%E6%98%AF%E4%BB%80%E9%BA%BC%EF%BC%9F\"><\/span>\u4e00\u3001CSS\u662f\u4ec0\u9ebc\uff1fHTML\u53c8\u662f\u4ec0\u9ebc\uff1f<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>\u4e86\u89e3\u7db2\u7ad9\u7684\u6a23\u5f0f\u8a2d\u5b9a\u4e4b\u524d\uff0c\u6211\u5011\u5f97\u5148\u78ba\u4fdd\u6709\u7db2\u9801\u8a9e\u6cd5\u7684\u57fa\u672c\u8a8d\u8b58\uff0c\u5c31\u50cf\u662f\u6211\u5011\u8981\u8a8d\u8b58\u82f1\u6587\u55ae\u5b57\u4e4b\u524d\uff0c\u6211\u5011\u9700\u8981\u5148\u770b\u5f97\u61c2ABC\u82f1\u6587\u5b57\u6bcd\u4e00\u6a23<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"1HTML%E6%98%AF%E4%BB%80%E9%BA%BC%EF%BC%9F\"><\/span>1.HTML\u662f\u4ec0\u9ebc\uff1f<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p>HTML\u4e3b\u8981\u8ca0\u8cac\u5efa\u7acb\u7db2\u9801\u5448\u73fe\u7684\u57fa\u672c\u67b6\u69cb\uff0c\u4e3b\u8981\u662f\u7531HTML\u6a19\u7c64\u7d44\u6210\u7684\uff0c\u5c31\u50cf\u6211\u5011\u4eba\u7684\u6a23\u5b50\u662f\u7531\u5404\u7a2e\u9aa8\u982d\u8207\u5668\u5b98\u7d44\u6210\u4e00\u6a23\uff0c\u4e5f\u6c7a\u5b9a\u4e86\u6211\u5011\u5448\u73fe\u51fa\u4f86\u7684\u6a23\u8c8c\uff0c\u50cf\u662f\u4eba\u548c\u72d7\u7684\u9aa8\u982d\u5f62\u72c0\u3001\u6578\u91cf\u90fd\u4e0d\u540c\uff0c\u6240\u4ee5\u6211\u5011\u7684\u5916\u8c8c\u4e5f\u5c31\u4e0d\u540c<br><\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"data:image\/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==\" data-layzr=\"http:\/\/joserenfu.com\/wp-content\/uploads\/2019\/08\/image.jpeg\" alt=\"\" class=\"wp-image-813\"\/><\/figure>\n\n\n\n<p>\u81c9\u90e8\u7684\u4e94\u5b98\u4e5f\u662f\u5982\u6b64\uff0c\u6211\u5011\u6709\u4e00\u500b\u9f3b\u5b50\u6709\u5169\u500b\u9f3b\u5b54\u3001\u4e00\u5f35\u5634\u5df4\u6709\u4e0a\u5507\u548c\u4e0b\u5507&#8230;\u7b49\u7b49\uff0cHTML\u4e5f\u662f\u7528\u4f86\u5efa\u69cb\u7db2\u7ad9\u7db2\u7ad9\u57fa\u672c\u7684\u8f2a\u5ed3\uff0c\u50cf\u662f\u9801\u982d\u3001\u5167\u5bb9\u5340\u584a\u3001\u5716\u7247\u5340\u584a\u3001\u9801\u5c3e<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"2%E9%82%A3CSS%E5%8F%88%E6%98%AF%E4%BB%80%E9%BA%BC%EF%BC%9F\"><\/span>2.\u90a3CSS\u53c8\u662f\u4ec0\u9ebc\uff1f<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p>CSS\u4e3b\u8981\u8ca0\u8cac\u8996\u89ba\u7684\u6a23\u5f0f\u8a2d\u5b9a\uff0c\u5982\u679c\u4f60\u6709\u73a9\u904e\u89d2\u8272\u626e\u6f14\u7684\u904a\u6232\uff0c\u6709\u4e9b\u904a\u6232\u5728\u5275\u7acb\u89d2\u8272\u6642\u5019\uff0c\u53ef\u4ee5\u8b93\u6211\u5011\u53bb\u5ba2\u88fd\u5316\u89d2\u8272\u7684\u6a23\u5b50\uff0c\u50cf\u662f\u8eab\u9ad8\u6bd4\u4f8b\u3001\u76ae\u819a\u984f\u8272\u3001\u773c\u775b\u5927\u5c0f\u3001\u9f3b\u5b50\u5f62\u72c0&#8230;\u7b49\u7b49<br><\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"data:image\/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==\" data-layzr=\"https:\/\/cdn2.ettoday.net\/images\/2927\/e2927379.jpg\" alt=\"\u300c\u5275\u7acb\u89d2\u8272 \u81c9\u300d\u7684\u5716\u7247\u641c\u5c0b\u7d50\u679c\"\/><figcaption>from \u9ed1\u8272\u6c99\u6f20M<\/figcaption><\/figure>\n\n\n\n<p>\u800cCSS\u5c31\u662f\u5c08\u9580\u4f86\u63a7\u5236\u7db2\u9801\u4e0a\u7684\u5404\u7a2e\u5143\u4ef6\u7684\u5927\u5c0f\u3001\u7c97\u7d30\u3001\u984f\u8272\u3001\u5b57\u9ad4\u3001\u5c0d\u9f4a\u548c\u4f4d\u7f6e&#8230;\u7b49\u7b49\u9019\u4e9b\u4e8b\u60c5<br><\/p>\n\n\n\n<p>CSS\u9084\u6709\u4e00\u500b\u6838\u5fc3\u7684\u529f\u7528\uff0c\u5c31\u662f\u628a\u91cd\u8907\u7684\u4e8b\u60c5\u53ea\u505a\u4e00\u6b21\u8a2d\u5b9a\uff0c\u4f8b\u5982\u6211\u7684\u7db2\u7ad9\u4e0a\u6240\u6709\u7684\u6309\u9215\u90fd\u8981\u7528\u7d05\u8272\u5e95\u8272\u3001\u767d\u8272\u6587\u5b57\uff0c\u90a3\u6211\u5011\u6703\u53d6\u4e00\u500b<strong>\u540d\u7a31<\/strong>\uff0c\u5728CSS\u4e2d\u7a31\u70ba<strong>class<\/strong><br><\/p>\n\n\n\n<p>\u7136\u5f8c\u518d\u5c0d\u9019\u500bclass\u8a2d\u5b9a\u5b83\u9700\u8981\u6709\u54ea\u4e9bCSS\u5c6c\u6027\uff0c\u4ee5\u53ca\u9019\u4e9b\u5c6c\u6027\u7684\u6578\u503c\uff0c\u518d\u4f86\u53ea\u8981\u5c07class\u5957\u7528\u5728\u6bcf\u500bHTML\u6a19\u7c64\u4e0a\uff0c\u9019\u4e9bHTML\u6a19\u7c64\u5c31\u90fd\u6703\u6709\u540c\u6a23\u7684CSS\u6a23\u5f0f\u8a2d\u5b9a\u4e86\uff0c\u7576\u7136CSS\u82e5\u6709\u4fee\u6539\uff0c\u6240\u6709\u5957\u7528\u540c\u4e00\u500bclass\u7684\u6a19\u7c64\u4e5f\u90fd\u6703\u53d7\u5f71\u97ff<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"3%E5%B9%BE%E5%80%8B%E9%97%9C%E6%96%BCHTML%E3%80%81CSS%E7%96%91%E5%95%8F\"><\/span>3.\u5e7e\u500b\u95dc\u65bcHTML\u3001CSS\u7591\u554f<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p><strong>\uff31\uff1a\u8acb\u554fCSS\u80fd\u5920\u6539\u8b8a\u7db2\u7ad9HTML\u539f\u672c\u7684\u5167\u5bb9\u55ce\uff1f<\/strong><\/p>\n\n\n\n<p>\u7b54\u6848\u662f\u4e0d\u884c\uff01\uff01\u56e0\u70baCSS\u5c31\u53ea\u8ca0\u8cac\u8abf\u6574\u5916\u89c0\u7684\u6a23\u5f0f\uff0c\u7121\u6cd5\u7570\u52d5\u7684\u539f\u672c\u7684\u7d50\u69cb\u548c\u5167\u5bb9\uff0c\u5c31\u50cf\u662f\u6211\u5011\u7684\u773c\u775b\u539f\u672c\u5c31\u53ea\u6709\u5169\u500b\uff0c\u7121\u6cd5\u900f\u904e\u5316\u599d\u800c\u751f\u51fa\u7b2c3\u500b\u773c\u775b\uff08\u5225\u8ddf\u6211\u63d0\u4eff\u771f\u599d\uff0c\u90a3\u9084\u662f\u5047\u7684\u773c\u775b\uff09\uff0c\u9664\u975e\u4f60\u900f\u904e\u6574\u5f62\u624b\u8853<br><\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"data:image\/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==\" data-layzr=\"https:\/\/pic1.xuehuaimg.com\/proxy\/baijia\/https:\/\/f11.baidu.com\/it\/u=4274643508,2564861066&amp;fm=173&amp;app=25&amp;f=JPEG?w=600&amp;h=360&amp;s=07707B87526518A47584B4880300F011&amp;access=215967316\" alt=\"\u300c\u98db\u5f71\u4e09\u773c\u300d\u7684\u5716\u7247\u641c\u5c0b\u7d50\u679c\"\/><figcaption>from <a rel=\"noreferrer noopener\" target=\"_blank\" href=\"https:\/\/www.xuehua.us\/2018\/08\/02\/%E7%9B%98%E7%82%B9%E5%8A%A8%E6%BC%AB%E9%87%8C%E6%8B%A5%E6%9C%89%E5%A4%9A%E5%8F%AA%E7%9C%BC%E7%9D%9B%E7%9A%84%E5%8F%AF%E6%80%95%E8%A7%92%E8%89%B2%EF%BC%8C%E7%AA%97%E6%88%B7%E5%A4%AA%E5%A4%9A%E6%88%91\/zh-tw\/\">www.xuehua.us<\/a><\/figcaption><\/figure>\n\n\n\n<p>\u800c\u5916\u79d1\u6574\u5f62\u624b\u8853\uff0c\u5728\u7db2\u9801\u4e2d\u5c31\u662f\u4fee\u6539HTML\u7684\u7d50\u69cb\u548c\u5167\u5bb9<br><\/p>\n\n\n\n<p><strong>\uff31\uff1a\u8acb\u554f\u7de8\u5bebHTML\u3001CSS\u662f\u5728\u5beb\u7a0b\u5f0f\u55ce\uff1f<\/strong><\/p>\n\n\n\n<p>\u9019\u4e0d\u662f\u5594\uff01\u4e0d\u7ba1\u54ea\u7a2e\u7a0b\u5f0f\u8a9e\u8a00\u90fd\u6703\u4f9d\u7167\u4f60\u5beb\u7684\u904b\u7b97\u5f0f\uff0c\u800c\u5e6b\u4f60\u904b\u7b97\u7522\u751f\u51fa\u7d50\u679c\uff0c\u4f46HTML\u548cCSS\u4e26\u6c92\u6709\u904b\u7b97\u7684\u80fd\u529b\uff0c\u6240\u4ee5\u4f60\u5beb\u4e86\u201d1+1=\u201d\uff0c\u5728\u7db2\u9801\u4e0a\u4e5f\u53ea\u6703\u5448\u73fe\u201d1+1=\u201d\uff0cHTML\u548cCSS\u4e26\u4e0d\u6703\u7d66\u4f60\u201d2\u201d\u9019\u500b\u7b54\u6848<\/p>\n\n\n\n<p>\u60f3\u66f4\u5168\u76e4\u4e86\u89e3\u53ef\u4ee5\u53c3\u8003<\/p>\n\n\n\n<figure class=\"wp-block-image\"><a href=\"http:\/\/joserenfu.com\/ywmo\" target=\"_blank\" rel=\"noreferrer noopener\"><img decoding=\"async\" src=\"data:image\/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==\" data-layzr=\"https:\/\/lh4.googleusercontent.com\/JTSpwbp_-9fi3fCZpGeGqWeGmKrt4e8ZyfQpjQ-Wj6gWbLKqIkcKxoil1ECFOViHpup2R2RzIeAIsZ2oBuKkLZ6xFeoFkbjK5HOZRDTYWvG0WVgsBEj7QpykLXR4683E7xNXaAum\" alt=\"\"\/><\/a><\/figure>\n\n\n\n<h4 class=\"wp-block-heading\"><strong><a href=\"http:\/\/joserenfu.com\/ywmo\" target=\"_blank\" rel=\"noreferrer noopener\" aria-label=\"HTML&amp;CSS\uff1a\u7db2\u7ad9\u8a2d\u8a08\u5efa\u7f6e\u512a\u5316\u4e4b\u9053 (\u5728\u65b0\u5206\u9801\u4e2d\u958b\u555f)\">HTML&amp;CSS\uff1a\u7db2\u7ad9\u8a2d\u8a08\u5efa\u7f6e\u512a\u5316\u4e4b\u9053<\/a><\/strong><\/h4>\n\n\n\n<div style=\"height:50px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"%E4%BA%8C%E3%80%81CSSViewer%E5%A4%96%E6%8E%9B%E6%8E%A8%E8%96%A6%EF%BC%88%E7%B0%A1%E6%98%93%E5%BF%AB%E9%80%9F%EF%BC%89\"><\/span>\u4e8c\u3001CSSViewer\u5916\u639b\u63a8\u85a6\uff08\u7c21\u6613\u5feb\u901f\uff09<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p><strong>CSSViewer<\/strong>\u662fChrome\u700f\u89bd\u5668\u7684\u64f4\u5145\u5957\u4ef6\uff0c\u662f\u5c08\u9580\u7528\u4f86\u6aa2\u793a\u7db2\u9801CSS\u6a23\u5f0f\u7684\u5de5\u5177\uff0c\u4ed6\u7684\u512a\u9ede\u662f\u5b89\u88dd\u5b8c\u4e4b\u5f8c\uff0c\u53ea\u8981\u9ede\u4e00\u4e0b\u8981\u67e5\u770b\u7684\u5340\u584a\uff0c\u7acb\u5373\u5c31\u53ef\u986f\u793a\u8a73\u7d30\u7684CSS\u6a23\u5f0f\u5167\u5bb9\uff0c\u5982\u6b64\u4e00\u4f86\u5c31\u53ef\u77e5\u9053\uff0c\u9019\u500b\u7db2\u9801\u5340\u584a\u7684\u6a23\u5f0f\u8a2d\u5b9a\u503c\u56c9\uff01<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"1%E4%B8%8B%E8%BC%89%E5%AE%89%E8%A3%9D\"><\/span>1.\u4e0b\u8f09\/\u5b89\u88dd<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p class=\"has-background has-very-light-gray-background-color\">\u4e0b\u8f09\u9023\u7d50\uff1a <a href=\"https:\/\/chrome.google.com\/webstore\/detail\/cssviewer\/ggfgijbpiheegefliciemofobhmofgce?utm_source=chrome-ntp-icon\" target=\"_blank\" rel=\"noreferrer noopener\" aria-label=\" (\u5728\u65b0\u5206\u9801\u4e2d\u958b\u555f)\">Chrome \u7dda\u4e0a\u61c9\u7528\u7a0b\u5f0f\u5546\u5e97<\/a><\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"data:image\/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==\" data-layzr=\"https:\/\/lh5.googleusercontent.com\/F4ZFNZsB54T31SWyeD-bMEL64J1pR5OhRmHCQrY3Ko0merciW4Gby_HB_2Xf9PkzYDfmlHWdZiAeCglGSsxw_8i8tsbAR9hZn8I6R0n0Vk-cPtxBthgvobriG9NaZceBNkjNV5Av\" alt=\"\"\/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"2%E5%95%9F%E7%94%A8CSSViewer\"><\/span>2.\u555f\u7528CSSViewer<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p>\u5b89\u88dd\u5b8c\u7562\u5f8c\uff0c\u5728\u7db2\u5740\u5217\u5f8c\u65b9\uff0c\u5c31\u6703\u770b\u5230CSSViewer\u7684\u5716\u793a\uff0c\u7576\u8981\u67e5\u770b\u7db2\u9801\u7684CSS\u6a23\u5f0f\u6642\uff0c\u518d\u9ede\u4e00\u4e0b\u5716\u793a\uff0c\u5c31\u53ef\u958b\u555fCSSViewer\uff0c\u518d\u6b21\u9ede\u64ca\u5247\u662f\u95dc\u9589CSSViewer<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"data:image\/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==\" data-layzr=\"https:\/\/lh5.googleusercontent.com\/Sq_hyQPHSwglQ34QI4J_TnILQ6eFWnxfmuQPLo3j4UHp1MK58Hdzf0_CsG9p7jkO430D2QO0bmvLzDXfJN3pD4Zk8WyX9eEW8rJ0bkO-VI4fFdXoheyVcP4wV1jy996_9wXRk5XO\" alt=\"\"\/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"3%E5%A6%82%E4%BD%95%E4%BD%BF%E7%94%A8\"><\/span>3.\u5982\u4f55\u4f7f\u7528<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p>\u9ede\u64ca\u8edf\u9ad4\u5716\u793a\u5f8c\uff0c\u6ed1\u9f20\u6e38\u6a19\u79fb\u52d5\u5230\u7db2\u9801\u7576\u4e2d\uff0c\u8edf\u9ad4\u6703\u81ea\u52d5\u5075\u6e2c\u4f60\u6240\u6307\u5b9a\u7684\u5340\u584aCSS\u6a23\u5f0f\u8a2d\u5b9a\uff0c\u4e26\u986f\u793a\u51fa\u4f86<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"data:image\/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==\" data-layzr=\"https:\/\/lh4.googleusercontent.com\/lznr06-O11inT4bXpo5M5XJUsF5os1vnQ_a02IJheECIV4hHgoiI0g-wJ2DNbIcV40cudGhWxuqw1wdiNymZulztPje2HcE8miShs9h48owIYw-WjA0DoLjn8MZV1kQvOQcBIE7k\" alt=\"\"\/><\/figure>\n\n\n\n<p>CSSViewer\u7684\u597d\u8655\u662f\u53ef\u4ee5\u5f88\u5bb9\u6613\u7684\u6307\u5b9a\u5230\u756b\u9762\u7684\u5143\u7d20\uff0c\u4e26\u986f\u793a\u51fa\u5b83\u6240\u88ab\u5957\u7528\u7684CSS\u6a23\u5f0f\uff0c\u4f46\u7f3a\u9ede\u662f\u4f60\u7121\u6cd5\u77e5\u9053CSS\u7684\u5beb\u6cd5\u662f\u5982\u4f55<\/p>\n\n\n\n<p>\u4f8b\u5982\uff1a<br><em><strong>CSS\u662f\u76f4\u63a5\u6307\u5b9a\u5728\u9019\u500bHTML\u6a19\u7c64\u4e0a\u55ce\uff1f<br>\u9084\u662f\u53d7\u5230\u5176\u4ed6\u6a19\u7c64\u7684CSS\u5f71\u97ff\u5462\uff1f<\/strong><\/em><br><\/p>\n\n\n\n<p>CSS\u662f\u76f4\u63a5\u6307\u5b9a\u5728\u9019\u500bHTML\u6a19\u7c64\u4e0a\u55ce\uff1f\u9084\u662f\u53d7\u5230\u5176\u4ed6\u6a19\u7c64\u7684CSS\u5f71\u97ff\u5462\uff1f<br><\/p>\n\n\n\n<p>\u9019\u5c0d\u65bc\u9700\u8981\u7de8\u5beb\u6216\u6539\u5bebCSS\u6a23\u5f0f\u7684\u4eba\u4f86\u8aaa\u883b\u91cd\u8981\u7684\uff0c\u56e0\u70ba\u5fc5\u9808\u627e\u5230CSS\u771f\u6b63\u5c0d\u61c9\u7684\u5beb\u6cd5\uff0c\u800c\u4e0b\u9762\u8981\u5206\u4eab\u7684\u5c31\u662f\u7db2\u9801\u8a2d\u8a08\u5e2b\u3001\u7db2\u9801\u524d\u7aef\u5de5\u7a0b\u5e2b\u5fc5\u6703\u4f7f\u7528\u7684<strong>Chrome\u700f\u89bd\u5668\u958b\u767c\u8005\u5de5\u5177<\/strong><\/p>\n\n\n\n<div style=\"height:50px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"%E4%B8%89%E3%80%81Chrome%E7%80%8F%E8%A6%BD%E5%99%A8%E9%96%8B%E7%99%BC%E8%80%85%E5%B7%A5%E5%85%B7%EF%BC%88%E9%80%B2%E9%9A%8E%E5%B7%A5%E5%85%B7%EF%BC%89\"><\/span>\u4e09\u3001Chrome\u700f\u89bd\u5668\u958b\u767c\u8005\u5de5\u5177\uff08\u9032\u968e\u5de5\u5177\uff09<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p><strong>Chrome\u700f\u89bd\u5668\u958b\u767c\u8005\u5de5\u5177<\/strong>\u662f\u7db2\u9801\u958b\u767c\u8005\u5fc5\u6703\u4f7f\u7528\u7684\u5de5\u5177\uff0c\u5b83\u4e3b\u8981\u662f\u5167\u5efa\u5728Chrome\u700f\u89bd\u5668\u4e4b\u4e2d\uff0c\u53ea\u8981\u4f60\u662f\u4f7f\u7528Chrome\u700f\u89bd\u5668\uff0c\u5c07\u6ed1\u9f20\u79fb\u5230\u67d0\u500b\u5143\u7d20\u4e0a(\u5716\u7247\u3001\u6587\u5b57&#8230;\u7b49)\uff0c\u9ede\u64ca\u6ed1\u9f20\u53f3\u9375\uff0c\u5728\u958b\u555f\u7684\u9078\u55ae\u4e2d\u9078\u64c7<strong>\u6aa2\u67e5\uff0c<\/strong>\u700f\u89bd\u5668\u5c31\u6703\u958b\u555f\u9019\u6a23\u7684\u756b\u9762<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"data:image\/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==\" data-layzr=\"https:\/\/lh3.googleusercontent.com\/UZQ6lee7tB6jCXauHjwlfGcLU1hRSLeV1bVojFln4pw9macKmnuelezimVbHDibl_aX6ZejzKbKvbV29yCJ9dH3cJtZej2UwgU4r8OJYZUzCYgWzsxWFWogr98PP8ccCH5oqf0eB\" alt=\"\"\/><\/figure>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"data:image\/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==\" data-layzr=\"https:\/\/lh6.googleusercontent.com\/WRMrNDbL5fbOADG8f3RNAE5gVxUdUP-hXfW-myVx7LaceT-_ijeyAdvOqkMFCQvzCshd_FDEJ_EJHQGu1dKGBI7uyhbw0mEsY2KUJTc_Egcqs9l0YN7RTDUxDr27DKH189ELatrF\" alt=\"\"\/><\/figure>\n\n\n\n<p>\u5982\u679c\u4f60\u8ddf\u6211\u9577\u5f97\u4e0d\u4e00\u6a23\u8acb\u4e0d\u8981\u64d4\u5fc3\uff0c\u8996\u7a97\u53f3\u4e0a\u89d2\u7684\u4e09\u500b\u9ede\u5716\u793a\u9ede\u64ca\u5f8c\uff0c\u6703\u6709\u9078\u9805\u53ef\u4ee5\u6539\u8b8a\u5de5\u5177\u7684\u5448\u73fe\u65b9\u5f0f\uff0c\u5982\u4e0b\u5716<\/p>\n\n\n\n<p><\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"data:image\/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==\" data-layzr=\"https:\/\/lh3.googleusercontent.com\/xhvVwWAgJXoNKgav0bXjNFmz_0OcgeceRBwnLNNCbsl3wKqj7XsqN5S8h3sa4LfjPfNNBhr5UTP27rIpifnwgpZ1qAhAZNNjlzsmLGwmeXtPSR0ZLdyJWXv24_QtBsebW2nFXzWe\" alt=\"\"\/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"1%E9%96%8B%E7%99%BC%E8%80%85%E5%B7%A5%E5%85%B7%E4%BB%8B%E7%B4%B9\"><\/span>1.\u958b\u767c\u8005\u5de5\u5177\u4ecb\u7d39<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p>\u958b\u767c\u8005\u5de5\u5177\u7684\u529f\u80fd\u975e\u5e38\u591a\uff0c\u4f46\u9019\u908a\u4e3b\u8981\u4ecb\u7d39\u7db2\u9801\u8a2d\u8a08\u5e2b\u5fc5\u6703\u4f7f\u7528\u5230\u7684\u5169\u500b\u90e8\u5206\uff0c\u5de6\u908a\u7d2b\u8272\u5340\u584a\u662f\u7db2\u9801HTML\uff0c\u53f3\u908a\u85cd\u8272\u5340\u584a\u662fCSS\u6a23\u5f0f\u8a2d\u5b9a<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"data:image\/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==\" data-layzr=\"https:\/\/lh3.googleusercontent.com\/HzrZQJUU9s4LGW1W3gRbaS7bvDj5zVy97scclKQeTBKYS8aKANcQVuigR7rRVC_ZQ6J8tSylJHFFmv4O6_laAmoqjNexaMv7WBz27C9nIejxADPv20t9b01rsPi2d2pyKg-ccFAl\" alt=\"\"\/><\/figure>\n\n\n\n<p>\u9019\u6642\u5019\u6211\u5011\u5c31\u53ef\u4ee5\u958b\u59cb\u4f86\u627e\u627e\u5404\u500b\u5143\u7d20\u7684CSS\u8a2d\u5b9a\u62c9\uff01<br><\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"2%E5%B0%8B%E6%89%BEHTML%E8%A2%AB%E5%A5%97%E7%94%A8%E7%9A%84CSS%E6%A8%A3%E5%BC%8F\"><\/span>2.\u5c0b\u627eHTML\u88ab\u5957\u7528\u7684CSS\u6a23\u5f0f<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p>\u56e0\u70ba\u6211\u525b\u525b\u662f\u5c0d\u7db2\u7ad9LOGO\u9ede\u64ca\u53f3\u9375\u4f7f\u7528\u6aa2\u67e5\uff0c\u6240\u4ee5\u958b\u767c\u8005\u5de5\u5177\u6703\u81ea\u52d5\u7528\u6dfa\u85cd\u8272\u80cc\u666f\uff0c\u6a19\u793a\u6211LOGO\u5716\u7247\u7684HTML\u6240\u5728\u5730\u65b9\uff0c\u7576\u6ed1\u9f20\u6e38\u6a19\u79fb\u5230HTML\u6a19\u7c64\u4e0a\u6642\uff0c\u7db2\u9801\u756b\u9762\u4e5f\u6703\u540c\u6b65\u6a19\u793a\uff0c\u4f60\u6b63\u5728\u9078\u64c7\u7684\u5730\u65b9\uff0c\u4f60\u73fe\u5728\u53ef\u4ee5\u99ac\u4e0a\u5c0d\u6211\u7684\u7db2\u9801\u8a66\u770b\u770b<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"data:image\/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==\" data-layzr=\"https:\/\/lh3.googleusercontent.com\/TqYUv49_nnVURNpECcobAvLiBnVXySwqPz02cqCSBQzBc8RGWfBl_9P_0NUA02biT81aK1aO8KgYOuwEfzUQYBrKP-hVn1zf7rRCe47o725Dw2RkdjNtbU0pxBiixqS20KGvDI_g\" alt=\"\"\/><\/figure>\n\n\n\n<p>\u9ede\u64caHTML\u6a19\u7c64\u5f8c\uff0c\u53f3\u908a\u7684CSS\u5340\u584a\u4e5f\u6703\u5448\u73fe\u9019\u500bHTML\u6a19\u7c64\u6240\u5957\u7528\u5230\u7684CSS\u3002\u9019\u6642\u5019\u773c\u5c16\u7684\u4f60\u53ef\u80fd\u6703\u767c\u73fe\uff0c\u5957\u7528\u7684CSS\u8a2d\u5b9a\u600e\u9ebd\u6703\u9019\u9ebc\u591a\uff0c\u6709\u4e9b\u9084\u91cd\u8907\u88ab\u5283\u6389<br><\/p>\n\n\n\n<p>\u7c21\u55ae\u89e3\u91cb\u7684\u8a71\uff0c\u662f\u56e0\u70baHTML\u6a19\u7c64\u7de8\u5beb\u6642\u5019\u662f\u6709\u968e\u5c64\u95dc\u4fc2\u7684\uff0c\u5c31\u50cf\u5de6\u908a\u7684HTML\u6240\u5448\u73fe\u65b9\u5f0f\u4e00\u6a23\uff0c\u9700\u8981\u628aHTML\u4e00\u4e00\u5c64\u5c64\u5c55\u958b\u64a5\u958b\uff0c\u5982\u540c\u6d0b\u8525\u4e00\u6a23<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"data:image\/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==\" data-layzr=\"https:\/\/lh6.googleusercontent.com\/Ehnyjo9-HQGHEPsUZZ6Ieyr_Cj5gTQTqJZeQFqhwcGPhyPlxXcEQbvuRaVVucmNmLT2eH5bctMOWsoR1VHOr8ZAhNRgHCnPcvvq5gsZQl_hoNCF9aZ1_V1jXiQnDl6ZHljrFoNMT\" alt=\"\"\/><\/figure>\n\n\n\n<p>\u800c\u6700\u5916\u5c64\u7684\u8a2d\u5b9a\u5c31\u5f80\u5167\u5f71\u97ff\u6240\u6709\u7684HTML\uff0c\u4f8b\u5982\u6211\u5728\u6700\u5916\u5c64\u7684HTML\u8a2d\u5b9a\u80cc\u666fCSS\u70ba\u7d05\u8272\uff0c\u90a3\u53ea\u8981\u5728\u9019\u5c64HTML\u4ee5\u4e0b\u7684\u6a19\u7c64\u90fd\u6703\u53d7\u5230\u5f71\u97ff\uff0c\u9664\u975e\u5728\u9019\u5176\u4e2d\u7684HTML\u53c8\u5728\u53e6\u5916\u8a2d\u5b9a\u80cc\u666f\u984f\u8272\uff0c\u90a3\u5c31\u6703\u4ee5\u6700\u5167\u90e8\u7684\u70ba\u4e3b<br><\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"data:image\/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==\" data-layzr=\"https:\/\/lh3.googleusercontent.com\/8_uX-H6fTUE22_EcAXRN3gFjBcUX5L2hzOnCZwVT2bZImPhNwi90BDJBIbC5haeZKWp4-XGPn0R7hb2xfGkLWfWfzUd-wr5Tx067uKaKvdrcQbGR4VJZLtoi9zaYYzBRK6mtOZ2L\" alt=\"\"\/><\/figure>\n\n\n\n<p>\u4e5f\u53ef\u4ee5\u628a\u5b83\u60f3\u6210\u662f\u7a2e\u7e7c\u627f\u907a\u50b3\u7684\u6982\u5ff5\uff0c\u7576\u6211\u7684\u963f\u516c\u6709\u79bf\u982d\u7684\u60c5\u6cc1\u6642\uff0c\u76f8\u5c0d\u7684\u6211\u7684\u7238\u7238\u751a\u81f3\u5230\u6211\u90fd\u6975\u6709\u53ef\u80fd\u6703\u79bf\u982d\uff0c\u56e0\u70ba\u57fa\u56e0\u907a\u50b3\u7684\u95dc\u4fc2\uff0c\u9664\u975e\u5728\u6211\u9019\u5c31\u5c07\u79bf\u982d\u57fa\u56e0\u79fb\u9664\uff0c\u4e0d\u7136\u6211\u7684\u4e4b\u5f8c\u7684\u5b50\u5b50\u5b6b\u5b6b\u90fd\u61c9\u8a72\u6703\u662f\u79bf\u982d\uff0cHTML\u8a2d\u5b9aCSS\u7684\u968e\u5c64\u5f71\u97ff\u4e5f\u662f\u9019\u6a23\uff0c\u8d8a\u5916\u5c64\u5f71\u97ff\u8d8a\u5927<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"3%E8%A8%AD%E5%AE%9ACSS%E7%9C%8B%E7%9C%8B%E6%95%88%E6%9E%9C\"><\/span>3.\u8a2d\u5b9aCSS\u770b\u770b\u6548\u679c<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p>\u5728<strong>Chrome\u958b\u767c\u8005\u5de5\u5177<\/strong>\u4e2d\u6240\u505a\u7684HTML\u548cCSS\u53ca\u5176\u4ed6\u4efb\u4f55\u4fee\u6539\uff0c\u53ef\u4ee5\u7acb\u5373\u770b\u5230\u7db2\u9801\u7684\u8b8a\u5316\uff0c\u90fd\u4e0d\u6703\u88ab\u5132\u5b58\u4e0b\u4f86\uff0c\u6240\u4ee5\u91cd\u65b0\u6574\u7406\u7db2\u9801\u53c8\u6703\u6062\u5fa9\u539f\u6a23\u5594<\/p>\n\n\n\n<p>\u73fe\u5728\u4ee5\u6211\u7db2\u7ad9\u70ba\u4f8b\u5b50\uff0c\u6211\u8981\u60f3\u8981\u5c07\u53f3\u7684\u5074\u6a19\u984c\u6587\u5b57\u6539\u70ba\u7d05\u8272\uff0c\u6211\u6703\u5c07\u6211\u6ed1\u9f20\u6e38\u6a19\u6307\u5230\u6a19\u984c\u6587\u5b57\u4e0a\u9762\uff0c\u4e26\u9ede\u64ca\u53f3\u9375\u548c\u9078\u64c7<strong>\u6aa2\u8996<\/strong>\uff0c\u6211\u5373\u53ef\u627e\u5230\u6a19\u984c\u7684HTML\u548cCSS\u8a2d\u5b9a<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"data:image\/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==\" data-layzr=\"https:\/\/lh5.googleusercontent.com\/wSnj753afgygJKN3tlxDHmwwYqheb9ZwOZc4ilbSqNHpw3Q0zmCqpMh9tf8_4H3-K6Cox8eLnyYuc0zNmYl2XJ7GY9qM3t15BxAulEXLWN1HPXFZbvsH9Z49wkyr0nx1HeK1Q1_a\" alt=\"\"\/><\/figure>\n\n\n\n<p>\u9019\u6642\u5019\u6211\u6703\u5c0b\u627e\u76ee\u524d\u771f\u6b63\u6700\u5f8c\u63a7\u5236\u6a19\u984c\u984f\u8272\u7684CSS\u5beb\u5728\u54ea\u908a\uff08\u5e38\u7528\u7684CSS\u5c6c\u6027\u6211\u6709\u6574\u7406\u5728\u6700\u4e0b\u65b9\uff09\uff0c\u201d\u6700\u5f8c\u771f\u6b63\u201c\u9019\u8a5e\u5c31\u5982\u6211\u4e0a\u9762\u6240\u8aaa\u7684\uff0c\u56e0\u70ba\u968e\u5c64\u95dc\u4fc2\uff0c\u5b83\u88ab\u5957\u7528\u5230\u5f88\u591aCSS\u5c6c\u6027\uff0c\u901a\u5e38\u6700\u4e0a\u65b9\u5f0f\u7684CSS\u5373\u662f\u6700\u5f8c\u88ab\u5957\u7528\u5230\u7684CSS<br><\/p>\n\n\n\n<p>\u5982\u4e0b\u5716\uff0c\u7d2b\u7dda\u8655\u662f<strong>class\u540d\u7a31<\/strong>\uff0c\u85cd\u7dda\u8655\u5247\u662f\u63a7\u5236\u6587\u5b57\u984f\u8272\u7684<strong>CSS\u5c6c\u6027<\/strong><br><\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"data:image\/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==\" data-layzr=\"https:\/\/lh3.googleusercontent.com\/HeHXqthIFeJ9l70Tbg4hwYDScEdWHnApEAApS6YAAVcOH0wBEO-7J_Rd8iyLYNEThRK38R6Nu4yTnCEQcToqKcP7diBHDzedNoLsnxOfPNq2FAVlLLjDMvDNiIkSTDd02efKHR1N\" alt=\"\"\/><\/figure>\n\n\n\n<p>\u9019\u6642\u5019\u4f60\u53ef\u4ee5\u5617\u8a66\u4fee\u6539\u85cd\u7dda\u8655\u7684CSS\u6578\u503c\uff08\u6ed1\u9f20\u76f4\u63a5\u9ede\u64ca\uff09\uff0c\u5982\u4e0b\u5716<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"data:image\/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==\" data-layzr=\"https:\/\/lh3.googleusercontent.com\/qIUqjcbpcP2KsIWEgrMdM_ZsxMvLDx1uOWMfJqcD_6P_y4doPnFS6gaE5zrkCiYzS3IO0me5ldvaaYZ0JOk6JtHKsYXKeaLzhvlTN0FmuNB7PVZR1a49FlXQchJPNezVo3tYh3gM\" alt=\"\"\/><\/figure>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"data:image\/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==\" data-layzr=\"https:\/\/lh6.googleusercontent.com\/geN9iQbvKYOEbcJ-hvL77_-O8-ii2yD6-tr4vgsG89s32kuBcy0aRcbqCQUtZmFQMKtBaNxZo1iX1uIbe7e_EJX7fIB38ndJq7x93THGd5ZAxv0smheSz2M9BZLCmW18YLs4PYyH\" alt=\"\"\/><\/figure>\n\n\n\n<p>\u7136\u5f8c\u4e0d\u662f\u6bcf\u500bCSS\u6578\u503c\u4e00\u958b\u59cb\u5c31\u6709\u8a2d\u5b9a\uff0c\u4f46\u4f60\u4e5f\u53ef\u4ee5\u9ede\u64ca\u7a7a\u767d\u5340\u584a\u5730\u65b9\uff0c\u52a0\u5165\u65b0\u7684CSS\u5c6c\u6027\uff0c\u7db2\u9801\u4e5f\u6703\u7acb\u5373\u51fa\u73fe\u6548\u679c<br><\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"data:image\/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==\" data-layzr=\"https:\/\/lh5.googleusercontent.com\/-XQcbor46CmgHxT8IONwS_HhQrc47ttJpPV_SZ_XiQ-rMCMFwJcHnd6emhg7N_UHvktZ8ZVXdMuDJXmFb1jNyJRyqxJzPwf0qonxsPlcFn-2UxVPkonrqypYCqHypPvp-U4sWk85\" alt=\"\"\/><\/figure>\n\n\n\n<p><strong>CSS\u5e38\u898b\u8a9e\u6cd5\u61f6\u4eba\u5305\u5728\u6587\u7ae0\u4e0b\u65b9<\/strong><\/p>\n\n\n\n<div style=\"height:50px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"%E5%9B%9B%E3%80%81%E5%A6%82%E4%BD%95%E5%9C%A8%E9%9B%BB%E8%85%A6%E4%B8%8A%E6%A8%A1%E6%93%AC%E6%89%8B%E6%A9%9F%E8%9E%A2%E5%B9%95\"><\/span>\u56db\u3001\u5982\u4f55\u5728\u96fb\u8166\u4e0a\u6a21\u64ec\u624b\u6a5f\u87a2\u5e55<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>\u56e0\u70ba\u667a\u6167\u578b\u624b\u6a5f\u666e\u53ca\u7684\u95dc\u4fc2\uff0cRWD\u7db2\u9801\u5728\u624b\u6a5f\u4e0a\u90fd\u6703\u5448\u73fe\u51fa\u4e0d\u540c\u6a23\u5b50\uff0c\u6709\u6c92\u6709\u8fa6\u6cd5\u5728\u96fb\u8166\u4e0a\u5c31\u53ef\u4ee5\u6a21\u64ec\u4e86\u5462\uff1f<br><\/p>\n\n\n\n<p>\u7b54\u6848\u662f\uff1a<strong>\u6709\u7684<\/strong><br><\/p>\n\n\n\n<p>\u958b\u767c\u8005\u5de5\u5177\u6709\u4e00\u500b\u624b\u6a5f\u6a21\u64ec\u5668\uff0c\u555f\u7528\u7684\u6309\u9215\u5728\u958b\u767c\u9019\u5de5\u5177\u8996\u7a97\u7684\u5de6\u4e0a\u89d2<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"data:image\/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==\" data-layzr=\"https:\/\/lh4.googleusercontent.com\/dVgwXa1Vov0Dxceud7d2UYY5GolUQg9xgVDNDxGNb9cN0ahqyd8s83QMTsOy3SBYECUbYGGuhsuUuWut7ZnLDPAqP29mF2h6clJwCmdK9eSRa8_sbE7pin27-I2sfFrwlV4IRtyE\" alt=\"\"\/><\/figure>\n\n\n\n<p>\u9ede\u958b\u5f8c\u7db2\u9801\u5448\u73fe\u6703\u8b8a\u6210\u6a21\u64ec\u5668\u7684\u6a23\u5b50\uff08\u958b\u767c\u8005\u5de5\u5177\u6211\u5148\u6539\u70ba\u8996\u7a97\u53f3\u5074\u986f\u793a\uff09\uff0c\u7d2b\u7dda\u8655\u9084\u53ef\u4ee5\u9078\u64c7\u4e0d\u540c\u7684\u88dd\u7f6e\u5c3a\u5bf8\u5594\uff01<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"data:image\/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==\" data-layzr=\"https:\/\/lh5.googleusercontent.com\/y2R3z1BXzU15iaoGZgjIAjMMiS5phVIG_n2LkwQ-pzVzaPbJhKj1ktaWwYiNVdwCXzg3mzGMENUQg3O2I9m6RWwX-meMDtsnD1lg_DLMIkVny2E2EPmcCy2wik_fGCJR4Pe6WDUc\" alt=\"\"\/><\/figure>\n\n\n\n<p>\u9019\u4e3b\u8981\u662f\u7528\u4f86\u770b\u770b\u624b\u6a5f\u7248\u662f\u5426\u6709\u8dd1\u7248\uff0c\u4f46\u6709\u4e9b\u64cd\u4f5c\u96e3\u514d\u9084\u662f\u6703\u8ddf\u624b\u6a5f\u4e0a\u6709\u9ede\u4e0d\u540c\uff0c\u4f46\u5df2\u7d93\u975e\u5e38\u65b9\u4fbf\u56c9\uff01<\/p>\n\n\n\n<div style=\"height:50px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"%E4%BA%94%E3%80%81%E5%B8%B8%E7%94%A8CSS%E8%AA%9E%E6%B3%95%E6%87%B6%E4%BA%BA%E5%8C%85\"><\/span>\u4e94\u3001\u5e38\u7528CSS\u8a9e\u6cd5\u61f6\u4eba\u5305<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"%E6%96%87%E5%AD%97CSS\"><\/span><a href=\"https:\/\/www.w3school.com.cn\/css\/css_text.asp\" target=\"_blank\" rel=\"noreferrer noopener\" aria-label=\"\u6587\u5b57CSS (\u5728\u65b0\u5206\u9801\u4e2d\u958b\u555f)\">\u6587\u5b57CSS<\/a><span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<figure class=\"wp-block-table\"><table><thead><tr><th><strong>\u5c5e\u6027<\/strong><\/th><th><strong>\u63cf\u8ff0<\/strong><\/th><\/tr><\/thead><tbody><tr><td><a href=\"https:\/\/www.w3school.com.cn\/cssref\/pr_text_color.asp\" target=\"_blank\" rel=\"noreferrer noopener\" aria-label=\" (\u5728\u65b0\u5206\u9801\u4e2d\u958b\u555f)\">color<\/a><\/td><td>\u8bbe\u7f6e\u6587\u672c\u989c\u8272<\/td><\/tr><tr><td><a href=\"https:\/\/www.w3school.com.cn\/cssref\/pr_text_direction.asp\" target=\"_blank\" rel=\"noreferrer noopener\" aria-label=\" (\u5728\u65b0\u5206\u9801\u4e2d\u958b\u555f)\">direction<\/a><\/td><td>\u8bbe\u7f6e\u6587\u672c\u65b9\u5411\u3002<\/td><\/tr><tr><td><a href=\"https:\/\/www.w3school.com.cn\/cssref\/pr_dim_line-height.asp\" target=\"_blank\" rel=\"noreferrer noopener\" aria-label=\" (\u5728\u65b0\u5206\u9801\u4e2d\u958b\u555f)\">line-height<\/a><\/td><td>\u8bbe\u7f6e\u884c\u9ad8\u3002<\/td><\/tr><tr><td><a href=\"https:\/\/www.w3school.com.cn\/cssref\/pr_text_letter-spacing.asp\" target=\"_blank\" rel=\"noreferrer noopener\" aria-label=\" (\u5728\u65b0\u5206\u9801\u4e2d\u958b\u555f)\">letter-spacing<\/a><\/td><td>\u8bbe\u7f6e\u5b57\u7b26\u95f4\u8ddd\u3002<\/td><\/tr><tr><td><a href=\"https:\/\/www.w3school.com.cn\/cssref\/pr_text_text-align.asp\" target=\"_blank\" rel=\"noreferrer noopener\" aria-label=\" (\u5728\u65b0\u5206\u9801\u4e2d\u958b\u555f)\">text-align<\/a><\/td><td>\u5bf9\u9f50\u5143\u7d20\u4e2d\u7684\u6587\u672c\u3002<\/td><\/tr><tr><td><a href=\"https:\/\/www.w3school.com.cn\/cssref\/pr_text_text-decoration.asp\" target=\"_blank\" rel=\"noreferrer noopener\" aria-label=\" (\u5728\u65b0\u5206\u9801\u4e2d\u958b\u555f)\">text-decoration<\/a><\/td><td>\u5411\u6587\u672c\u6dfb\u52a0\u4fee\u9970\u3002<\/td><\/tr><tr><td>text-shadow<\/td><td>\u8bbe\u7f6e\u6587\u672c\u9634\u5f71\u3002<\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"%E5%AD%97%E9%AB%94CSS\"><\/span><a href=\"https:\/\/www.w3school.com.cn\/css\/css_font.asp\" target=\"_blank\" rel=\"noreferrer noopener\" aria-label=\" (\u5728\u65b0\u5206\u9801\u4e2d\u958b\u555f)\">\u5b57\u9ad4CSS<\/a><span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<figure class=\"wp-block-table\"><table><thead><tr><th><strong>\u5c5e\u6027<\/strong><\/th><th><strong>\u63cf\u8ff0<\/strong><\/th><\/tr><\/thead><tbody><tr><td><a href=\"https:\/\/www.w3school.com.cn\/cssref\/pr_font_font-family.asp\" target=\"_blank\" rel=\"noreferrer noopener\" aria-label=\" (\u5728\u65b0\u5206\u9801\u4e2d\u958b\u555f)\">font-family<\/a><\/td><td>\u8bbe\u7f6e\u5b57\u4f53\u7cfb\u5217\u3002<\/td><\/tr><tr><td><a href=\"https:\/\/www.w3school.com.cn\/cssref\/pr_font_font-size.asp\" target=\"_blank\" rel=\"noreferrer noopener\" aria-label=\" (\u5728\u65b0\u5206\u9801\u4e2d\u958b\u555f)\">font-size<\/a><\/td><td>\u8bbe\u7f6e\u5b57\u4f53\u7684\u5c3a\u5bf8\u3002<\/td><\/tr><tr><td><a href=\"https:\/\/www.w3school.com.cn\/cssref\/pr_font_weight.asp\" target=\"_blank\" rel=\"noreferrer noopener\" aria-label=\" (\u5728\u65b0\u5206\u9801\u4e2d\u958b\u555f)\">font-weight<\/a><\/td><td>\u8bbe\u7f6e\u5b57\u4f53\u7684\u7c97\u7ec6\u3002<\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"%E8%83%8C%E6%99%AFCSS\"><\/span><a href=\"https:\/\/www.w3school.com.cn\/css\/css_background.asp\">\u80cc<\/a><a href=\"https:\/\/www.w3school.com.cn\/css\/css_background.asp\" target=\"_blank\" rel=\"noreferrer noopener\" aria-label=\"\u666fCSS (\u5728\u65b0\u5206\u9801\u4e2d\u958b\u555f)\">\u666fCSS<\/a><span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<figure class=\"wp-block-table\"><table><thead><tr><th><strong>\u5c5e\u6027<\/strong><\/th><th><strong>\u63cf\u8ff0<\/strong><\/th><\/tr><\/thead><tbody><tr><td><a href=\"https:\/\/www.w3school.com.cn\/cssref\/pr_background.asp\" target=\"_blank\" rel=\"noreferrer noopener\" aria-label=\" (\u5728\u65b0\u5206\u9801\u4e2d\u958b\u555f)\">background<\/a><\/td><td>\u7b80\u5199\u5c5e\u6027\uff0c\u4f5c\u7528\u662f\u5c06\u80cc\u666f\u5c5e\u6027\u8bbe\u7f6e\u5728\u4e00\u4e2a\u58f0\u660e\u4e2d\u3002<\/td><\/tr><tr><td><a href=\"https:\/\/www.w3school.com.cn\/cssref\/pr_background-color.asp\" target=\"_blank\" rel=\"noreferrer noopener\" aria-label=\" (\u5728\u65b0\u5206\u9801\u4e2d\u958b\u555f)\">background-color<\/a><\/td><td>\u8bbe\u7f6e\u5143\u7d20\u7684\u80cc\u666f\u989c\u8272\u3002<\/td><\/tr><tr><td><a href=\"https:\/\/www.w3school.com.cn\/cssref\/pr_background-image.asp\" target=\"_blank\" rel=\"noreferrer noopener\" aria-label=\" (\u5728\u65b0\u5206\u9801\u4e2d\u958b\u555f)\">background-image<\/a><\/td><td>\u628a\u56fe\u50cf\u8bbe\u7f6e\u4e3a\u80cc\u666f\u3002<\/td><\/tr><tr><td><a href=\"https:\/\/www.w3school.com.cn\/cssref\/pr_background-position.asp\" target=\"_blank\" rel=\"noreferrer noopener\" aria-label=\" (\u5728\u65b0\u5206\u9801\u4e2d\u958b\u555f)\">background-position<\/a><\/td><td>\u8bbe\u7f6e\u80cc\u666f\u56fe\u50cf\u7684\u8d77\u59cb\u4f4d\u7f6e\u3002<\/td><\/tr><tr><td><a href=\"https:\/\/www.w3school.com.cn\/cssref\/pr_background-repeat.asp\" target=\"_blank\" rel=\"noreferrer noopener\" aria-label=\" (\u5728\u65b0\u5206\u9801\u4e2d\u958b\u555f)\">background-repeat<\/a><\/td><td>\u8bbe\u7f6e\u80cc\u666f\u56fe\u50cf\u662f\u5426\u53ca\u5982\u4f55\u91cd\u590d\u3002<\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"%E5%86%85%E9%82%8A%E8%B7%9DCSS\"><\/span><a href=\"https:\/\/www.w3school.com.cn\/css\/css_padding.asp\">\u5185\u908a<\/a><a href=\"https:\/\/www.w3school.com.cn\/css\/css_padding.asp\" target=\"_blank\" rel=\"noreferrer noopener\" aria-label=\"\u8dddCSS (\u5728\u65b0\u5206\u9801\u4e2d\u958b\u555f)\">\u8dddCSS<\/a><span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<figure class=\"wp-block-table\"><table><thead><tr><th><strong>\u5c5e\u6027<\/strong><\/th><th><strong>\u63cf\u8ff0<\/strong><\/th><\/tr><\/thead><tbody><tr><td><a href=\"https:\/\/www.w3school.com.cn\/cssref\/pr_padding.asp\" target=\"_blank\" rel=\"noreferrer noopener\" aria-label=\" (\u5728\u65b0\u5206\u9801\u4e2d\u958b\u555f)\">padding<\/a><\/td><td>\u7b80\u5199\u5c5e\u6027\u3002\u4f5c\u7528\u662f\u5728\u4e00\u4e2a\u58f0\u660e\u4e2d\u8bbe\u7f6e\u5143\u7d20\u7684\u6240\u5185\u8fb9\u8ddd\u5c5e\u6027\u3002<\/td><\/tr><tr><td><a href=\"https:\/\/www.w3school.com.cn\/cssref\/pr_padding-bottom.asp\" target=\"_blank\" rel=\"noreferrer noopener\" aria-label=\" (\u5728\u65b0\u5206\u9801\u4e2d\u958b\u555f)\">padding-bottom<\/a><\/td><td>\u8bbe\u7f6e\u5143\u7d20\u7684\u4e0b\u5185\u8fb9\u8ddd\u3002<\/td><\/tr><tr><td><a href=\"https:\/\/www.w3school.com.cn\/cssref\/pr_padding-left.asp\" target=\"_blank\" rel=\"noreferrer noopener\" aria-label=\" (\u5728\u65b0\u5206\u9801\u4e2d\u958b\u555f)\">padding-left<\/a><\/td><td>\u8bbe\u7f6e\u5143\u7d20\u7684\u5de6\u5185\u8fb9\u8ddd\u3002<\/td><\/tr><tr><td><a href=\"https:\/\/www.w3school.com.cn\/cssref\/pr_padding-right.asp\" target=\"_blank\" rel=\"noreferrer noopener\" aria-label=\" (\u5728\u65b0\u5206\u9801\u4e2d\u958b\u555f)\">padding-right<\/a><\/td><td>\u8bbe\u7f6e\u5143\u7d20\u7684\u53f3\u5185\u8fb9\u8ddd\u3002<\/td><\/tr><tr><td><a href=\"https:\/\/www.w3school.com.cn\/cssref\/pr_padding-top.asp\" target=\"_blank\" rel=\"noreferrer noopener\" aria-label=\" (\u5728\u65b0\u5206\u9801\u4e2d\u958b\u555f)\">padding-top<\/a><\/td><td>\u8bbe\u7f6e\u5143\u7d20\u7684\u4e0a\u5185\u8fb9\u8ddd\u3002<\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"%E9%82%8A%E6%A1%86CSS\"><\/span><a href=\"https:\/\/www.w3school.com.cn\/css\/css_border.asp\" target=\"_blank\" rel=\"noreferrer noopener\" aria-label=\" (\u5728\u65b0\u5206\u9801\u4e2d\u958b\u555f)\">\u908a\u6846CSS<\/a><span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<figure class=\"wp-block-table\"><table><thead><tr><th><strong>\u5c5e\u6027<\/strong><\/th><th><strong>\u63cf\u8ff0<\/strong><\/th><\/tr><\/thead><tbody><tr><td><a href=\"https:\/\/www.w3school.com.cn\/cssref\/pr_border.asp\" target=\"_blank\" rel=\"noreferrer noopener\" aria-label=\" (\u5728\u65b0\u5206\u9801\u4e2d\u958b\u555f)\">border<\/a><\/td><td>\u7b80\u5199\u5c5e\u6027\uff0c\u7528\u4e8e\u628a\u9488\u5bf9\u56db\u4e2a\u8fb9\u7684\u5c5e\u6027\u8bbe\u7f6e\u5728\u4e00\u4e2a\u58f0\u660e\u3002<\/td><\/tr><tr><td><a href=\"https:\/\/www.w3school.com.cn\/cssref\/pr_border-style.asp\" target=\"_blank\" rel=\"noreferrer noopener\" aria-label=\" (\u5728\u65b0\u5206\u9801\u4e2d\u958b\u555f)\">border-style<\/a><\/td><td>\u7528\u4e8e\u8bbe\u7f6e\u5143\u7d20\u6240\u6709\u8fb9\u6846\u7684\u6837\u5f0f\uff0c\u6216\u8005\u5355\u72ec\u5730\u4e3a\u5404\u8fb9\u8bbe\u7f6e\u8fb9\u6846\u6837\u5f0f\u3002<\/td><\/tr><tr><td><a href=\"https:\/\/www.w3school.com.cn\/cssref\/pr_border-width.asp\" target=\"_blank\" rel=\"noreferrer noopener\" aria-label=\" (\u5728\u65b0\u5206\u9801\u4e2d\u958b\u555f)\">border-width<\/a><\/td><td>\u7b80\u5199\u5c5e\u6027\uff0c\u7528\u4e8e\u4e3a\u5143\u7d20\u7684\u6240\u6709\u8fb9\u6846\u8bbe\u7f6e\u5bbd\u5ea6\uff0c\u6216\u8005\u5355\u72ec\u5730\u4e3a\u5404\u8fb9\u8fb9\u6846\u8bbe\u7f6e\u5bbd\u5ea6\u3002<\/td><\/tr><tr><td><a href=\"https:\/\/www.w3school.com.cn\/cssref\/pr_border-color.asp\" target=\"_blank\" rel=\"noreferrer noopener\" aria-label=\" (\u5728\u65b0\u5206\u9801\u4e2d\u958b\u555f)\">border-color<\/a><\/td><td>\u7b80\u5199\u5c5e\u6027\uff0c\u8bbe\u7f6e\u5143\u7d20\u7684\u6240\u6709\u8fb9\u6846\u4e2d\u53ef\u89c1\u90e8\u5206\u7684\u989c\u8272\uff0c\u6216\u4e3a 4 \u4e2a\u8fb9\u5206\u522b\u8bbe\u7f6e\u989c\u8272\u3002<\/td><\/tr><tr><td><a href=\"https:\/\/www.w3school.com.cn\/cssref\/pr_border-bottom.asp\" target=\"_blank\" rel=\"noreferrer noopener\" aria-label=\" (\u5728\u65b0\u5206\u9801\u4e2d\u958b\u555f)\">border-bottom<\/a><\/td><td>\u7b80\u5199\u5c5e\u6027\uff0c\u7528\u4e8e\u628a\u4e0b\u8fb9\u6846\u7684\u6240\u6709\u5c5e\u6027\u8bbe\u7f6e\u5230\u4e00\u4e2a\u58f0\u660e\u4e2d\u3002<\/td><\/tr><tr><td><a href=\"https:\/\/www.w3school.com.cn\/cssref\/pr_border-left.asp\" target=\"_blank\" rel=\"noreferrer noopener\" aria-label=\" (\u5728\u65b0\u5206\u9801\u4e2d\u958b\u555f)\">border-left<\/a><\/td><td>\u7b80\u5199\u5c5e\u6027\uff0c\u7528\u4e8e\u628a\u5de6\u8fb9\u6846\u7684\u6240\u6709\u5c5e\u6027\u8bbe\u7f6e\u5230\u4e00\u4e2a\u58f0\u660e\u4e2d\u3002<\/td><\/tr><tr><td><a href=\"https:\/\/www.w3school.com.cn\/cssref\/pr_border-right.asp\" target=\"_blank\" rel=\"noreferrer noopener\" aria-label=\" (\u5728\u65b0\u5206\u9801\u4e2d\u958b\u555f)\">border-right<\/a><\/td><td>\u7b80\u5199\u5c5e\u6027\uff0c\u7528\u4e8e\u628a\u53f3\u8fb9\u6846\u7684\u6240\u6709\u5c5e\u6027\u8bbe\u7f6e\u5230\u4e00\u4e2a\u58f0\u660e\u4e2d\u3002<\/td><\/tr><tr><td><a href=\"https:\/\/www.w3school.com.cn\/cssref\/pr_border-top.asp\" target=\"_blank\" rel=\"noreferrer noopener\" aria-label=\" (\u5728\u65b0\u5206\u9801\u4e2d\u958b\u555f)\">border-top<\/a><\/td><td>\u7b80\u5199\u5c5e\u6027\uff0c\u7528\u4e8e\u628a\u4e0a\u8fb9\u6846\u7684\u6240\u6709\u5c5e\u6027\u8bbe\u7f6e\u5230\u4e00\u4e2a\u58f0\u660e\u4e2d\u3002<\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"%E5%A4%96%E9%82%8A%E8%B7%9DCSS\"><\/span><a href=\"https:\/\/www.w3school.com.cn\/css\/css_margin.asp\" target=\"_blank\" rel=\"noreferrer noopener\" aria-label=\"\u5916\u908a\u8dddCSS (\u5728\u65b0\u5206\u9801\u4e2d\u958b\u555f)\">\u5916\u908a\u8dddCSS<\/a><span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<figure class=\"wp-block-table\"><table><thead><tr><th><strong>\u5c5e\u6027<\/strong><\/th><th><strong>\u63cf\u8ff0<\/strong><\/th><\/tr><\/thead><tbody><tr><td><a href=\"https:\/\/www.w3school.com.cn\/cssref\/pr_margin.asp\" target=\"_blank\" rel=\"noreferrer noopener\" aria-label=\" (\u5728\u65b0\u5206\u9801\u4e2d\u958b\u555f)\">margin<\/a><\/td><td>\u7b80\u5199\u5c5e\u6027\u3002\u5728\u4e00\u4e2a\u58f0\u660e\u4e2d\u8bbe\u7f6e\u6240\u6709\u5916\u8fb9\u8ddd\u5c5e\u6027\u3002<\/td><\/tr><tr><td><a href=\"https:\/\/www.w3school.com.cn\/cssref\/pr_margin-bottom.asp\" target=\"_blank\" rel=\"noreferrer noopener\" aria-label=\" (\u5728\u65b0\u5206\u9801\u4e2d\u958b\u555f)\">margin-bottom<\/a><\/td><td>\u8bbe\u7f6e\u5143\u7d20\u7684\u4e0b\u5916\u8fb9\u8ddd\u3002<\/td><\/tr><tr><td><a href=\"https:\/\/www.w3school.com.cn\/cssref\/pr_margin-left.asp\" target=\"_blank\" rel=\"noreferrer noopener\" aria-label=\" (\u5728\u65b0\u5206\u9801\u4e2d\u958b\u555f)\">margin-left<\/a><\/td><td>\u8bbe\u7f6e\u5143\u7d20\u7684\u5de6\u5916\u8fb9\u8ddd\u3002<\/td><\/tr><tr><td><a href=\"https:\/\/www.w3school.com.cn\/cssref\/pr_margin-right.asp\" target=\"_blank\" rel=\"noreferrer noopener\" aria-label=\" (\u5728\u65b0\u5206\u9801\u4e2d\u958b\u555f)\">margin-right<\/a><\/td><td>\u8bbe\u7f6e\u5143\u7d20\u7684\u53f3\u5916\u8fb9\u8ddd\u3002<\/td><\/tr><tr><td><a href=\"https:\/\/www.w3school.com.cn\/cssref\/pr_margin-top.asp\" target=\"_blank\" rel=\"noreferrer noopener\" aria-label=\" (\u5728\u65b0\u5206\u9801\u4e2d\u958b\u555f)\">margin-top<\/a><\/td><td>\u8bbe\u7f6e\u5143\u7d20\u7684\u4e0a\u5916\u8fb9\u8ddd\u3002<\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n<p>\u4ee5\u4e0a\u8cc7\u6599\u4f86\u6e90\u4f86\u81f3<a href=\"https:\/\/www.w3school.com.cn\/css\/index.asp\" target=\"_blank\" rel=\"noreferrer noopener\" aria-label=\" (\u5728\u65b0\u5206\u9801\u4e2d\u958b\u555f)\">W3C\u7db2\u7ad9<\/a><\/p>\n\n\n\n<div style=\"height:50px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"%E5%85%AD%E3%80%81%E7%B5%90%E8%AA%9E\"><\/span>\u516d\u3001\u7d50\u8a9e<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>CSSViewer\u548cChrome\u7684\u958b\u767c\u8005\u5de5\u5177\u5404\u6709\u4e0d\u540c\u7684\u512a\u9ede<br><\/p>\n\n\n\n<p>\u5982\u679c\u4f60\u53ea\u662f\u8981\u55ae\u7d14\u8981\u77ad\u89e3\u7db2\u9801CSS\u76ee\u524d\u8a2d\u5b9a\u7684\u6578\u503c\u7684\u8a71\uff0cCSSViewer\u5c31\u975e\u5e38\u65b9\u4fbf\u5feb\u901f<\/p>\n\n\n\n<p>\u4f46\u5982\u679c\u4f60\u662f\u9700\u8981\u4fee\u6539\u548c\u7de8\u5bebCSS\u7684\u8a71\uff0c\u5c31\u5fc5\u9808\u8981\u6703\u4f7f\u7528\u958b\u767c\u8005\u5de5\u5177\uff0c\u9019\u6a23\u624d\u6709\u8fa6\u6cd5\u771f\u6b63\u8a2d\u5b9a\u597dCSS\u5728\u5c0d\u7684HTML\u6a19\u7c64\u4e0a<br><\/p>\n\n\n\n<p>\u5047\u5982\u6211\u7684\u8aaa\u660e\u9084\u662f\u7121\u6cd5\u8b93\u4f60\u660e\u767d\u5982\u4f55\u64cd\u4f5c\uff0c\u9019\u908a\u63a8\u85a6\u4e00\u9580\u6211\u4e4b\u524d\u5728<strong>Udemy<\/strong>\u4e0a\u904e\u7684<strong>\u516d\u89d2\u5b78\u9662<\/strong>\u514d\u8cbb\u6559\u5b78\u8ab2\u7a0b\uff0c\u8ab2\u7a0b\u4e3b\u8981\u8aaa\u660eChrome\u958b\u767c\u8005\u5de5\u5177\u7684\u64cd\u4f5c\u8207\u61c9\u7528\uff0c\u7b2c\u4e00\u7bc7\u7ae0\u7bc0\u5c31\u6709\u76f8\u95dc\u7684\u8aaa\u660e\uff0c\u6216\u8a31\u770b\u5f71\u7247\u6703\u6bd4\u5716\u7247\u66f4\u6e05\u695a\u5594\uff01<\/p>\n\n\n\n<p><a href=\"http:\/\/joserenfu.com\/ihn0\" class=\"btn_CTA\" target=\"_blank\" rel=\"noreferrer noopener\" title=\"http:\/\/joserenfu.com\/ihn0\">\u9ede\u6211\u524d\u5f80\u514d\u8cbb\u6559\u5b78\u8ab2\u7a0b<\/a><\/p>\n\n\n\n<div style=\"height:30px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<p>\u53e6\u5916\u4f60\u5982\u679c\u60f3\u5c0dHTML\u548cCSS\u60f3\u8981\u6709\u66f4\u591a\u4e86\u89e3\uff0c\u4e0d\u59a8\u53ef\u4ee5\u53c3\u8003\u4e0b\u9762\u7684\u66f8\u7c4d\u5594\uff01<\/p>\n\n\n\n<figure class=\"wp-block-image\"><a href=\"http:\/\/joserenfu.com\/ywmo\" target=\"_blank\" rel=\"noreferrer noopener\"><img decoding=\"async\" src=\"data:image\/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==\" data-layzr=\"https:\/\/lh4.googleusercontent.com\/dfqufoPAo-yUSAJXzRtmeG7VrRqvlCwGuqWGqd_KrPQMl0dGVdqN2oi_ywnPttvi0QST8AhWqh5RPh0_mtXK_8qNqAdbkIEEXDoboiQ8JtkGWZXumcHYHlf96-p6QiqMQXwLTWcT\" alt=\"\"\/><\/a><\/figure>\n\n\n\n<h4 class=\"wp-block-heading\"><strong><a href=\"http:\/\/joserenfu.com\/ywmo\" target=\"_blank\" rel=\"noreferrer noopener\" aria-label=\"HTML&amp;CSS\uff1a\u7db2\u7ad9\u8a2d\u8a08\u5efa\u7f6e\u512a\u5316\u4e4b\u9053 (\u5728\u65b0\u5206\u9801\u4e2d\u958b\u555f)\">HTML&amp;CSS\uff1a\u7db2\u7ad9\u8a2d\u8a08\u5efa\u7f6e\u512a\u5316\u4e4b\u9053<\/a><\/strong><\/h4>\n\n\n\n<div style=\"height:50px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<p class=\"has-background has-very-light-gray-background-color\">\u5ef6\u4f38\u95b1\u8b80\uff1a<br><a href=\"http:\/\/joserenfu.com\/become-web-designer-part1\/\">\u81ea\u5b78\u6210\u70ba\u7db2\u9801\u8a2d\u8a08\u5e2b\uff1f\u975e\u672c\u79d1\u751f\u8a2d\u8a08\u5e2b\u7684\u544a\u767d(\u4e0a)<\/a><br><a href=\"http:\/\/joserenfu.com\/ui-ux-difference\/\">UI\u3001UX\u662f\u4ec0\u9ebc\uff1f\u5e73\u9762\u8a2d\u8a08\u8f49\u8077\u5fc5\u770b<\/a><\/p>\n\n\n\n<div style=\"height:50px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<p style=\"background-color:#fff3d2\" class=\"has-background\"><em><strong>\u82e5\u4f60\u559c\u6b61\u6211\u7684\u9019\u7bc7\u6587\u7ae0\uff0c\u9ebb\u7169\u62cd5\u6b21\u4e0b\u9762\u5c0f\u624b\u7d66\u4e88\u6211\u652f\u6301\u8207\u9f13\u52f5\u5594\uff01<\/strong><\/em><\/p>\n","protected":false},"excerpt":{"rendered":"<p>\u5728\u81ea\u5b78\u6210\u70ba\u7db2\u9801\u8a2d\u8a08\u5e2b\uff1f(\u4e0b)\u9019\u7bc7\u6709\u63d0\u5230\u7db2\u9801\u8a2d\u8a08\u5e2b\u7684\u80fd\u529b\u8981\u5982\u4f55\u63d0\u5347\uff0c\u9664\u4e86\u8981\u53bb\u770b\u5f88\u591a\u4e0d\u540c\u7684\u7db2\u7ad9\u4ee5\u5916\uff0c\u66f4\u9032\u968e\u9084\u9700\u8981\u6709HTML\u548cCSS\u7684\u77e5\u8b58\u8207\u7de8\u5beb\u80fd\u529b<\/p>\n","protected":false},"author":1,"featured_media":841,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"lc_iscn_info":[],"_exactmetrics_skip_tracking":false,"_exactmetrics_sitenote_active":false,"_exactmetrics_sitenote_note":"","_exactmetrics_sitenote_category":0,"footnotes":""},"categories":[38,24],"tags":[41],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/joserenfu.com\/wp-json\/wp\/v2\/posts\/810"}],"collection":[{"href":"https:\/\/joserenfu.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/joserenfu.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/joserenfu.com\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/joserenfu.com\/wp-json\/wp\/v2\/comments?post=810"}],"version-history":[{"count":0,"href":"https:\/\/joserenfu.com\/wp-json\/wp\/v2\/posts\/810\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/joserenfu.com\/wp-json\/wp\/v2\/media\/841"}],"wp:attachment":[{"href":"https:\/\/joserenfu.com\/wp-json\/wp\/v2\/media?parent=810"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/joserenfu.com\/wp-json\/wp\/v2\/categories?post=810"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/joserenfu.com\/wp-json\/wp\/v2\/tags?post=810"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}