\u5916\u8d38\u4eba\u65f6\u949f\uff0c10\u5ea7\u57ce\u5e02\u4e16\u95f4<\/title>\n <style>\n * {\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n }\n\n \/* \u6781\u81f4\u7d27\u51d1\u8bbe\u8ba1\uff0c\u5c3d\u91cf\u51cf\u5c11\u6eda\u52a8\uff0c\u8ba9\u5341\u4e2a\u57ce\u5e02\u5c3d\u6536\u773c\u5e95 *\/\n body {\n background: radial-gradient(circle at 20% 30%, #0b1424, #04080f);\n font-family: 'Inter', 'Segoe UI', system-ui, 'BlinkMacSystemFont', 'Roboto', sans-serif;\n min-height: 100vh;\n padding: 1rem 1rem 0.5rem 1rem;\n color: #f0f3fc;\n }\n\n .container {\n max-width: 1400px;\n margin: 0 auto;\n }\n\n \/* \u5934\u90e8\u7d27\u51d1\u5316\uff0c\u51cf\u5c11\u5360\u7a7a *\/\n .header {\n text-align: center;\n margin-bottom: 1.2rem;\n }\n\n .header h1 {\n font-size: 1.8rem;\n font-weight: 700;\n color: #ffffff;\n text-shadow: 0 2px 8px rgba(0, 0, 0, 0.5);\n letter-spacing: -0.2px;\n }\n\n .header p {\n font-size: 0.75rem;\n color: #c7dcff;\n margin-top: 0.25rem;\n background: rgba(10, 25, 45, 0.5);\n display: inline-block;\n padding: 0.15rem 0.8rem;\n border-radius: 40px;\n backdrop-filter: blur(2px);\n }\n\n .sub {\n font-size: 0.65rem;\n background: rgba(45, 75, 115, 0.4);\n display: inline-block;\n padding: 0.1rem 0.8rem;\n border-radius: 40px;\n margin-top: 0.4rem;\n }\n\n \/* \u7f51\u683c\u5e03\u5c40\uff1a\u5361\u7247\u66f4\u7a84\u66f4\u7d27\u51d1\uff0c\u4fbf\u4e8e\u591a\u884c\u663e\u793a\u4e0d\u6ea2\u51fa\u5c4f\u5e55 *\/\n .clock-grid {\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));\n gap: 0.85rem;\n margin-bottom: 1rem;\n }\n\n \/* \u5c0f\u5de7\u5361\u7247\uff1a\u5185\u8fb9\u8ddd\u5927\u5e45\u51cf\u5c0f\uff0c\u5b57\u4f53\u6536\u7f29\uff0c\u51cf\u5c11\u5782\u76f4\u9ad8\u5ea6 *\/\n .city-card {\n background: rgba(18, 28, 48, 0.8);\n backdrop-filter: blur(8px);\n border-radius: 1.5rem;\n padding: 0.7rem 0.6rem 0.9rem 0.6rem;\n box-shadow: 0 12px 20px -10px rgba(0, 0, 0, 0.5);\n transition: all 0.2s ease;\n border: 1px solid rgba(100, 160, 250, 0.3);\n display: flex;\n flex-direction: column;\n align-items: center;\n text-align: center;\n }\n\n .city-card:hover {\n transform: translateY(-2px);\n background: rgba(28, 42, 70, 0.9);\n border-color: rgba(160, 200, 255, 0.6);\n }\n\n \/* \u57ce\u5e02\u540d\u79f0 - \u5c0f\u5de7\u9192\u76ee *\/\n .city-name {\n font-size: 1.05rem;\n font-weight: 620;\n color: #fff6e5;\n text-shadow: 0 1px 2px rgba(0, 0, 0, 0.4);\n margin-bottom: 0.2rem;\n display: inline-flex;\n align-items: center;\n gap: 0.3rem;\n letter-spacing: 0.2px;\n }\n\n \/* \u65e5\u671f\u533a\u57df \u7d27\u51d1 *\/\n .city-date {\n font-size: 0.7rem;\n font-weight: 500;\n color: #c2dcff;\n background: rgba(0, 0, 0, 0.4);\n padding: 0.1rem 0.5rem;\n border-radius: 30px;\n display: inline-block;\n margin-bottom: 0.35rem;\n letter-spacing: 0.2px;\n }\n\n \/* \u65f6\u95f4\u533a\u57df - \u7f29\u5c0f\u4f46\u4f9d\u7136\u6e05\u6670 *\/\n .city-time {\n font-size: 1.9rem;\n font-weight: 700;\n font-family: 'JetBrains Mono', 'SF Mono', 'Fira Code', monospace;\n letter-spacing: 2px;\n color: #e0f2ff;\n text-shadow: 0 0 5px rgba(0, 180, 255, 0.4);\n margin: 0.1rem 0 0.2rem;\n line-height: 1.2;\n }\n\n \/* \u65f6\u533a\u5c0f\u6807 *\/\n .timezone-note {\n font-size: 0.6rem;\n font-weight: 500;\n color: #b3ceff;\n background: rgba(0, 0, 0, 0.35);\n padding: 0.1rem 0.5rem;\n border-radius: 30px;\n display: inline-block;\n margin-top: 0.2rem;\n }\n\n \/* \u5e95\u90e8\u66f4\u7d27\u51d1 *\/\n .footer {\n text-align: center;\n margin-top: 0.6rem;\n font-size: 0.65rem;\n color: #8aacda;\n border-top: 1px solid rgba(80, 130, 200, 0.4);\n padding-top: 0.7rem;\n }\n\n .live-badge {\n display: inline-flex;\n align-items: center;\n gap: 0.35rem;\n background: rgba(0, 20, 35, 0.6);\n padding: 0.2rem 0.8rem;\n border-radius: 40px;\n font-size: 0.65rem;\n font-weight: 500;\n }\n\n .dot {\n width: 7px;\n height: 7px;\n background-color: #3effb0;\n border-radius: 50%;\n box-shadow: 0 0 5px #3effb0;\n animation: pulse 1.4s infinite;\n }\n\n @keyframes pulse {\n 0% { opacity: 0.5; transform: scale(0.8);}\n 100% { opacity: 1; transform: scale(1.2);}\n }\n\n \/* \u5bf9\u4e8e\u7279\u522b\u5c0f\u7684\u5c4f\u5e55\uff0c\u8fdb\u4e00\u6b65\u538b\u7f29 *\/\n @media (max-width: 720px) {\n body {\n padding: 0.8rem;\n }\n .clock-grid {\n gap: 0.7rem;\n grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));\n }\n .city-time {\n font-size: 1.6rem;\n letter-spacing: 1px;\n }\n .city-name {\n font-size: 0.95rem;\n }\n .city-date {\n font-size: 0.65rem;\n }\n }\n\n \/* \u5927\u5c4f\u4e0b\u786e\u4fdd\u4e24\u884c\u663e\u793a\u5b8c\u5168\uff0c\u5c3d\u91cf\u4e0d\u6eda\u52a8\uff08\u89c6\u53e3\u9ad8\u5ea6\u8db3\u591f\u65f6\uff09 *\/\n @media (min-height: 600px) {\n body {\n padding-bottom: 0.3rem;\n }\n .clock-grid {\n margin-bottom: 0.5rem;\n }\n }\n\n .city-card {\n animation: fadeSlideUp 0.25s ease-out;\n }\n @keyframes fadeSlideUp {\n from {\n opacity: 0;\n transform: translateY(8px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n }\n <\/style>\n<\/head>\n<body>\n<div class=\"container\">\n <div class=\"header\">\n <h1>\ud83c\udf0d \u5916\u8d38\u8de8\u5883\u4eba\u514d\u8d39\u65f6\u949f\u5de5\u5177<\/h1>\n <p>\u4e0a\u6d77 \u00b7 \u7ebd\u7ea6 \u00b7 \u6d1b\u6749\u77f6 \u00b7 \u4f26\u6566 \u00b7 \u4f0a\u65af\u5766\u5e03\u5c14 \u00b7 \u8fea\u62dc \u00b7 \u963f\u62c9\u6728\u56fe \u00b7 \u80e1\u5fd7\u660e\u5e02 \u00b7 \u6089\u5c3c \u00b7 \u5723\u4fdd\u7f57<\/p>\n <div class=\"sub\">\n <span>\ud83d\udd52 \u81ea\u52a8\u590f\u4ee4\u65f6 | \u81ea\u52a8\u66f4\u65b0<\/span>\n <\/div>\n <\/div>\n\n \n <div id=\"clockGrid\" class=\"clock-grid\"><\/div>\n\n <div class=\"footer\">\n <div class=\"live-badge\">\n <span class=\"dot\"><\/span>\n <span>\u5b9e\u65f6\u540c\u6b65 \u00b7 \u6bcf\u79d2\u66f4\u65b0<\/span>\n <\/div>\n <div style=\"margin-top: 6px;\">\n \ud83d\udd4a\ufe0f IANA \u65f6\u533a\u6570\u636e | \u5723\u4fdd\u7f57\u5df2\u52a0\u5165\n <\/div>\n <\/div>\n<\/div>\n\n<script>\n \/\/ ---------- \u57ce\u5e02\u5217\u8868\uff1a\u65b0\u589e\u5df4\u897f\u5723\u4fdd\u7f57 (America\/Sao_Paulo) ----------\n const cities = [\n { displayName: \"\ud83c\udde8\ud83c\uddf3 \u4e0a\u6d77\", tz: \"Asia\/Shanghai\" },\n { displayName: \"\ud83d\uddfd \u7ebd\u7ea6\", tz: \"America\/New_York\" },\n { displayName: \"\ud83c\udfac \u6d1b\u6749\u77f6\", tz: \"America\/Los_Angeles\" },\n { displayName: \"\ud83c\uddec\ud83c\udde7 \u4f26\u6566\", tz: \"Europe\/London\" },\n { displayName: \"\ud83c\uddf9\ud83c\uddf7 \u4f0a\u65af\u5766\u5e03\u5c14\", tz: \"Europe\/Istanbul\" },\n { displayName: \"\ud83c\udde6\ud83c\uddea \u8fea\u62dc\", tz: \"Asia\/Dubai\" },\n { displayName: \"\ud83c\uddf0\ud83c\uddff \u963f\u62c9\u6728\u56fe\", tz: \"Asia\/Almaty\" },\n { displayName: \"\ud83c\uddfb\ud83c\uddf3 \u80e1\u5fd7\u660e\u5e02\", tz: \"Asia\/Ho_Chi_Minh\" },\n { displayName: \"\ud83c\udde6\ud83c\uddfa \u6089\u5c3c\", tz: \"Australia\/Sydney\" },\n { displayName: \"\ud83c\udde7\ud83c\uddf7 \u5723\u4fdd\u7f57\", tz: \"America\/Sao_Paulo\" } \/\/ \u65b0\u589e\u5df4\u897f\u5723\u4fdd\u7f57\n ];\n\n \/\/ DOM \u5143\u7d20\u5f15\u7528\u6570\u7ec4\n let dateElements = [];\n let timeElements = [];\n\n const gridContainer = document.getElementById('clockGrid');\n\n \/\/ \u6784\u5efa\u6240\u6709\u5361\u7247 (\u4e00\u6b21\u6027\u751f\u6210\uff0c\u9ad8\u6548\u66f4\u65b0)\n function buildCards() {\n gridContainer.innerHTML = '';\n dateElements = [];\n timeElements = [];\n\n cities.forEach((city, idx) => {\n const card = document.createElement('div');\n card.className = 'city-card';\n \n const nameDiv = document.createElement('div');\n nameDiv.className = 'city-name';\n nameDiv.textContent = city.displayName;\n \n const dateDiv = document.createElement('div');\n dateDiv.className = 'city-date';\n dateDiv.textContent = '--\/-- ---';\n \n const timeDiv = document.createElement('div');\n timeDiv.className = 'city-time';\n timeDiv.textContent = '--:--:--';\n \n \/\/ \u65f6\u533a\u6807\u6ce8\uff08\u7b80\u6d01\uff09\n const tzNote = document.createElement('div');\n tzNote.className = 'timezone-note';\n let shortTZ = city.tz.split('\/').pop()?.replace(\/_\/g, ' ') || city.tz;\n \/\/ \u7279\u6b8a\u4f18\u5316\u5723\u4fdd\u7f57\u663e\u793a\n if (city.tz === \"America\/Sao_Paulo\") shortTZ = \"\u5723\u4fdd\u7f57 (BRT)\";\n tzNote.textContent = `\u23f2\ufe0f ${shortTZ}`;\n \n card.appendChild(nameDiv);\n card.appendChild(dateDiv);\n card.appendChild(timeDiv);\n card.appendChild(tzNote);\n \n gridContainer.appendChild(card);\n \n dateElements.push(dateDiv);\n timeElements.push(timeDiv);\n });\n }\n\n \/**\n * \u6839\u636e IANA \u65f6\u533a\u8fd4\u56de\u683c\u5f0f\u5316\u7684\u65e5\u671f\u5b57\u7b26\u4e32 + \u65f6\u95f4\u5b57\u7b26\u4e32\uff0824\u5c0f\u65f6\u5236\u542b\u79d2\uff0c\u4e2d\u6587\u7b80\u7ec3\uff09\n * \u65e5\u671f\u683c\u5f0f\u793a\u4f8b: \"2025\/3\/21 \u5468\u4e94\"\n *\/\n function getFormattedDateTimeByTZ(timezone) {\n const now = new Date();\n const dateOptions = {\n timeZone: timezone,\n year: 'numeric',\n month: 'numeric',\n day: 'numeric',\n weekday: 'short'\n };\n const timeOptions = {\n timeZone: timezone,\n hour12: false,\n hour: '2-digit',\n minute: '2-digit',\n second: '2-digit'\n };\n \n const dateFormatter = new Intl.DateTimeFormat('zh-CN', dateOptions);\n const timeFormatter = new Intl.DateTimeFormat('zh-CN', timeOptions);\n \n let dateStr = dateFormatter.format(now);\n let timeStr = timeFormatter.format(now);\n \n return { dateStr, timeStr };\n }\n\n \/\/ \u66f4\u65b0\u6240\u6709\u57ce\u5e02\u7684\u65f6\u95f4\u4e0e\u65e5\u671f\n function updateAllClocks() {\n for (let i = 0; i < cities.length; i++) {\n const tz = cities[i].tz;\n try {\n const { dateStr, timeStr } = getFormattedDateTimeByTZ(tz);\n if (dateElements[i]) dateElements[i].textContent = dateStr;\n if (timeElements[i]) timeElements[i].textContent = timeStr;\n } catch (error) {\n console.warn(`\u65f6\u533a ${tz} \u9519\u8bef:`, error);\n if (dateElements[i]) dateElements[i].textContent = '\u65e5\u671f\u65e0\u6548';\n if (timeElements[i]) timeElements[i].textContent = '--:--:--';\n }\n }\n }\n\n \/\/ \u542f\u52a8\u65f6\u949f: \u6784\u5efa\u5361\u7247 + \u7acb\u5373\u66f4\u65b0 + \u6bcf\u79d2\u5b9a\u65f6\u5668\n function initCompactClock() {\n buildCards();\n updateAllClocks();\n setInterval(() => {\n updateAllClocks();\n }, 1000);\n }\n\n initCompactClock();\n<\/script>\n<\/body>\n<\/html>\n\n\n\n<p><\/p>\n","protected":false},"excerpt":{"rendered":"<p>\u5916\u8d38\u4eba\u65f6\u949f\uff0c10\u5ea7\u57ce\u5e02\u4e16\u95f4 \ud83c\udf0d \u5916\u8d38\u8de8\u5883 […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"site-sidebar-layout":"default","site-content-layout":"","ast-site-content-layout":"default","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-5345","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/kc.yixingyule.com\/index.php\/wp-json\/wp\/v2\/pages\/5345","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/kc.yixingyule.com\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/kc.yixingyule.com\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/kc.yixingyule.com\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/kc.yixingyule.com\/index.php\/wp-json\/wp\/v2\/comments?post=5345"}],"version-history":[{"count":5,"href":"https:\/\/kc.yixingyule.com\/index.php\/wp-json\/wp\/v2\/pages\/5345\/revisions"}],"predecessor-version":[{"id":5355,"href":"https:\/\/kc.yixingyule.com\/index.php\/wp-json\/wp\/v2\/pages\/5345\/revisions\/5355"}],"wp:attachment":[{"href":"https:\/\/kc.yixingyule.com\/index.php\/wp-json\/wp\/v2\/media?parent=5345"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

{"id":5345,"date":"2026-04-14T01:37:07","date_gmt":"2026-04-14T01:37:07","guid":{"rendered":"https:\/\/kc.yixingyule.com\/?page_id=5345"},"modified":"2026-04-14T02:36:19","modified_gmt":"2026-04-14T02:36:19","slug":"time","status":"publish","type":"page","link":"https:\/\/kc.yixingyule.com\/index.php\/time\/","title":{"rendered":""},"content":{"rendered":"\n\n\n\n \n \n \u5916\u8d38\u4eba\u65f6\u949f\uff0c10\u5ea7\u57ce\u5e02\u4e16\u95f4<\/title>\n <style>\n * {\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n }\n\n \/* \u6781\u81f4\u7d27\u51d1\u8bbe\u8ba1\uff0c\u5c3d\u91cf\u51cf\u5c11\u6eda\u52a8\uff0c\u8ba9\u5341\u4e2a\u57ce\u5e02\u5c3d\u6536\u773c\u5e95 *\/\n body {\n background: radial-gradient(circle at 20% 30%, #0b1424, #04080f);\n font-family: 'Inter', 'Segoe UI', system-ui, 'BlinkMacSystemFont', 'Roboto', sans-serif;\n min-height: 100vh;\n padding: 1rem 1rem 0.5rem 1rem;\n color: #f0f3fc;\n }\n\n .container {\n max-width: 1400px;\n margin: 0 auto;\n }\n\n \/* \u5934\u90e8\u7d27\u51d1\u5316\uff0c\u51cf\u5c11\u5360\u7a7a *\/\n .header {\n text-align: center;\n margin-bottom: 1.2rem;\n }\n\n .header h1 {\n font-size: 1.8rem;\n font-weight: 700;\n color: #ffffff;\n text-shadow: 0 2px 8px rgba(0, 0, 0, 0.5);\n letter-spacing: -0.2px;\n }\n\n .header p {\n font-size: 0.75rem;\n color: #c7dcff;\n margin-top: 0.25rem;\n background: rgba(10, 25, 45, 0.5);\n display: inline-block;\n padding: 0.15rem 0.8rem;\n border-radius: 40px;\n backdrop-filter: blur(2px);\n }\n\n .sub {\n font-size: 0.65rem;\n background: rgba(45, 75, 115, 0.4);\n display: inline-block;\n padding: 0.1rem 0.8rem;\n border-radius: 40px;\n margin-top: 0.4rem;\n }\n\n \/* \u7f51\u683c\u5e03\u5c40\uff1a\u5361\u7247\u66f4\u7a84\u66f4\u7d27\u51d1\uff0c\u4fbf\u4e8e\u591a\u884c\u663e\u793a\u4e0d\u6ea2\u51fa\u5c4f\u5e55 *\/\n .clock-grid {\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));\n gap: 0.85rem;\n margin-bottom: 1rem;\n }\n\n \/* \u5c0f\u5de7\u5361\u7247\uff1a\u5185\u8fb9\u8ddd\u5927\u5e45\u51cf\u5c0f\uff0c\u5b57\u4f53\u6536\u7f29\uff0c\u51cf\u5c11\u5782\u76f4\u9ad8\u5ea6 *\/\n .city-card {\n background: rgba(18, 28, 48, 0.8);\n backdrop-filter: blur(8px);\n border-radius: 1.5rem;\n padding: 0.7rem 0.6rem 0.9rem 0.6rem;\n box-shadow: 0 12px 20px -10px rgba(0, 0, 0, 0.5);\n transition: all 0.2s ease;\n border: 1px solid rgba(100, 160, 250, 0.3);\n display: flex;\n flex-direction: column;\n align-items: center;\n text-align: center;\n }\n\n .city-card:hover {\n transform: translateY(-2px);\n background: rgba(28, 42, 70, 0.9);\n border-color: rgba(160, 200, 255, 0.6);\n }\n\n \/* \u57ce\u5e02\u540d\u79f0 - \u5c0f\u5de7\u9192\u76ee *\/\n .city-name {\n font-size: 1.05rem;\n font-weight: 620;\n color: #fff6e5;\n text-shadow: 0 1px 2px rgba(0, 0, 0, 0.4);\n margin-bottom: 0.2rem;\n display: inline-flex;\n align-items: center;\n gap: 0.3rem;\n letter-spacing: 0.2px;\n }\n\n \/* \u65e5\u671f\u533a\u57df \u7d27\u51d1 *\/\n .city-date {\n font-size: 0.7rem;\n font-weight: 500;\n color: #c2dcff;\n background: rgba(0, 0, 0, 0.4);\n padding: 0.1rem 0.5rem;\n border-radius: 30px;\n display: inline-block;\n margin-bottom: 0.35rem;\n letter-spacing: 0.2px;\n }\n\n \/* \u65f6\u95f4\u533a\u57df - \u7f29\u5c0f\u4f46\u4f9d\u7136\u6e05\u6670 *\/\n .city-time {\n font-size: 1.9rem;\n font-weight: 700;\n font-family: 'JetBrains Mono', 'SF Mono', 'Fira Code', monospace;\n letter-spacing: 2px;\n color: #e0f2ff;\n text-shadow: 0 0 5px rgba(0, 180, 255, 0.4);\n margin: 0.1rem 0 0.2rem;\n line-height: 1.2;\n }\n\n \/* \u65f6\u533a\u5c0f\u6807 *\/\n .timezone-note {\n font-size: 0.6rem;\n font-weight: 500;\n color: #b3ceff;\n background: rgba(0, 0, 0, 0.35);\n padding: 0.1rem 0.5rem;\n border-radius: 30px;\n display: inline-block;\n margin-top: 0.2rem;\n }\n\n \/* \u5e95\u90e8\u66f4\u7d27\u51d1 *\/\n .footer {\n text-align: center;\n margin-top: 0.6rem;\n font-size: 0.65rem;\n color: #8aacda;\n border-top: 1px solid rgba(80, 130, 200, 0.4);\n padding-top: 0.7rem;\n }\n\n .live-badge {\n display: inline-flex;\n align-items: center;\n gap: 0.35rem;\n background: rgba(0, 20, 35, 0.6);\n padding: 0.2rem 0.8rem;\n border-radius: 40px;\n font-size: 0.65rem;\n font-weight: 500;\n }\n\n .dot {\n width: 7px;\n height: 7px;\n background-color: #3effb0;\n border-radius: 50%;\n box-shadow: 0 0 5px #3effb0;\n animation: pulse 1.4s infinite;\n }\n\n @keyframes pulse {\n 0% { opacity: 0.5; transform: scale(0.8);}\n 100% { opacity: 1; transform: scale(1.2);}\n }\n\n \/* \u5bf9\u4e8e\u7279\u522b\u5c0f\u7684\u5c4f\u5e55\uff0c\u8fdb\u4e00\u6b65\u538b\u7f29 *\/\n @media (max-width: 720px) {\n body {\n padding: 0.8rem;\n }\n .clock-grid {\n gap: 0.7rem;\n grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));\n }\n .city-time {\n font-size: 1.6rem;\n letter-spacing: 1px;\n }\n .city-name {\n font-size: 0.95rem;\n }\n .city-date {\n font-size: 0.65rem;\n }\n }\n\n \/* \u5927\u5c4f\u4e0b\u786e\u4fdd\u4e24\u884c\u663e\u793a\u5b8c\u5168\uff0c\u5c3d\u91cf\u4e0d\u6eda\u52a8\uff08\u89c6\u53e3\u9ad8\u5ea6\u8db3\u591f\u65f6\uff09 *\/\n @media (min-height: 600px) {\n body {\n padding-bottom: 0.3rem;\n }\n .clock-grid {\n margin-bottom: 0.5rem;\n }\n }\n\n .city-card {\n animation: fadeSlideUp 0.25s ease-out;\n }\n @keyframes fadeSlideUp {\n from {\n opacity: 0;\n transform: translateY(8px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n }\n <\/style>\n<\/head>\n<body>\n<div class=\"container\">\n <div class=\"header\">\n <h1>\ud83c\udf0d \u5916\u8d38\u8de8\u5883\u4eba\u514d\u8d39\u65f6\u949f\u5de5\u5177<\/h1>\n <p>\u4e0a\u6d77 \u00b7 \u7ebd\u7ea6 \u00b7 \u6d1b\u6749\u77f6 \u00b7 \u4f26\u6566 \u00b7 \u4f0a\u65af\u5766\u5e03\u5c14 \u00b7 \u8fea\u62dc \u00b7 \u963f\u62c9\u6728\u56fe \u00b7 \u80e1\u5fd7\u660e\u5e02 \u00b7 \u6089\u5c3c \u00b7 \u5723\u4fdd\u7f57<\/p>\n <div class=\"sub\">\n <span>\ud83d\udd52 \u81ea\u52a8\u590f\u4ee4\u65f6 | \u81ea\u52a8\u66f4\u65b0<\/span>\n <\/div>\n <\/div>\n\n \n <div id=\"clockGrid\" class=\"clock-grid\"><\/div>\n\n <div class=\"footer\">\n <div class=\"live-badge\">\n <span class=\"dot\"><\/span>\n <span>\u5b9e\u65f6\u540c\u6b65 \u00b7 \u6bcf\u79d2\u66f4\u65b0<\/span>\n <\/div>\n <div style=\"margin-top: 6px;\">\n \ud83d\udd4a\ufe0f IANA \u65f6\u533a\u6570\u636e | \u5723\u4fdd\u7f57\u5df2\u52a0\u5165\n <\/div>\n <\/div>\n<\/div>\n\n<script>\n \/\/ ---------- \u57ce\u5e02\u5217\u8868\uff1a\u65b0\u589e\u5df4\u897f\u5723\u4fdd\u7f57 (America\/Sao_Paulo) ----------\n const cities = [\n { displayName: \"\ud83c\udde8\ud83c\uddf3 \u4e0a\u6d77\", tz: \"Asia\/Shanghai\" },\n { displayName: \"\ud83d\uddfd \u7ebd\u7ea6\", tz: \"America\/New_York\" },\n { displayName: \"\ud83c\udfac \u6d1b\u6749\u77f6\", tz: \"America\/Los_Angeles\" },\n { displayName: \"\ud83c\uddec\ud83c\udde7 \u4f26\u6566\", tz: \"Europe\/London\" },\n { displayName: \"\ud83c\uddf9\ud83c\uddf7 \u4f0a\u65af\u5766\u5e03\u5c14\", tz: \"Europe\/Istanbul\" },\n { displayName: \"\ud83c\udde6\ud83c\uddea \u8fea\u62dc\", tz: \"Asia\/Dubai\" },\n { displayName: \"\ud83c\uddf0\ud83c\uddff \u963f\u62c9\u6728\u56fe\", tz: \"Asia\/Almaty\" },\n { displayName: \"\ud83c\uddfb\ud83c\uddf3 \u80e1\u5fd7\u660e\u5e02\", tz: \"Asia\/Ho_Chi_Minh\" },\n { displayName: \"\ud83c\udde6\ud83c\uddfa \u6089\u5c3c\", tz: \"Australia\/Sydney\" },\n { displayName: \"\ud83c\udde7\ud83c\uddf7 \u5723\u4fdd\u7f57\", tz: \"America\/Sao_Paulo\" } \/\/ \u65b0\u589e\u5df4\u897f\u5723\u4fdd\u7f57\n ];\n\n \/\/ DOM \u5143\u7d20\u5f15\u7528\u6570\u7ec4\n let dateElements = [];\n let timeElements = [];\n\n const gridContainer = document.getElementById('clockGrid');\n\n \/\/ \u6784\u5efa\u6240\u6709\u5361\u7247 (\u4e00\u6b21\u6027\u751f\u6210\uff0c\u9ad8\u6548\u66f4\u65b0)\n function buildCards() {\n gridContainer.innerHTML = '';\n dateElements = [];\n timeElements = [];\n\n cities.forEach((city, idx) => {\n const card = document.createElement('div');\n card.className = 'city-card';\n \n const nameDiv = document.createElement('div');\n nameDiv.className = 'city-name';\n nameDiv.textContent = city.displayName;\n \n const dateDiv = document.createElement('div');\n dateDiv.className = 'city-date';\n dateDiv.textContent = '--\/-- ---';\n \n const timeDiv = document.createElement('div');\n timeDiv.className = 'city-time';\n timeDiv.textContent = '--:--:--';\n \n \/\/ \u65f6\u533a\u6807\u6ce8\uff08\u7b80\u6d01\uff09\n const tzNote = document.createElement('div');\n tzNote.className = 'timezone-note';\n let shortTZ = city.tz.split('\/').pop()?.replace(\/_\/g, ' ') || city.tz;\n \/\/ \u7279\u6b8a\u4f18\u5316\u5723\u4fdd\u7f57\u663e\u793a\n if (city.tz === \"America\/Sao_Paulo\") shortTZ = \"\u5723\u4fdd\u7f57 (BRT)\";\n tzNote.textContent = `\u23f2\ufe0f ${shortTZ}`;\n \n card.appendChild(nameDiv);\n card.appendChild(dateDiv);\n card.appendChild(timeDiv);\n card.appendChild(tzNote);\n \n gridContainer.appendChild(card);\n \n dateElements.push(dateDiv);\n timeElements.push(timeDiv);\n });\n }\n\n \/**\n * \u6839\u636e IANA \u65f6\u533a\u8fd4\u56de\u683c\u5f0f\u5316\u7684\u65e5\u671f\u5b57\u7b26\u4e32 + \u65f6\u95f4\u5b57\u7b26\u4e32\uff0824\u5c0f\u65f6\u5236\u542b\u79d2\uff0c\u4e2d\u6587\u7b80\u7ec3\uff09\n * \u65e5\u671f\u683c\u5f0f\u793a\u4f8b: \"2025\/3\/21 \u5468\u4e94\"\n *\/\n function getFormattedDateTimeByTZ(timezone) {\n const now = new Date();\n const dateOptions = {\n timeZone: timezone,\n year: 'numeric',\n month: 'numeric',\n day: 'numeric',\n weekday: 'short'\n };\n const timeOptions = {\n timeZone: timezone,\n hour12: false,\n hour: '2-digit',\n minute: '2-digit',\n second: '2-digit'\n };\n \n const dateFormatter = new Intl.DateTimeFormat('zh-CN', dateOptions);\n const timeFormatter = new Intl.DateTimeFormat('zh-CN', timeOptions);\n \n let dateStr = dateFormatter.format(now);\n let timeStr = timeFormatter.format(now);\n \n return { dateStr, timeStr };\n }\n\n \/\/ \u66f4\u65b0\u6240\u6709\u57ce\u5e02\u7684\u65f6\u95f4\u4e0e\u65e5\u671f\n function updateAllClocks() {\n for (let i = 0; i < cities.length; i++) {\n const tz = cities[i].tz;\n try {\n const { dateStr, timeStr } = getFormattedDateTimeByTZ(tz);\n if (dateElements[i]) dateElements[i].textContent = dateStr;\n if (timeElements[i]) timeElements[i].textContent = timeStr;\n } catch (error) {\n console.warn(`\u65f6\u533a ${tz} \u9519\u8bef:`, error);\n if (dateElements[i]) dateElements[i].textContent = '\u65e5\u671f\u65e0\u6548';\n if (timeElements[i]) timeElements[i].textContent = '--:--:--';\n }\n }\n }\n\n \/\/ \u542f\u52a8\u65f6\u949f: \u6784\u5efa\u5361\u7247 + \u7acb\u5373\u66f4\u65b0 + \u6bcf\u79d2\u5b9a\u65f6\u5668\n function initCompactClock() {\n buildCards();\n updateAllClocks();\n setInterval(() => {\n updateAllClocks();\n }, 1000);\n }\n\n initCompactClock();\n<\/script>\n<\/body>\n<\/html>\n\n\n\n<p><\/p>\n","protected":false},"excerpt":{"rendered":"<p>\u5916\u8d38\u4eba\u65f6\u949f\uff0c10\u5ea7\u57ce\u5e02\u4e16\u95f4 \ud83c\udf0d \u5916\u8d38\u8de8\u5883 […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"site-sidebar-layout":"default","site-content-layout":"","ast-site-content-layout":"default","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-5345","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/kc.yixingyule.com\/index.php\/wp-json\/wp\/v2\/pages\/5345","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/kc.yixingyule.com\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/kc.yixingyule.com\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/kc.yixingyule.com\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/kc.yixingyule.com\/index.php\/wp-json\/wp\/v2\/comments?post=5345"}],"version-history":[{"count":5,"href":"https:\/\/kc.yixingyule.com\/index.php\/wp-json\/wp\/v2\/pages\/5345\/revisions"}],"predecessor-version":[{"id":5355,"href":"https:\/\/kc.yixingyule.com\/index.php\/wp-json\/wp\/v2\/pages\/5345\/revisions\/5355"}],"wp:attachment":[{"href":"https:\/\/kc.yixingyule.com\/index.php\/wp-json\/wp\/v2\/media?parent=5345"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}