{"id":231,"date":"2021-07-24T07:23:00","date_gmt":"2021-07-24T07:23:00","guid":{"rendered":"https:\/\/262235.xyz\/?p=231"},"modified":"2021-07-24T07:23:00","modified_gmt":"2021-07-24T07:23:00","slug":"231","status":"publish","type":"post","link":"https:\/\/lyvba.com\/index.php\/2021\/07\/24\/231\/","title":{"rendered":"12 \u4e2a\u6709\u8da3\u7684 CSS \u6587\u672c\u9634\u5f71"},"content":{"rendered":"<h1>12 \u4e2a\u6709\u8da3\u7684 CSS \u6587\u672c\u9634\u5f71<\/h1>\n<p>\u50cf\u5927\u591a\u6570 CSS \u6548\u679c\u4e00\u6837\uff0c\u6587\u672c\u9634\u5f71\u5728\u57fa\u672c\u5f62\u5f0f\u4e2d\u5b9e\u73b0\u8d77\u6765\u975e\u5e38\u7b80\u5355\uff0c\u4f46\u5982\u679c\u60a8\u771f\u7684\u5728\u5176\u4e2d\u8fdb\u884c\u4e00\u4e9b\u5de5\u4f5c\uff0c\u5b83\u4eec\u53ef\u4ee5\u91c7\u7528\u5404\u79cd\u4e0d\u540c\u7684\u5f62\u5f0f\u3002 \u4f7f\u7528\u9017\u53f7\u4f5c\u4e3a\u5206\u9694\u7b26\uff0c\u60a8\u53ef\u4ee5\u5c06 CSS \u9634\u5f71\u5806\u53e0\u5728\u4e00\u8d77\uff0c\u4ee5\u663e\u7740\u589e\u52a0\u6548\u679c\u7684\u5f3a\u5ea6\u548c\u771f\u5b9e\u611f\u3002 \u770b\u4e00\u4e9b\u4f8b\u5b50\uff1a<\/p>\n<p><img decoding=\"async\" src=\"https:\/\/raw.githubusercontent.com\/hongwenjun\/css-shadow\/master\/img-samples\/01%20The%20Basic%20Shadow.jpg\" alt=\"\" title=\"\"><\/p>\n<h2>The Basic Shadow<\/h2>\n<pre><code>text-shadow:  2px  4px  3px  rgba(0,0,0,0.3);\n<\/code><\/pre>\n<p><img decoding=\"async\" src=\"https:\/\/raw.githubusercontent.com\/hongwenjun\/css-shadow\/master\/img-samples\/02%20Quick%20and%20Dirty%20Letterpress.jpg\" alt=\"\" title=\"\"><\/p>\n<h2>Quick and Dirty Letterpress<\/h2>\n<pre><code>body  {\n    background:  #222;\n}\n\n#text h1 {\n    color:  rgba(0,0,0,0.6);\n    text-shadow:  2px  2px  3px  rgba(255,255,255,0.1);\n}\n<\/code><\/pre>\n<p><img decoding=\"async\" src=\"https:\/\/raw.githubusercontent.com\/hongwenjun\/css-shadow\/master\/img-samples\/03%20Hard%20Shadow.jpg\" alt=\"\" title=\"\"><\/p>\n<h2>Hard Shadow<\/h2>\n<pre><code>text-shadow:  6px  6px  0px  rgba(0,0,0,0.2);\n<\/code><\/pre>\n<p><img decoding=\"async\" src=\"https:\/\/raw.githubusercontent.com\/hongwenjun\/css-shadow\/master\/img-samples\/04%20Double%20Shadow.jpg\" alt=\"\" title=\"\"><\/p>\n<h2>Double Shadow<\/h2>\n<pre><code>text-shadow:  4px  3px  0px  #fff, 9px 8px 0px rgba(0,0,0,0.15);\n<\/code><\/pre>\n<p><img decoding=\"async\" src=\"https:\/\/raw.githubusercontent.com\/hongwenjun\/css-shadow\/master\/img-samples\/05%20Down%20and%20Distant.jpg\" alt=\"\" title=\"\"><\/p>\n<h2>Down and Distant<\/h2>\n<pre><code>text-shadow:    0px  3px  0px  #b2a98f,\n                0px  14px  10px  rgba(0,0,0,0.15),\n                0px  24px  2px  rgba(0,0,0,0.1),\n                0px  34px  30px  rgba(0,0,0,0.1);\n<\/code><\/pre>\n<p><img decoding=\"async\" src=\"https:\/\/raw.githubusercontent.com\/hongwenjun\/css-shadow\/master\/img-samples\/06%20Close%20and%20Heavy.jpg\" alt=\"\" title=\"\"><\/p>\n<h2>Close and Heavy<\/h2>\n<pre><code>text-shadow:    0px  4px  3px  rgba(0,0,0,0.4),\n                0px  8px  13px  rgba(0,0,0,0.1),\n                0px  18px  23px  rgba(0,0,0,0.1);\n<\/code><\/pre>\n<p><img decoding=\"async\" src=\"https:\/\/raw.githubusercontent.com\/hongwenjun\/css-shadow\/master\/img-samples\/07%20A%20Little%20Help.jpg\" alt=\"\" title=\"\"><\/p>\n<h2>Seriously 3D Text<\/h2>\n<pre><code>text-shadow:    0 1px 0 #ccc,\n                0 2px 0 #c9c9c9,\n                0 3px 0 #bbb,\n                0 4px 0 #b9b9b9,\n                0 5px 0 #aaa,\n                0 6px 1px rgba(0,0,0,.1),\n                0 0 5px rgba(0,0,0,.1),\n                0 1px 3px rgba(0,0,0,.3),\n                0 3px 5px rgba(0,0,0,.2),\n                0 5px 10px rgba(0,0,0,.25),\n                0 10px 10px rgba(0,0,0,.2),\n                0 20px 20px rgba(0,0,0,.15);\n<\/code><\/pre>\n<p><img decoding=\"async\" src=\"https:\/\/raw.githubusercontent.com\/hongwenjun\/css-shadow\/master\/img-samples\/08%20True%20Inset%20Text.jpg\" alt=\"\" title=\"\"><\/p>\n<h2>True Inset Text<\/h2>\n<pre><code>background-color: #666666;\n-webkit-background-clip: text;\n-moz-background-clip: text;\nbackground-clip: text;\ncolor: transparent;\ntext-shadow: rgba(255,255,255,0.5) 0px 3px 3px;\n<\/code><\/pre>\n<p><img decoding=\"async\" src=\"https:\/\/raw.githubusercontent.com\/hongwenjun\/css-shadow\/master\/img-samples\/09%20Glowing.jpg\" alt=\"\" title=\"\"><\/p>\n<h2>Glowing<\/h2>\n<pre><code>text-shadow: 0px 0px 6px rgba(255,255,255,0.7);\n\n<\/code><\/pre>\n<p><img decoding=\"async\" src=\"https:\/\/raw.githubusercontent.com\/hongwenjun\/css-shadow\/master\/img-samples\/10%20Superhero.jpg\" alt=\"\" title=\"\"><\/p>\n<h2>Superhero<\/h2>\n<pre><code>text-shadow:    -10px 10px 0px #00e6e6,\n                -20px 20px 0px #01cccc,\n                -30px 30px 0px #00bdbd;<\/code><\/pre>\n<p><img decoding=\"async\" src=\"https:\/\/raw.githubusercontent.com\/hongwenjun\/css-shadow\/master\/img-samples\/11%20Multiple%20Light%20Sources.jpg\" alt=\"\" title=\"\"><\/p>\n<h2>Multiple Light Sources<\/h2>\n<pre><code>text-shadow:    0px 15px 5px rgba(0,0,0,0.1),\n                10px 20px 5px rgba(0,0,0,0.05),\n                -10px 20px 5px rgba(0,0,0,0.05);\n                <\/code><\/pre>\n<p><img decoding=\"async\" src=\"https:\/\/raw.githubusercontent.com\/hongwenjun\/css-shadow\/master\/img-samples\/12%20Soft%20Emboss.jpg\" alt=\"\" title=\"\"><\/p>\n<h2>Soft Emboss<\/h2>\n<pre><code>color: rgba(0,0,0,0.6);\ntext-shadow:    2px 8px 6px rgba(0,0,0,0.2),\n                0px -5px 35px rgba(255,255,255,0.3);\n\n<\/code><\/pre>\n","protected":false},"excerpt":{"rendered":"<p>12 \u4e2a\u6709\u8da3\u7684 CSS \u6587\u672c\u9634\u5f71 \u50cf\u5927\u591a\u6570 CSS \u6548\u679c\u4e00\u6837\uff0c\u6587\u672c\u9634\u5f71\u5728\u57fa\u672c\u5f62\u5f0f\u4e2d\u5b9e\u73b0\u8d77\u6765\u975e\u5e38\u7b80\u5355\uff0c [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[12],"tags":[26,25],"class_list":["post-231","post","type-post","status-publish","format-standard","hentry","category-learn","tag-css","tag-html"],"_links":{"self":[{"href":"https:\/\/lyvba.com\/index.php\/wp-json\/wp\/v2\/posts\/231","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/lyvba.com\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/lyvba.com\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/lyvba.com\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/lyvba.com\/index.php\/wp-json\/wp\/v2\/comments?post=231"}],"version-history":[{"count":0,"href":"https:\/\/lyvba.com\/index.php\/wp-json\/wp\/v2\/posts\/231\/revisions"}],"wp:attachment":[{"href":"https:\/\/lyvba.com\/index.php\/wp-json\/wp\/v2\/media?parent=231"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/lyvba.com\/index.php\/wp-json\/wp\/v2\/categories?post=231"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/lyvba.com\/index.php\/wp-json\/wp\/v2\/tags?post=231"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}