{"id":501,"date":"2025-10-22T10:33:54","date_gmt":"2025-10-22T02:33:54","guid":{"rendered":"https:\/\/www.hyw.life\/?p=501"},"modified":"2025-10-22T10:33:56","modified_gmt":"2025-10-22T02:33:56","slug":"css-%e6%96%87%e5%ad%97%e6%97%8b%e8%bd%ac%e7%89%b9%e6%95%88","status":"publish","type":"post","link":"https:\/\/www.hyw.life\/?p=501","title":{"rendered":"CSS \u6587\u5b57\u65cb\u8f6c\u7279\u6548"},"content":{"rendered":"\n<span id=\"h3-0\" class=\"heading-anchor\" aria-hidden=\"true\"><\/span><h3 class=\"wp-block-heading\">\u65cb\u8f6c\u4ee3\u7801<\/h3>\n\n\n\n<pre class=\"wp-block-code\"><code>&lt;!DOCTYPE html>\n&lt;html lang=\"en\">\n&lt;head>\n    &lt;meta charset=\"UTF-8\">\n    &lt;meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n    &lt;style>\n        .rotate {\n            display: inline-block; \/* \u786e\u4fdd transform \u751f\u6548 *\/\n            animation: spin 2s linear infinite; \/* \u65e0\u9650\u65cb\u8f6c *\/\n        }\n\n        @keyframes spin {\n            0% {\n                transform: rotate(0deg); \/* \u8d77\u59cb\u89d2\u5ea6 *\/\n            }\n            100% {\n                transform: rotate(360deg); \/* \u7ed3\u675f\u89d2\u5ea6 *\/\n            }\n        }\n    &lt;\/style>\n&lt;\/head>\n&lt;body>\n    &lt;div class=\"rotate\">\u65cb&lt;\/div>\n&lt;\/body>\n&lt;\/html><\/code><\/pre>\n\n\n\n<span id=\"h3-1\" class=\"heading-anchor\" aria-hidden=\"true\"><\/span><h3 class=\"wp-block-heading\">\u9f20\u6807\u60ac\u505c\u6682\u505c<\/h3>\n\n\n\n<pre class=\"wp-block-code\"><code>.rotate:hover {\n    animation-play-state: paused;\n}\n<\/code><\/pre>\n\n\n\n<span id=\"h3-2\" class=\"heading-anchor\" aria-hidden=\"true\"><\/span><h3 class=\"wp-block-heading\">\u5de6\u53f3\u6447\u6446\uff08\u5982\u949f\u6446\u6548\u679c\uff09<\/h3>\n\n\n\n<pre class=\"wp-block-code\"><code>@keyframes swing {\n    0% { transform: rotate(-30deg); }\n    50% { transform: rotate(30deg); }\n    100% { transform: rotate(-30deg); }\n}\n.rotate {\n    animation: swing 1s ease-in-out infinite;\n}\n<\/code><\/pre>\n","protected":false},"excerpt":{"rendered":"<p>\u65cb\u8f6c\u4ee3\u7801 \u9f20\u6807\u60ac\u505c\u6682\u505c \u5de6\u53f3\u6447\u6446\uff08\u5982\u949f\u6446\u6548\u679c\uff09<\/p>\n","protected":false},"author":1,"featured_media":482,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[5,42],"tags":[9,43],"class_list":["post-501","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-qd","category-42","tag-css","tag-43"],"_links":{"self":[{"href":"https:\/\/www.hyw.life\/index.php?rest_route=\/wp\/v2\/posts\/501","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.hyw.life\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.hyw.life\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.hyw.life\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.hyw.life\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=501"}],"version-history":[{"count":1,"href":"https:\/\/www.hyw.life\/index.php?rest_route=\/wp\/v2\/posts\/501\/revisions"}],"predecessor-version":[{"id":502,"href":"https:\/\/www.hyw.life\/index.php?rest_route=\/wp\/v2\/posts\/501\/revisions\/502"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.hyw.life\/index.php?rest_route=\/wp\/v2\/media\/482"}],"wp:attachment":[{"href":"https:\/\/www.hyw.life\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=501"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.hyw.life\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=501"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.hyw.life\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=501"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}