{"id":437,"date":"2025-04-07T13:21:18","date_gmt":"2025-04-07T05:21:18","guid":{"rendered":"https:\/\/tomhi.cn\/?page_id=437"},"modified":"2025-04-10T02:50:12","modified_gmt":"2025-04-09T18:50:12","slug":"%e6%b5%8b%e8%af%95","status":"publish","type":"page","link":"https:\/\/tomhi.cn\/?page_id=437","title":{"rendered":"\u6d4b\u8bd5"},"content":{"rendered":"\n<!DOCTYPE html>\n<html lang=\"zh-CN\">\n<head>\n    <meta charset=\"UTF-8\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0, maximum-scale=5.0, viewport-fit=cover\">\n    <style>\n        .wp-block-html .personal-page * {\n            box-sizing: border-box !important;\n            margin: 0 !important;\n            padding: 0 !important;\n        }\n\n        :root {\n            --gradient: linear-gradient(45deg, #ff6b6b, #4ecdc4, #45b7d1, #96c93d);\n            --base-font: clamp(1rem, 0.875rem + 0.5vw, 1.125rem);\n        }\n\n        .wp-block-html .personal-page {\n            background: var(--gradient);\n            background-size: 400% 400%;\n            animation: gradientBG 20s ease infinite;\n            min-height: 100vh;\n            color: rgba(255, 255, 255, 0.95);\n            font-size: var(--base-font);\n            line-height: 1.6;\n            -webkit-tap-highlight-color: transparent;\n            padding: 20px 0;\n        }\n\n        @keyframes gradientBG {\n            0% { background-position: 0% 50%; }\n            50% { background-position: 100% 50%; }\n            100% { background-position: 0% 50%; }\n        }\n\n        .personal-container {\n            max-width: min(90%, 1200px) !important;\n            margin: 0 auto !important;\n            padding: clamp(1rem, 3vw, 2rem) !important;\n        }\n\n        .profile-card {\n            background: rgba(255, 255, 255, 0.08) !important;\n            -webkit-backdrop-filter: blur(12px) !important;\n            backdrop-filter: blur(12px) !important;\n            border-radius: clamp(16px, 3vw, 24px) !important;\n            padding: clamp(1.5rem, 4vw, 2.5rem) !important;\n            margin-bottom: 2rem !important;\n            box-shadow: 0 12px 40px rgba(0, 0, 0, 0.15) !important;\n        }\n\n        h1 {\n            text-align: center !important;\n            font-size: clamp(2rem, 5vw, 2.8rem) !important;\n            margin: 1.5rem 0 2rem !important;\n            text-shadow: 2px 2px 6px rgba(0, 0, 0, 0.3) !important;\n            line-height: 1.2 !important;\n        }\n\n        \/* \u65b0\u589e\u5174\u8da3\u7231\u597d\u6837\u5f0f *\/\n        .hobbies-grid {\n            display: grid !important;\n            grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)) !important;\n            gap: 1.5rem !important;\n            margin: 2rem 0 !important;\n        }\n\n        .hobby-item {\n            background: rgba(255, 255, 255, 0.07) !important;\n            padding: 1.5rem !important;\n            border-radius: 12px !important;\n            text-align: center !important;\n            transition: all 0.3s ease !important;\n            min-height: 160px !important;\n            display: flex !important;\n            flex-direction: column !important;\n            justify-content: center !important;\n        }\n\n        .hobby-item i {\n            font-size: 2.8rem !important;\n            margin-bottom: 1rem !important;\n            opacity: 0.9 !important;\n            transition: transform 0.3s ease !important;\n        }\n\n        .hobby-item h3 {\n            font-size: 1.3rem !important;\n            margin-bottom: 0.5rem !important;\n        }\n\n        .hobby-item p {\n            font-size: 0.95rem !important;\n            opacity: 0.85 !important;\n        }\n\n        \/* \u4fdd\u7559\u5176\u4ed6\u539f\u6709\u6837\u5f0f *\/\n        .mbti-box {\n            background: linear-gradient(145deg, rgba(255,255,255,0.12), rgba(255,255,255,0.08)) !important;\n            padding: clamp(1rem, 3vw, 1.5rem) !important;\n            border-radius: 12px !important;\n            text-align: center !important;\n            margin: 1.5rem 0 !important;\n            transition: transform 0.3s ease !important;\n            will-change: transform !important;\n        }\n\n        .mbti-img {\n            width: min(100%, 120px) !important;\n            height: auto !important;\n            margin: 0 auto 1rem !important;\n            filter: drop-shadow(2px 4px 6px rgba(0,0,0,0.15)) !important;\n        }\n\n        .mbti-title {\n            font-size: clamp(1.2rem, 1.5vw, 1.5rem) !important;\n            font-weight: 600 !important;\n            margin-bottom: 0.5rem !important;\n        }\n\n        .mbti-desc {\n            font-size: clamp(0.85rem, 1.1vw, 1rem) !important;\n            opacity: 0.92 !important;\n            line-height: 1.4 !important;\n            max-width: 60ch !important;\n            margin: 0.8rem auto 0 !important;\n        }\n\n        .section-title {\n            font-size: clamp(1.4rem, 2vw, 1.8rem) !important;\n            margin: clamp(1.5rem, 4vw, 2.5rem) 0 1.2rem !important;\n            border-left: 4px solid rgba(255,255,255,0.9) !important;\n            padding-left: clamp(0.8rem, 2vw, 1.2rem) !important;\n            line-height: 1.3 !important;\n        }\n\n        .timeline {\n            position: relative !important;\n            padding: 1rem 0 !important;\n        }\n\n        .timeline-item {\n            background: rgba(255, 255, 255, 0.07) !important;\n            padding: clamp(1rem, 2.5vw, 1.5rem) !important;\n            border-radius: 12px !important;\n            margin: clamp(1rem, 2.5vw, 1.5rem) 0 !important;\n            position: relative !important;\n            transition: all 0.3s ease !important;\n        }\n\n        .about-site {\n            background: rgba(255, 255, 255, 0.07) !important;\n            padding: clamp(1.5rem, 3vw, 2rem) !important;\n            border-radius: 16px !important;\n            margin-top: 2rem !important;\n            line-height: 1.7 !important;\n        }\n\n        .about-site p {\n            margin-bottom: 1rem !important;\n        }\n\n        @media (hover: hover) {\n            .mbti-box:hover {\n                transform: translateY(-3px) !important;\n            }\n            .timeline-item:hover {\n                transform: translateY(-3px) !important;\n                background: rgba(255, 255, 255, 0.1) !important;\n            }\n            .hobby-item:hover {\n                transform: translateY(-5px) !important;\n                background: rgba(255, 255, 255, 0.12) !important;\n            }\n            .hobby-item:hover i {\n                transform: scale(1.15) !important;\n            }\n        }\n\n        @media (max-width: 768px) {\n            .hobbies-grid {\n                grid-template-columns: 1fr !important;\n                gap: 1rem !important;\n            }\n            .hobby-item {\n                padding: 1.25rem !important;\n                min-height: 140px !important;\n            }\n            .hobby-item i {\n                font-size: 2.2rem !important;\n            }\n        }\n    <\/style>\n    <link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.0.0\/css\/all.min.css\">\n<\/head>\n<body class=\"personal-page\">\n    <div class=\"personal-container\">\n        <div class=\"profile-card\">\n            <h1>\u5f20\u5c0f\u660e<\/h1>\n            <div class=\"mbti-box\">\n                <img decoding=\"async\" src=\"https:\/\/www.16personalities.com\/static\/images\/personality-types\/avatars\/infp-mediator.svg\" \n                     alt=\"INFP\u4eba\u683c\" \n                     class=\"mbti-img\">\n                <div class=\"mbti-title\">INFP-T \u8c03\u505c\u8005\u578b<\/div>\n                <div class=\"mbti-desc\">\n                    \u7406\u60f3\u4e3b\u4e49\u7684\u6cbb\u6108\u8005 | \u654f\u611f\u800c\u5bcc\u6709\u521b\u9020\u529b | \u8ffd\u6c42\u7cbe\u795e\u4e16\u754c\u7684\u548c\u8c10\n                <\/div>\n            <\/div>\n\n            <h2 class=\"section-title\">\u81ea\u6211\u4ecb\u7ecd<\/h2>\n            <p>\u5b89\u9759\u800c\u5145\u6ee1\u70ed\u60c5\u7684\u68a6\u60f3\u5bb6\uff0c\u559c\u6b22\u901a\u8fc7\u521b\u610f\u8868\u8fbe\u5185\u5fc3\u4e16\u754c\u3002\u8ffd\u6c42\u6709\u610f\u4e49\u7684\u4eba\u9645\u5173\u7cfb\uff0c\u64c5\u957f\u53d1\u73b0\u751f\u6d3b\u4e2d\u7684\u7f8e\u597d\u7ec6\u8282\uff0c\u59cb\u7ec8\u76f8\u4fe1\u6e29\u67d4\u53ef\u4ee5\u6539\u53d8\u4e16\u754c\u3002<\/p>\n\n            <!-- \u65b0\u589e\u5174\u8da3\u7231\u597d\u533a\u5757 -->\n            <h2 class=\"section-title\">\u5174\u8da3\u7231\u597d<\/h2>\n            <div class=\"hobbies-grid\">\n                <div class=\"hobby-item\">\n                    <i class=\"fas fa-table-tennis-paddle-ball\"><\/i>\n                    <h3>\u4e52\u4e53\u7403<\/h3>\n                    <p>\u56fd\u5bb6\u4e8c\u7ea7\u8fd0\u52a8\u5458\uff0c\u64c5\u957f\u5f27\u5708\u7403\u6253\u6cd5<\/p>\n                <\/div>\n                <div class=\"hobby-item\">\n                    <i class=\"fas fa-hiking\"><\/i>\n                    <h3>\u6237\u5916\u63a2\u9669<\/h3>\n                    <p>\u767b\u5c71\/\u9732\u8425\u7231\u597d\u8005\uff0c\u5f81\u670d\u8fc710\u5ea73000\u7c73+\u5c71\u5cf0<\/p>\n                <\/div>\n                <div class=\"hobby-item\">\n                    <i class=\"fas fa-gamepad\"><\/i>\n                    <h3>Switch\u6e38\u620f<\/h3>\n                    <p>\u585e\u5c14\u8fbe\u4f20\u8bf4\u5168\u7cfb\u5217\u901a\u5173\uff0c\u52a8\u7269\u68ee\u53cb\u4f1a\u5c9b\u5efa\u5927\u5e08<\/p>\n                <\/div>\n            <\/div>\n\n            <h2 class=\"section-title\">\u672a\u6765\u89c4\u5212<\/h2>\n            <div class=\"timeline\">\n                <div class=\"timeline-item\">\n                    <h3>2023-2025 \ud83c\udf31<\/h3>\n                    <p>\u5b8c\u6210\u5fc3\u7406\u5b66\u7855\u58eb\u5b66\u4f4d\uff0c\u5efa\u7acb\u5fc3\u7075\u6210\u957f\u5de5\u4f5c\u5ba4<\/p>\n                <\/div>\n                <div class=\"timeline-item\">\n                    <h3>2025-2028 \ud83c\udfd4\ufe0f<\/h3>\n                    <p>\u5f00\u5c55\u6237\u5916\u5fc3\u7406\u7597\u6108\u9879\u76ee\uff0c\u51fa\u7248\u4e2a\u4eba\u6563\u6587\u96c6<\/p>\n                <\/div>\n                <div class=\"timeline-item\">\n                    <h3>2028+ \u2728<\/h3>\n                    <p>\u521b\u7acb\u81ea\u7136\u7597\u6108\u793e\u533a\uff0c\u63a8\u52a8\u5fc3\u7406\u6559\u80b2\u666e\u53ca<\/p>\n                <\/div>\n            <\/div>\n\n            <h2 class=\"section-title\">\u5173\u4e8e\u672c\u7ad9<\/h2>\n            <div class=\"about-site\">\n                <p>\ud83c\udf08 \u8fd9\u662f\u4e00\u4e2a\u5c55\u793a\u4e2a\u4eba\u7279\u8d28\u4e0e\u6210\u957f\u8f68\u8ff9\u7684\u521b\u610f\u7a7a\u95f4\uff0c\u91c7\u7528\u52a8\u6001\u6e10\u53d8\u8272\u80cc\u666f\u548c\u73b0\u4ee3\u6bdb\u73bb\u7483\u8bbe\u8ba1\u98ce\u683c\u3002\u672c\u7ad9\u6240\u6709\u5185\u5bb9\u5747\u4e3a\u54cd\u5e94\u5f0f\u5e03\u5c40\uff0c\u5b8c\u7f8e\u9002\u914d\u4ece\u624b\u673a\u52304K\u5c4f\u5e55\u7684\u5404\u79cd\u8bbe\u5907\u3002<\/p>\n                <p>\ud83d\udee0\ufe0f \u6280\u672f\u4eae\u70b9\uff1aCSS\u52a8\u6001\u6e10\u53d8\u80cc\u666f \/ \u81ea\u9002\u5e94\u5e03\u5c40\u7cfb\u7edf \/ \u786c\u4ef6\u52a0\u901f\u52a8\u753b \/ \u8de8\u5e73\u53f0\u517c\u5bb9\u8bbe\u8ba1<\/p>\n                <p>\ud83d\udca1 \u8bbe\u8ba1\u7406\u5ff5\uff1a\u901a\u8fc7\u89c6\u89c9\u4ea4\u4e92\u5c55\u73b0\u591a\u7ef4\u4eba\u683c\uff0c\u7528\u6280\u672f\u7f8e\u5b66\u4f20\u9012\u4eba\u6587\u6e29\u5ea6<\/p>\n            <\/div>\n        <\/div>\n    <\/div>\n<\/body>\n<\/html>\n","protected":false},"excerpt":{"rendered":"<p>\u5f20\u5c0f\u660e INFP-T \u8c03\u505c\u8005\u578b \u7406\u60f3\u4e3b\u4e49\u7684\u6cbb\u6108\u8005 | \u654f\u611f\u800c\u5bcc\u6709\u521b\u9020\u529b | \u8ffd\u6c42\u7cbe\u795e\u4e16\u754c\u7684\u548c\u8c10 \u81ea\u6211\u4ecb\u7ecd \u5b89\u9759 [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-437","page","type-page","status-publish","hentry"],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/tomhi.cn\/index.php?rest_route=\/wp\/v2\/pages\/437","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/tomhi.cn\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/tomhi.cn\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/tomhi.cn\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/tomhi.cn\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=437"}],"version-history":[{"count":28,"href":"https:\/\/tomhi.cn\/index.php?rest_route=\/wp\/v2\/pages\/437\/revisions"}],"predecessor-version":[{"id":487,"href":"https:\/\/tomhi.cn\/index.php?rest_route=\/wp\/v2\/pages\/437\/revisions\/487"}],"wp:attachment":[{"href":"https:\/\/tomhi.cn\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=437"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}