{"id":2375,"date":"2023-10-07T09:14:01","date_gmt":"2023-10-07T01:14:01","guid":{"rendered":"https:\/\/bookmark.tw\/?p=2375"},"modified":"2025-08-08T21:11:45","modified_gmt":"2025-08-08T13:11:45","slug":"winter-love","status":"publish","type":"post","link":"https:\/\/xinliceyan.org\/zh\/winter-love","title":{"rendered":"\u7ebf\u4e0a\u514d\u8d39\u5c0f\u6d4b\u9a8c\uff1a\u5c5e\u4e8e\u4f60\u7684\u51ac\u5b63\u7231\u60c5\u604b\u6b4c"},"content":{"rendered":"<style>\n        \/* \u57fa\u7840\u6837\u5f0f - \u8212\u7f13\u7597\u6108\u914d\u8272 *\/\n        .wlq-quiz-container {\n            width: 100%;\n            max-width: 750px;\n            margin: 0 auto;\n            padding: 1.5rem 0.5rem;\n            font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif;\n            --wlq-primary: #7c9885;        \/* \u67d4\u548c\u7684\u7070\u7eff\u8272 *\/\n            --wlq-primary-light: #a8c4b2;  \/* \u6d45\u7070\u7eff\u8272 *\/\n            --wlq-primary-dark: #5a7563;   \/* \u6df1\u7070\u7eff\u8272 *\/\n            --wlq-accent: #e8b4a0;         \/* \u67d4\u548c\u7684\u73ca\u745a\u8272 *\/\n            --wlq-accent-light: #f4d1c3;   \/* \u6d45\u73ca\u745a\u8272 *\/\n            --wlq-secondary: #b8a398;      \/* \u6696\u7070\u68d5\u8272 *\/\n            --wlq-bg-light: #faf9f7;       \/* \u6781\u6d45\u7684\u6696\u767d\u8272 *\/\n            --wlq-text: #4a5551;           \/* \u6df1\u7eff\u7070\u8272\u6587\u5b57 *\/\n            --wlq-text-light: #6d7975;     \/* \u6d45\u7eff\u7070\u8272\u6587\u5b57 *\/\n            --wlq-shadow-sm: 0 2px 8px rgba(124, 152, 133, 0.08);\n            --wlq-shadow-md: 0 4px 16px rgba(124, 152, 133, 0.12);\n            --wlq-shadow-lg: 0 8px 24px rgba(124, 152, 133, 0.15);\n            --wlq-gradient: linear-gradient(135deg, var(--wlq-primary) 0%, var(--wlq-primary-light) 100%);\n            color: var(--wlq-text);\n            position: relative;\n            border-radius: 20px;\n            overflow: hidden;\n        }\n\n        * {\n            box-sizing: border-box;\n        }\n\n        .wlq-page {\n            min-height: 60vh;\n            display: flex;\n            flex-direction: column;\n            justify-content: center;\n            padding: 1.5rem;\n            animation: fadeIn 0.5s ease;\n        }\n\n        @keyframes fadeIn {\n            from { opacity: 0; transform: translateY(10px); }\n            to { opacity: 1; transform: translateY(0); }\n        }\n\n        \/* \u6807\u9898\u6837\u5f0f *\/\n        .wlq-title {\n            font-size: 2rem;\n            font-weight: 700;\n            text-align: center;\n            margin-bottom: 2rem;\n            background: var(--wlq-gradient);\n            -webkit-background-clip: text;\n            background-clip: text;\n            color: transparent;\n            position: relative;\n        }\n\n        .wlq-title::after {\n            content: \"\";\n            display: block;\n            width: 60px;\n            height: 3px;\n            background: var(--wlq-gradient);\n            border-radius: 2px;\n            margin: 0.8rem auto 0;\n        }\n\n        \/* \u6309\u94ae\u6837\u5f0f *\/\n        .wlq-btn {\n            min-width: 160px;\n            min-height: 48px;\n            padding: 0.75rem 2rem;\n            font-size: 1rem;\n            font-weight: 600;\n            text-align: center;\n            color: white;\n            background: var(--wlq-gradient);\n            border: none;\n            border-radius: 24px;\n            cursor: pointer;\n            transition: all 0.3s ease;\n            box-shadow: var(--wlq-shadow-md);\n            margin: 0.5rem;\n            display: inline-block;\n        }\n\n        .wlq-btn:hover {\n            transform: translateY(-2px);\n            box-shadow: var(--wlq-shadow-lg);\n        }\n\n        .wlq-btn:active {\n            transform: translateY(0);\n        }\n\n        .wlq-btn-secondary {\n            background: white;\n            color: var(--wlq-primary);\n            border: 2px solid var(--wlq-primary-light);\n        }\n\n        .wlq-btn-secondary:hover {\n            background: var(--wlq-bg-light);\n            border-color: var(--wlq-primary);\n        }\n\n        \/* \u5f15\u5bfc\u9875\u6837\u5f0f *\/\n        .wlq-intro-content {\n            text-align: center;\n            max-width: 100%;\n        }\n\n        .wlq-intro-icons {\n            display: flex;\n            justify-content: center;\n            flex-wrap: wrap;\n            gap: 1.5rem;\n            margin: 2rem 0;\n        }\n\n        .wlq-icon {\n            display: flex;\n            flex-direction: column;\n            align-items: center;\n            gap: 0.5rem;\n        }\n\n        .wlq-icon-circle {\n            width: 70px;\n            height: 70px;\n            border-radius: 50%;\n            background: white;\n            display: flex;\n            align-items: center;\n            justify-content: center;\n            box-shadow: var(--wlq-shadow-md);\n            color: var(--wlq-primary);\n            transition: all 0.3s ease;\n        }\n\n        .wlq-icon:hover .wlq-icon-circle {\n            transform: translateY(-5px) scale(1.05);\n            box-shadow: var(--wlq-shadow-lg);\n            background: var(--wlq-bg-light);\n        }\n\n        .wlq-icon span {\n            font-size: 0.95rem;\n            font-weight: 600;\n            color: var(--wlq-text);\n        }\n\n        .wlq-intro-text {\n            background: white;\n            padding: 1.5rem;\n            border-radius: 16px;\n            margin: 2rem 0;\n            box-shadow: var(--wlq-shadow-sm);\n        }\n\n        .wlq-intro-text p {\n            font-size: 1.1rem;\n            line-height: 1.7;\n            margin: 0;\n            color: var(--wlq-text);\n        }\n\n        \/* \u6d4b\u9a8c\u9875\u6837\u5f0f *\/\n        .wlq-quiz-content {\n            width: 100%;\n        }\n\n        .wlq-question {\n            background: white;\n            padding: 1.5rem;\n            border-radius: 16px;\n            margin-bottom: 1.5rem;\n            box-shadow: var(--wlq-shadow-sm);\n        }\n\n        .wlq-question h3 {\n            font-size: 22px;\n            font-weight: bold;\n            margin: 0 0 1.5rem 0;\n            color: var(--wlq-text);\n            line-height: 1.5;\n        }\n\n        \/* Bootstrap\u5361\u7247\u98ce\u683c\u9009\u9879 *\/\n        .wlq-options {\n            display: flex;\n            flex-direction: column;\n            gap: 1rem;\n        }\n\n        .wlq-option-card {\n            position: relative;\n            background: white;\n            border: 2px solid #e8e8e8;\n            border-radius: 12px;\n            padding: 1.2rem 1.2rem 1.2rem 3.5rem;\n            cursor: pointer;\n            transition: all 0.3s ease;\n            box-shadow: 0 2px 6px rgba(0, 0, 0, 0.04);\n            min-height: 70px;\n            display: flex;\n            align-items: center;\n        }\n\n        .wlq-option-card:hover {\n            border-color: var(--wlq-primary-light);\n            box-shadow: var(--wlq-shadow-md);\n            transform: translateX(3px);\n            background: var(--wlq-bg-light);\n        }\n\n        .wlq-option-card.selected {\n            border-color: var(--wlq-primary);\n            background: linear-gradient(to right, rgba(124, 152, 133, 0.05), rgba(124, 152, 133, 0.02));\n            box-shadow: var(--wlq-shadow-md);\n        }\n\n        \/* \u5706\u5f62\u9009\u62e9\u6307\u793a\u5668 *\/\n        .wlq-option-indicator {\n            position: absolute;\n            left: 1rem;\n            top: 50%;\n            transform: translateY(-50%);\n            width: 24px;\n            height: 24px;\n            border-radius: 50%;\n            border: 2px solid #d0d0d0;\n            background: white;\n            display: flex;\n            align-items: center;\n            justify-content: center;\n            transition: all 0.3s ease;\n        }\n\n        .wlq-option-card:hover .wlq-option-indicator {\n            border-color: var(--wlq-primary-light);\n        }\n\n        .wlq-option-card.selected .wlq-option-indicator {\n            border-color: var(--wlq-primary);\n            background: var(--wlq-primary);\n        }\n\n        \/* \u52fe\u53f7\u56fe\u6807 *\/\n        .wlq-option-indicator::after {\n            content: '';\n            position: absolute;\n            width: 6px;\n            height: 10px;\n            border: solid white;\n            border-width: 0 2px 2px 0;\n            transform: rotate(45deg) scale(0);\n            transition: transform 0.3s ease;\n        }\n\n        .wlq-option-card.selected .wlq-option-indicator::after {\n            transform: rotate(45deg) scale(1);\n        }\n\n        .wlq-option-text {\n            font-size: 18px;\n            color: var(--wlq-text);\n            line-height: 1.4;\n            font-weight: 500;\n        }\n\n        .wlq-option-card:hover .wlq-option-text {\n            color: var(--wlq-primary-dark);\n        }\n\n        .wlq-option-card.selected .wlq-option-text {\n            color: var(--wlq-primary-dark);\n            font-weight: 600;\n        }\n\n        \/* \u5bfc\u822a\u6309\u94ae *\/\n        .wlq-nav-buttons {\n            display: flex;\n            justify-content: center;\n            margin-top: 1.5rem;\n        }\n\n        \/* \u7ed3\u679c\u9875\u6837\u5f0f *\/\n        .wlq-result-content {\n            width: 100%;\n        }\n\n        \/* \u6a2a\u5411\u5806\u53e0\u6761\u5f62\u56fe\u5bb9\u5668 *\/\n        .wlq-result-chart {\n            background: white;\n            padding: 2rem 1.5rem;\n            border-radius: 16px;\n            margin-bottom: 1.5rem;\n            box-shadow: var(--wlq-shadow-sm);\n        }\n\n        .wlq-chart-title {\n            font-size: 1.2rem;\n            font-weight: 600;\n            color: var(--wlq-text);\n            margin-bottom: 1rem;\n            text-align: center;\n        }\n\n        \/* \u6a2a\u5411\u5806\u53e0\u6761\u5f62\u56fe *\/\n        .wlq-score-bar {\n            position: relative;\n            height: 50px;\n            background: linear-gradient(to right, \n                #e8b4a0 0%, #e8b4a0 20%,\n                #f4d1c3 20%, #f4d1c3 40%,\n                #a8c4b2 40%, #a8c4b2 60%,\n                #7c9885 60%, #7c9885 80%,\n                #5a7563 80%, #5a7563 100%\n            );\n            border-radius: 25px;\n            box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.1);\n            margin: 1.5rem 0;\n            overflow: visible;\n        }\n\n        \/* \u7528\u6237\u4f4d\u7f6e\u6807\u8bb0 *\/\n        .wlq-user-marker {\n            position: absolute;\n            top: 50%;\n            transform: translate(-50%, -50%);\n            width: 16px;\n            height: 16px;\n            background: #ff6b6b;\n            border: 3px solid white;\n            border-radius: 50%;\n            box-shadow: 0 2px 8px rgba(255, 107, 107, 0.4);\n            z-index: 10;\n            transition: left 1s ease-out;\n        }\n\n        \/* \u5206\u6570\u6807\u7b7e *\/\n        .wlq-user-score-label {\n            position: absolute;\n            top: -30px;\n            transform: translateX(-50%);\n            background: var(--wlq-primary);\n            color: white;\n            padding: 4px 10px;\n            border-radius: 20px;\n            font-size: 0.9rem;\n            font-weight: 600;\n            white-space: nowrap;\n            box-shadow: var(--wlq-shadow-md);\n        }\n\n        \/* \u56fe\u4f8b *\/\n        .wlq-legend {\n            display: flex;\n            flex-wrap: wrap;\n            justify-content: center;\n            gap: 1rem;\n            margin-top: 1.5rem;\n        }\n\n        .wlq-legend-item {\n            display: flex;\n            align-items: center;\n            gap: 0.3rem;\n            font-size: 0.85rem;\n            color: var(--wlq-text-light);\n        }\n\n        .wlq-legend-color {\n            width: 20px;\n            height: 12px;\n            border-radius: 3px;\n        }\n\n        \/* \u7ed3\u679c\u6587\u672c *\/\n        #wlq-result-text {\n            background: white;\n            padding: 1.5rem;\n            border-radius: 16px;\n            margin-bottom: 1.5rem;\n            box-shadow: var(--wlq-shadow-sm);\n        }\n\n        #wlq-result-text h3 {\n            font-size: 1.5rem;\n            font-weight: 700;\n            margin: 0 0 1rem 0;\n            color: var(--wlq-primary);\n            text-align: center;\n        }\n\n        #wlq-result-text p {\n            font-size: 1.1rem;\n            line-height: 1.7;\n            margin: 0 0 1rem 0;\n            color: var(--wlq-text);\n        }\n\n        .wlq-result-dimension {\n            margin-bottom: 1.2rem;\n            padding-bottom: 1.2rem;\n            border-bottom: 1px solid #f0f0f0;\n        }\n\n        .wlq-result-dimension:last-child {\n            border-bottom: none;\n        }\n\n        .wlq-dimension-title {\n            font-size: 1.1rem;\n            font-weight: 600;\n            margin-bottom: 0.5rem;\n            display: flex;\n            justify-content: space-between;\n            align-items: center;\n            color: var(--wlq-text);\n        }\n\n        .wlq-dimension-score {\n            font-size: 1rem;\n            font-weight: 700;\n            color: var(--wlq-primary);\n        }\n\n        .wlq-dimension-bar {\n            height: 8px;\n            border-radius: 4px;\n            background: #f0f0f0;\n            overflow: hidden;\n            position: relative;\n        }\n\n        .wlq-dimension-fill {\n            height: 100%;\n            background: var(--wlq-gradient);\n            border-radius: 4px;\n            transition: width 1s ease-out;\n        }\n\n        \/* \u54cd\u5e94\u5f0f\u8bbe\u8ba1 *\/\n        @media (max-width: 640px) {\n            .wlq-quiz-container {\n                padding: 1rem 0.5rem;\n            }\n            \n            .wlq-page {\n                padding: 1rem;\n            }\n            \n            .wlq-title {\n                font-size: 1.7rem;\n            }\n            \n            .wlq-question h3 {\n                font-size: 20px;\n            }\n            \n            .wlq-option-text {\n                font-size: 16px;\n            }\n            \n            .wlq-option-card {\n                padding: 1rem 1rem 1rem 3rem;\n                min-height: 60px;\n            }\n            \n            .wlq-legend {\n                gap: 0.5rem;\n            }\n            \n            .wlq-legend-item {\n                font-size: 0.75rem;\n            }\n        }\n    <\/style>\n\n    <div id=\"wlq-container\" class=\"wlq-quiz-container\">\n        <!-- \u5f15\u5bfc\u9875 -->\n        <div id=\"wlq-intro\" class=\"wlq-page\">\n            <div class=\"wlq-intro-content\">\n                <h2 class=\"wlq-title\">\u5c5e\u4e8e\u4f60\u7684\u51ac\u5b63\u7231\u60c5\u604b\u6b4c<\/h2>\n                <div class=\"wlq-intro-icons\">\n                    <div class=\"wlq-icon\">\n                        <div class=\"wlq-icon-circle\">\n                            <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewbox=\"0 0 24 24\" width=\"32\" height=\"32\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n                                <path d=\"M19 14c1.49-1.46 3-3.21 3-5.5A5.5 5.5 0 0 0 16.5 3c-1.76 0-3 .5-4.5 2-1.5-1.5-2.74-2-4.5-2A5.5 5.5 0 0 0 2 8.5c0 2.3 1.5 4.05 3 5.5l7 7Z\"\/>\n                            <\/svg>\n                        <\/div>\n                        <span>\u5fc3\u52a8\u6d4b\u8bd5<\/span>\n                    <\/div>\n                    <div class=\"wlq-icon\">\n                        <div class=\"wlq-icon-circle\">\n                            <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewbox=\"0 0 24 24\" width=\"32\" height=\"32\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n                                <path d=\"M3 9h18v10a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V9Z\"\/>\n                                <path d=\"m3 9 2.45-4.9A2 2 0 0 1 7.24 3h9.52a2 2 0 0 1 1.8 1.1L21 9\"\/>\n                                <path d=\"M12 3v6\"\/>\n                            <\/svg>\n                        <\/div>\n                        <span>\u4e13\u4e1a\u5206\u6790<\/span>\n                    <\/div>\n                    <div class=\"wlq-icon\">\n                        <div class=\"wlq-icon-circle\">\n                            <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewbox=\"0 0 24 24\" width=\"32\" height=\"32\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n                                <path d=\"M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z\"\/>\n                            <\/svg>\n                        <\/div>\n                        <span>\u51ac\u5b63\u604b\u60c5<\/span>\n                    <\/div>\n                <\/div>\n                <div class=\"wlq-intro-text\">\n                    <p>\u65f6\u503c\u51ac\u5b63\uff0c\u5929\u6c14\u8d8a\u6765\u8d8a\u51b7\uff0c\u5355\u8eab\u6c6a\u770b\u5230\u6709\u4f34\u4fa3\u7684\u4eba\u53ef\u4ee5\u548c\u53e6\u4e00\u534a\u51fa\u53cc\u5165\u5bf9\uff0c\u90a3\u79cd\u5fc3\u51c9\u7684\u611f\u89c9\u6bd4\u5bd2\u51b7\u7684\u6c14\u6e29\u66f4\u96be\u5fcd\u53d7\u3002\u770b\u6765\u8fdb\u5165\u51ac\u5b63\uff0c\u6211\u4eec\u4f1a\u6bd4\u4efb\u4f55\u4e00\u4e2a\u5b63\u8282\u66f4\u9700\u8981\u7231\u60c5\u3002\u60f3\u77e5\u9053\u5c5e\u4e8e\u4f60\u7684\u51ac\u5b63\u604b\u6b4c\u662f\u4ec0\u4e48\u5417\uff1f\u8ba9\u6d4b\u8bd5\u4e3a\u4f60\u63ed\u6653\u7b54\u6848\u5427\u3002<\/p>\n                <\/div>\n                <button id=\"wlq-start-btn\" class=\"wlq-btn\">\u7acb\u5373\u6d4b\u9a8c<\/button>\n            <\/div>\n        <\/div>\n\n        <!-- \u6d4b\u9a8c\u9875 -->\n        <div id=\"wlq-quiz\" class=\"wlq-page\" style=\"display: none;\">\n            <div class=\"wlq-quiz-content\">\n                <h2 class=\"wlq-title\">\u51ac\u5b63\u604b\u6b4c\u6d4b\u9a8c<\/h2>\n                <div id=\"wlq-questions\"><\/div>\n                <div class=\"wlq-nav-buttons\">\n                    <button id=\"wlq-prev-btn\" class=\"wlq-btn wlq-btn-secondary\" style=\"display: none;\">\u4e0a\u4e00\u9898<\/button>\n                <\/div>\n            <\/div>\n        <\/div>\n\n        <!-- \u7ed3\u679c\u9875 -->\n        <div id=\"wlq-result\" class=\"wlq-page\" style=\"display: none;\">\n            <div class=\"wlq-result-content\">\n                <h2 class=\"wlq-title\">\u4f60\u7684\u51ac\u5b63\u604b\u6b4c<\/h2>\n                <div class=\"wlq-result-chart\">\n                    <div class=\"wlq-chart-title\">\u4f60\u5728\u7231\u60c5\u5149\u8c31\u4e2d\u7684\u4f4d\u7f6e<\/div>\n                    <div class=\"wlq-score-bar\">\n                        <div class=\"wlq-user-marker\" id=\"wlq-user-marker\">\n                            <div class=\"wlq-user-score-label\" id=\"wlq-user-score-label\">\u4f60\u7684\u4f4d\u7f6e<\/div>\n                        <\/div>\n                    <\/div>\n                    <div class=\"wlq-legend\">\n                        <div class=\"wlq-legend-item\">\n                            <div class=\"wlq-legend-color\" style=\"background: #e8b4a0;\"><\/div>\n                            <span>\u521d\u604b\u578b (0-20)<\/span>\n                        <\/div>\n                        <div class=\"wlq-legend-item\">\n                            <div class=\"wlq-legend-color\" style=\"background: #f4d1c3;\"><\/div>\n                            <span>\u6d6a\u6f2b\u578b (21-40)<\/span>\n                        <\/div>\n                        <div class=\"wlq-legend-item\">\n                            <div class=\"wlq-legend-color\" style=\"background: #a8c4b2;\"><\/div>\n                            <span>\u5e73\u8861\u578b (41-60)<\/span>\n                        <\/div>\n                        <div class=\"wlq-legend-item\">\n                            <div class=\"wlq-legend-color\" style=\"background: #7c9885;\"><\/div>\n                            <span>\u6210\u719f\u578b (61-80)<\/span>\n                        <\/div>\n                        <div class=\"wlq-legend-item\">\n                            <div class=\"wlq-legend-color\" style=\"background: #5a7563;\"><\/div>\n                            <span>\u667a\u6167\u578b (81-100)<\/span>\n                        <\/div>\n                    <\/div>\n                <\/div>\n                <div id=\"wlq-result-text\"><\/div>\n                <div style=\"display: flex; justify-content: center;\">\n  <button id=\"wlq-restart-btn\" class=\"wlq-btn\">\u91cd\u65b0\u6d4b\u9a8c<\/button>\n<\/div>\n            <\/div>\n        <\/div>\n    <\/div>\n\n    <script>\n    (function() {\n        const WinterLoveQuiz = {\n            questions: [\n                {\n                    id: 1,\n                    text: \"\u4f60\u53ef\u4ee5\u5f97\u5230\u4e00\u6b21\u65c5\u884c\u7684\u673a\u4f1a\uff0c\u65c5\u884c\u7684\u65e5\u5b50\u5fc5\u987b\u5b9a\u4e3a\u5723\u8bde\u8282\u524d\u5915\u3002\u6709\u4ee5\u4e0b\u56db\u4e2a\u6d77\u5916\u65c5\u884c\u5730\u53ef\u4f9b\u4f60\u9009\u62e9\uff0c\u4f60\u4f1a\u9009\u54ea\u4e00\u4e2a\uff1f\",\n                    options: [\n                        { id: \"A\", text: \"\u51b0\u5c9b\" },\n                        { id: \"B\", text: \"\u65e5\u672c\" },\n                        { id: \"C\", text: \"\u6cf0\u56fd\" },\n                        { id: \"D\", text: \"\u7f8e\u56fd\" }\n                    ]\n                },\n                {\n                    id: 2,\n                    text: \"\u5f53\u4f60\u72ec\u81ea\u4e00\u4eba\u5728\u5bb6\uff0c\u6700\u559c\u6b22\u505a\u4ec0\u4e48\u4e8b\u60c5\u6765\u6253\u53d1\u65f6\u95f4\uff1f\",\n                    options: [\n                        { id: \"A\", text: \"\u9605\u8bfb\u4e00\u672c\u597d\u4e66\u6216\u6b23\u8d4f\u827a\u672f\u4f5c\u54c1\" },\n                        { id: \"B\", text: \"\u6574\u7406\u623f\u95f4\u6216\u505a\u4e00\u4e9b\u5c0f\u624b\u5de5\" },\n                        { id: \"C\", text: \"\u770b\u7535\u5f71\u6216\u8ffd\u5267\" },\n                        { id: \"D\", text: \"\u73a9\u6e38\u620f\u6216\u5c1d\u8bd5\u65b0\u7684\u5e94\u7528\u7a0b\u5f0f\" }\n                    ]\n                },\n                {\n                    id: 3,\n                    text: \"\u5982\u679c\u4f60\u9700\u8981\u9001\u4e00\u4efd\u793c\u7269\u7ed9\u5fc3\u4eea\u7684\u5bf9\u8c61\uff0c\u4f60\u4f1a\u9009\u62e9\u4ec0\u4e48\uff1f\",\n                    options: [\n                        { id: \"A\", text: \"\u4e00\u5c01\u624b\u5199\u7684\u4fe1\u6216\u4e00\u9996\u8bd7\" },\n                        { id: \"B\", text: \"\u4eb2\u624b\u505a\u7684\u5c0f\u793c\u7269\" },\n                        { id: \"C\", text: \"\u4e00\u675f\u9c9c\u82b1\u6216\u5de7\u514b\u529b\" },\n                        { id: \"D\", text: \"\u6700\u65b0\u7684\u7535\u5b50\u4ea7\u54c1\u6216\u65f6\u5c1a\u5355\u54c1\" }\n                    ]\n                },\n                {\n                    id: 4,\n                    text: \"\u4f60\u8ba4\u4e3a\u7406\u60f3\u7684\u7ea6\u4f1a\u573a\u6240\u662f\uff1f\",\n                    options: [\n                        { id: \"A\", text: \"\u5b89\u9759\u7684\u5496\u5561\u9986\u6216\u827a\u672f\u5c55\u89c8\" },\n                        { id: \"B\", text: \"\u6e29\u99a8\u7684\u5bb6\u5ead\u5f0f\u9910\u5385\" },\n                        { id: \"C\", text: \"\u70ed\u95f9\u7684\u6d3e\u5bf9\u6216\u97f3\u4e50\u4f1a\" },\n                        { id: \"D\", text: \"\u4e3b\u9898\u4e50\u56ed\u6216\u65b0\u5f00\u7684\u6f6e\u5e97\" }\n                    ]\n                },\n                {\n                    id: 5,\n                    text: \"\u5728\u611f\u60c5\u4e2d\uff0c\u4f60\u6700\u91cd\u89c6\u54ea\u4e00\u70b9\uff1f\",\n                    options: [\n                        { id: \"A\", text: \"\u5185\u5728\u7684\u7cbe\u795e\u5951\u5408\" },\n                        { id: \"B\", text: \"\u5f7c\u6b64\u7684\u7406\u89e3\u4e0e\u5173\u6000\" },\n                        { id: \"C\", text: \"\u6fc0\u60c5\u4e0e\u6d6a\u6f2b\" },\n                        { id: \"D\", text: \"\u5171\u540c\u7684\u5174\u8da3\u4e0e\u65b0\u9c9c\u611f\" }\n                    ]\n                }\n            ],\n\n            results: {\n                A: {\n                    title: \"\u6e05\u51b7\u552f\u7f8e\u7684\u51ac\u5b63\u604b\u6b4c\",\n                    content: \"\u4e00\u6bb5\u82e5\u6709\u4f3c\u65e0\u7684\u611f\u60c5\u6253\u52a8\u4e86\u4f60\u7684\u5fc3\uff0c\u4f60\u4f1a\u9047\u5230\u4e00\u4e2a\u503e\u6155\u4f60\uff0c\u4f46\u5374\u4e0d\u4f1a\u7ea0\u7f20\u4f60\uff0c\u559c\u6b22\u4f60\uff0c\u4f46\u5374\u4e0d\u4f1a\u82db\u6c42\u4f60\u56de\u5e94\u7684\u4eba\u3002\u4f60\u5f88\u6b23\u8d4f\u5bf9\u65b9\u8eab\u4e0a\u7684\u4f18\u70b9\uff0c\u4f46\u4e0d\u662f\u4e00\u4e2a\u5f88\u63a5\u5730\u6c14\u7684\u4eba\uff0c\u5728\u5bf9\u65b9\u773c\u4e2d\u91cc\uff0c\u4f60\u4ea6\u662f\u5982\u6b64\uff0c\u6240\u4ee5\u4f60\u4eec\u7684\u5173\u7cfb\u4f1a\u53d1\u5c55\u5f97\u975e\u5e38\u7f13\u6162\uff0c\u53cc\u65b9\u90fd\u4e0d\u4f1a\u5168\u901f\u63a5\u8fd1\u5bf9\u65b9\uff0c\u76f8\u7231\u7684\u8282\u594f\u7279\u522b\u6162\u3002\",\n                    dimensions: {\n                        \"\u7cbe\u795e\u5951\u5408\u5ea6\": 90,\n                        \"\u60c5\u611f\u8868\u8fbe\": 50,\n                        \"\u6d6a\u6f2b\u6307\u6570\": 65,\n                        \"\u76f8\u5904\u9ed8\u5951\": 75,\n                        \"\u957f\u4e45\u7a33\u5b9a\": 85\n                    },\n                    score: 85\n                },\n                B: {\n                    title: \"\u7ec6\u817b\u6e29\u99a8\u7684\u51ac\u5b63\u604b\u6b4c\",\n                    content: \"\u4f60\u4f1a\u9047\u5230\u4e00\u4e2a\u975e\u5e38\u4e86\u89e3\u4f60\u7684\u4eba\uff0c\u5bf9\u65b9\u751a\u81f3\u80fd\u591f\u8bfb\u61c2\u4f60\u7684\u773c\u795e\uff0cTA\u53ef\u4ee5\u8fc7\u4e00\u4e9b\u7ec6\u8282\u63a2\u6d4b\u5230\u4f60\u7684\u5185\u5fc3\u4e16\u754c\uff0c\u800c\u5bf9\u65b9\u7684\u4e00\u8a00\u4e00\u884c\uff0c\u4e5f\u4ee4\u4f60\u975e\u5e38\u611f\u52a8\uff0c\u6ca1\u6709\u60ca\u5929\u52a8\u5730\u7684\u6545\u4e8b\uff0c\u53ea\u6709\u7ec6\u817b\u7684\u5173\u6000\uff0c\u8fd9\u5bf9\u4f60\u6765\u8bf4\u5df2\u7ecf\u8db3\u591f\u4e86\u3002\u4e0e\u5bf9\u65b9\u5728\u4e00\u8d77\u7684\u6bcf\u4e00\u4e2a\u77ac\u95f4\uff0c\u90fd\u4ee4\u4f60\u7684\u5185\u5fc3\u611f\u5230\u5e73\u9759\u800c\u6e29\u6696\u3002\",\n                    dimensions: {\n                        \"\u7cbe\u795e\u5951\u5408\u5ea6\": 80,\n                        \"\u60c5\u611f\u8868\u8fbe\": 75,\n                        \"\u6d6a\u6f2b\u6307\u6570\": 70,\n                        \"\u76f8\u5904\u9ed8\u5951\": 95,\n                        \"\u957f\u4e45\u7a33\u5b9a\": 90\n                    },\n                    score: 72\n                },\n                C: {\n                    title: \"\u70ed\u60c5\u4f3c\u706b\u7684\u51ac\u5b63\u604b\u6b4c\",\n                    content: \"\u867d\u7136\u51ac\u5b63\u6c14\u6e29\u4f4e\uff0c\u4f46\u7231\u60c5\u5374\u7ed9\u4f60\u5e26\u6765\u4e00\u4efd\u706b\u70ed\u7684\u60c5\u7eea\uff0c\u8d77\u4f0f\u7684\u5fc3\u60c5\u597d\u50cf\u8fc7\u5c71\u8f66\u4e00\u6837\u523a\u6fc0\uff0c\u4e24\u4eba\u4e4b\u95f4\u7684\u70bd\u70c8\u611f\u60c5\uff0c\u4eff\u4f5b\u4e00\u56e2\u718a\u718a\u71c3\u70e7\u7684\u70c8\u706b\uff0c\u53ef\u4ee5\u70b9\u4eae\u6574\u4e2a\u51ac\u5929\u3002\u521a\u5f00\u59cb\u604b\u7231\uff0c\u6240\u6709\u4eba\u5c31\u77e5\u9053\u53d1\u751f\u5728\u4f60\u8eab\u4e0a\u7684\u597d\u6d88\u606f\u4e86\uff0c\u56e0\u4e3a\u4f60\u6ee1\u8138\u5199\u7740\u300c\u70ed\u604b\u52ff\u6270\u300d\u56db\u4e2a\u5b57\uff0c\u9664\u4e86\u7231\u60c5\u4ee5\u5916\uff0c\u597d\u50cf\u6240\u6709\u4e8b\u90fd\u548c\u4f60\u65e0\u5173\u3002\",\n                    dimensions: {\n                        \"\u7cbe\u795e\u5951\u5408\u5ea6\": 65,\n                        \"\u60c5\u611f\u8868\u8fbe\": 95,\n                        \"\u6d6a\u6f2b\u6307\u6570\": 90,\n                        \"\u76f8\u5904\u9ed8\u5951\": 70,\n                        \"\u957f\u4e45\u7a33\u5b9a\": 60\n                    },\n                    score: 45\n                },\n                D: {\n                    title: \"\u65f6\u5c1a\u7f24\u7eb7\u7684\u51ac\u5b63\u604b\u6b4c\",\n                    content: \"\u53e6\u4e00\u534a\u4f1a\u6253\u5f00\u4f60\u65b0\u4e16\u754c\u7684\u5927\u95e8\uff0c\u8ba9\u4f60\u770b\u5230\u4e0d\u4e00\u6837\u7684\u751f\u6d3b\uff0c\u76f8\u7231\u7684\u6bcf\u4e00\u5929\u90fd\u662f\u7cbe\u5f69\u7684\uff0c\u548c\u5bf9\u65b9\u5728\u4e00\u8d77\uff0c\u4f60\u8fc7\u5f97\u5f88\u5f00\u5fc3\uff0c\u751f\u6d3b\u4e0d\u518d\u65e0\u804a\u4e4f\u5473\uff0c\u6bcf\u5929\u90fd\u975e\u5e38\u5fd9\u788c\uff0c\u4f60\u628a\u5bf9\u65b9\u5f53\u6210\u5076\u50cf\u770b\u5f85\uff0c\u5e0c\u671b\u627e\u5230\u4e24\u4eba\u4e4b\u95f4\u7684\u5171\u540c\u70b9\uff0c\u5bf9\u65b9\u7684\u5174\u8da3\u5c31\u662f\u4f60\u7684\u5174\u8da3\uff0c\u5bf9\u65b9\u7684\u51fa\u73b0\u8ba9\u4f60\u7684\u4eba\u751f\u66f4\u52a0\u5145\u5b9e\u3001\u4e30\u6ee1\u3002\",\n                    dimensions: {\n                        \"\u7cbe\u795e\u5951\u5408\u5ea6\": 70,\n                        \"\u60c5\u611f\u8868\u8fbe\": 80,\n                        \"\u6d6a\u6f2b\u6307\u6570\": 85,\n                        \"\u76f8\u5904\u9ed8\u5951\": 80,\n                        \"\u957f\u4e45\u7a33\u5b9a\": 65\n                    },\n                    score: 58\n                }\n            },\n\n            state: {\n                currentQuestion: 0,\n                answers: [],\n                resultType: null\n            },\n\n            init: function() {\n                document.getElementById('wlq-start-btn').addEventListener('click', this.startQuiz.bind(this));\n                document.getElementById('wlq-prev-btn').addEventListener('click', this.prevQuestion.bind(this));\n                document.getElementById('wlq-restart-btn').addEventListener('click', this.restartQuiz.bind(this));\n            },\n\n            startQuiz: function() {\n                document.getElementById('wlq-intro').style.display = 'none';\n                document.getElementById('wlq-quiz').style.display = 'flex';\n                this.renderQuestion();\n                this.scrollToTop();\n            },\n\n            renderQuestion: function() {\n                const questionContainer = document.getElementById('wlq-questions');\n                questionContainer.innerHTML = '';\n\n                const currentQ = this.questions[this.state.currentQuestion];\n                \n                const questionElement = document.createElement('div');\n                questionElement.className = 'wlq-question';\n                \n                const questionTitle = document.createElement('h3');\n                questionTitle.textContent = `${this.state.currentQuestion + 1}. ${currentQ.text}`;\n                questionElement.appendChild(questionTitle);\n                \n                const optionsContainer = document.createElement('div');\n                optionsContainer.className = 'wlq-options';\n                \n                currentQ.options.forEach(option => {\n                    const optionCard = document.createElement('div');\n                    optionCard.className = 'wlq-option-card';\n                    optionCard.dataset.optionId = option.id;\n                    \n                    if (this.state.answers[this.state.currentQuestion] === option.id) {\n                        optionCard.classList.add('selected');\n                    }\n                    \n                    const indicator = document.createElement('div');\n                    indicator.className = 'wlq-option-indicator';\n                    \n                    const optionText = document.createElement('span');\n                    optionText.className = 'wlq-option-text';\n                    optionText.textContent = `${option.id}\u3001${option.text}`;\n                    \n                    optionCard.appendChild(indicator);\n                    optionCard.appendChild(optionText);\n                    optionCard.addEventListener('click', () => this.selectOption(option.id));\n                    optionsContainer.appendChild(optionCard);\n                });\n                \n                questionElement.appendChild(optionsContainer);\n                questionContainer.appendChild(questionElement);\n                \n                const prevButton = document.getElementById('wlq-prev-btn');\n                prevButton.style.display = this.state.currentQuestion > 0 ? 'inline-block' : 'none';\n            },\n\n            selectOption: function(optionId) {\n                this.state.answers[this.state.currentQuestion] = optionId;\n                \n                const options = document.querySelectorAll('.wlq-option-card');\n                options.forEach(option => {\n                    if (option.dataset.optionId === optionId) {\n                        option.classList.add('selected');\n                    } else {\n                        option.classList.remove('selected');\n                    }\n                });\n                \n                setTimeout(() => {\n                    if (this.state.currentQuestion === this.questions.length - 1) {\n                        this.calculateResult();\n                    } else {\n                        this.state.currentQuestion++;\n                        this.renderQuestion();\n                    }\n                }, 300);\n            },\n\n            prevQuestion: function() {\n                if (this.state.currentQuestion > 0) {\n                    this.state.currentQuestion--;\n                    this.renderQuestion();\n                }\n            },\n\n            calculateResult: function() {\n                const counts = { A: 0, B: 0, C: 0, D: 0 };\n                \n                this.state.answers.forEach(answer => {\n                    counts[answer]++;\n                });\n                \n                let maxCount = 0;\n                let maxType = 'A';\n                \n                for (const type in counts) {\n                    if (counts[type] > maxCount) {\n                        maxCount = counts[type];\n                        maxType = type;\n                    }\n                }\n                \n                this.state.resultType = maxType;\n                this.showResult();\n            },\n\n            showResult: function() {\n                document.getElementById('wlq-quiz').style.display = 'none';\n                document.getElementById('wlq-result').style.display = 'flex';\n                \n                const result = this.results[this.state.resultType];\n                \n                \/\/ \u8bbe\u7f6e\u7528\u6237\u4f4d\u7f6e\u6807\u8bb0\n                const marker = document.getElementById('wlq-user-marker');\n                const scoreLabel = document.getElementById('wlq-user-score-label');\n                \n                setTimeout(() => {\n                    marker.style.left = `${result.score}%`;\n                    scoreLabel.textContent = `\u4f60\u7684\u5206\u6570: ${result.score}`;\n                }, 100);\n                \n                \/\/ \u6e32\u67d3\u7ed3\u679c\u6587\u672c\n                const resultTextContainer = document.getElementById('wlq-result-text');\n                let resultHTML = `\n                    <h3>${result.title}<\/h3>\n                    <p>${result.content}<\/p>\n                    <div class=\"wlq-result-details\">\n                `;\n\n                for (const dimension in result.dimensions) {\n                    resultHTML += `\n                        <div class=\"wlq-result-dimension\">\n                            <div class=\"wlq-dimension-title\">\n                                ${dimension} <span class=\"wlq-dimension-score\">${result.dimensions[dimension]}%<\/span>\n                            <\/div>\n                            <div class=\"wlq-dimension-bar\">\n                                <div class=\"wlq-dimension-fill\" style=\"width: 0;\" data-width=\"${result.dimensions[dimension]}%\"><\/div>\n                            <\/div>\n                        <\/div>\n                    `;\n                }\n                \n                resultHTML += `<\/div>`;\n                resultTextContainer.innerHTML = resultHTML;\n                \n                \/\/ \u52a8\u753b\u586b\u5145\u8fdb\u5ea6\u6761\n                setTimeout(() => {\n                    const bars = document.querySelectorAll('.wlq-dimension-fill');\n                    bars.forEach(bar => {\n                        bar.style.width = bar.dataset.width;\n                    });\n                }, 100);\n                \n                this.scrollToTop();\n            },\n\n            restartQuiz: function() {\n                this.state.currentQuestion = 0;\n                this.state.answers = [];\n                this.state.resultType = null;\n                \n                document.getElementById('wlq-result').style.display = 'none';\n                document.getElementById('wlq-intro').style.display = 'flex';\n                this.scrollToTop();\n            },\n\n            scrollToTop: function() {\n                const container = document.getElementById('wlq-container');\n                if (container) {\n                    container.scrollIntoView({ behavior: 'smooth', block: 'start' });\n                }\n            }\n        };\n\n        document.addEventListener('DOMContentLoaded', function() {\n            WinterLoveQuiz.init();\n        });\n    })();\n    <\/script>","protected":false},"excerpt":{"rendered":"<p>\u8fdb\u5165\u51ac\u5b63\uff0c\u6211\u4eec\u4f1a\u6bd4\u4efb\u4f55\u4e00\u4e2a\u5b63\u8282\u66f4\u9700\u8981\u7231\u60c5\u3002\u60f3\u77e5\u9053\u5c5e\u4e8e\u4f60\u7684\u51ac\u5b63\u604b\u6b4c\u662f\u4ec0\u4e48\u5417\uff1f\u8ba9\u6d4b\u8bd5\u4e3a\u4f60\u63ed\u6653\u7b54\u6848\u5427\u3002<\/p>","protected":false},"author":19,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"site-sidebar-layout":"default","site-content-layout":"","ast-site-content-layout":"","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"disabled","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":"","ast-disable-related-posts":"","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":""},"categories":[178],"tags":[],"class_list":["post-2375","post","type-post","status-publish","format-standard","hentry","category-love"],"_links":{"self":[{"href":"https:\/\/xinliceyan.org\/zh\/wp-json\/wp\/v2\/posts\/2375","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/xinliceyan.org\/zh\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/xinliceyan.org\/zh\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/xinliceyan.org\/zh\/wp-json\/wp\/v2\/users\/19"}],"replies":[{"embeddable":true,"href":"https:\/\/xinliceyan.org\/zh\/wp-json\/wp\/v2\/comments?post=2375"}],"version-history":[{"count":10,"href":"https:\/\/xinliceyan.org\/zh\/wp-json\/wp\/v2\/posts\/2375\/revisions"}],"predecessor-version":[{"id":10309,"href":"https:\/\/xinliceyan.org\/zh\/wp-json\/wp\/v2\/posts\/2375\/revisions\/10309"}],"wp:attachment":[{"href":"https:\/\/xinliceyan.org\/zh\/wp-json\/wp\/v2\/media?parent=2375"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/xinliceyan.org\/zh\/wp-json\/wp\/v2\/categories?post=2375"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/xinliceyan.org\/zh\/wp-json\/wp\/v2\/tags?post=2375"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}