{"id":37824,"date":"2025-05-21T14:06:43","date_gmt":"2025-05-21T21:06:43","guid":{"rendered":"https:\/\/www.anyload.com\/?page_id=37824"},"modified":"2025-07-02T14:37:41","modified_gmt":"2025-07-02T21:37:41","slug":"%ea%b8%b8%ec%9d%b4-%eb%b3%80%ed%99%98","status":"publish","type":"page","link":"https:\/\/www.anyload.com\/kr\/%ea%b8%b8%ec%9d%b4-%eb%b3%80%ed%99%98\/","title":{"rendered":"\uae38\uc774 \ubcc0\ud658"},"content":{"rendered":"<h1 class=\"wp-block-heading\"><strong>\uae38\uc774 \ubcc0\ud658<\/strong><\/h1>\n\n\n\n<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n    <meta charset=\"UTF-8\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n\n    <style>\n        \/* Your existing CSS kept the same *\/\n        #elex-rqst-float-minicart-icon { display: none; }\n        * { box-sizing: border-box; font-family: Arial, sans-serif; }\n        body { display: flex; justify-content: center; align-items: center; min-height: 100vh; margin: 0; background-color: #f0f2f5; }\n        .container { background-color: white; padding: 1.5rem; border-radius: 10px; box-shadow: 0 2px 10px rgba(0,0,0,0.1); width: 95%; max-width: 800px; margin: 1rem; }\n        h1 { text-align: center; color: #333; margin-bottom: 1.5rem; font-size: 1.5rem; }\n        .grid-container { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.75rem; }\n        .input-group { display: flex; flex-direction: column; margin-bottom: 0.75rem; background-color: #fff; padding: 1rem; border-radius: 8px; box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08); min-height: 130px; justify-content: space-between; }\n        .input-group label { font-size: 0.85rem; font-weight: bold; color: #666; margin-bottom: 0.4rem; }\n        .input-group input { padding: 0.6rem; font-size: 0.85rem; }\n        .unit { color: #666; white-space: nowrap; font-size: 0.9rem; }\n        .reset-button { text-align: center; margin-top: 1.5rem; }\n        .reset-button button { background-color: #dc3545; color: white; border: none; padding: 0.7rem 1.5rem; border-radius: 5px; cursor: pointer; font-size: 0.9rem; transition: background-color 0.3s; width: 100%; max-width: 200px; }\n        @media (max-width: 768px) { .grid-container { grid-template-columns: 1fr; } .container { padding: 1rem; } .input-group { margin-bottom: 0.5rem; } .input-group input { padding: 0.6rem; } }\n        @media (max-width: 480px) { .input-wrapper { flex-direction: column; align-items: flex-start; } .unit { margin-left: 0; padding-left: 0.5rem; } .reset-button button { max-width: none; } }\n        .disclaimer-note { text-align: center; color: #666; font-size: 0.8rem; margin-top: 1.5rem; padding: 0.5rem; border-top: 1px solid #eee; line-height: 1.4; }\n    <\/style>\n<\/head>\n<body>\n    <div class=\"container\">\n     \n        <div class=\"grid-container\">\n            <!-- Metric Units -->\n            <div class=\"input-group\">\n                <label>\ud0ac\ub85c\ubbf8\ud130(km)<\/label>\n                <div class=\"input-wrapper\">\n                    <input type=\"number\" data-unit=\"km\" placeholder=\"\uac12 \uc785\ub825\">\n                <\/div>\n            <\/div>\n            <div class=\"input-group\">\n                <label>\ubbf8\ud130(m)<\/label>\n                <div class=\"input-wrapper\">\n                    <input type=\"number\" data-unit=\"m\" placeholder=\"\uac12 \uc785\ub825\">\n                <\/div>\n            <\/div>\n            <div class=\"input-group\">\n                <label>\uc13c\ud2f0\ubbf8\ud130(cm)<\/label>\n                <div class=\"input-wrapper\">\n                    <input type=\"number\" data-unit=\"cm\" placeholder=\"\uac12 \uc785\ub825\">\n                <\/div>\n            <\/div>\n\n            <!-- Imperial\/US Units -->\n            <div class=\"input-group\">\n                <label>\ub9c8\uc77c(\ub9c8\uc77c)<\/label>\n                <div class=\"input-wrapper\">\n                    <input type=\"number\" data-unit=\"mi\" placeholder=\"\uac12 \uc785\ub825\">\n                <\/div>\n            <\/div>\n            <div class=\"input-group\">\n                <label>\uc57c\ub4dc(\uc57c\ub4dc)<\/label>\n                <div class=\"input-wrapper\">\n                    <input type=\"number\" data-unit=\"yd\" placeholder=\"\uac12 \uc785\ub825\">\n                <\/div>\n            <\/div>\n            <div class=\"input-group\">\n                <label>\ud53c\ud2b8(\ud53c\ud2b8)<\/label>\n                <div class=\"input-wrapper\">\n                    <input type=\"number\" data-unit=\"ft\" placeholder=\"\uac12 \uc785\ub825\">\n                <\/div>\n            <\/div>\n            <div class=\"input-group\">\n                <label>\uc778\uce58(\uc778\uce58)<\/label>\n                <div class=\"input-wrapper\">\n                    <input type=\"number\" data-unit=\"in\" placeholder=\"\uac12 \uc785\ub825\">\n                <\/div>\n            <\/div>\n            <div class=\"input-group\">\n                <label>\ud574\ub9ac \ub9c8\uc77c(nmi)<\/label>\n                <div class=\"input-wrapper\">\n                    <input type=\"number\" data-unit=\"nmi\" placeholder=\"\uac12 \uc785\ub825\">\n                <\/div>\n            <\/div>\n\n            <!-- Other Units -->\n            <div class=\"input-group\">\n                <label>\ubc00\ub9ac\ubbf8\ud130(mm)<\/label>\n                <div class=\"input-wrapper\">\n                    <input type=\"number\" data-unit=\"mm\" placeholder=\"\uac12 \uc785\ub825\">\n                <\/div>\n            <\/div>\n            <div class=\"input-group\">\n                <label>\ub9c8\uc774\ud06c\ub85c\ubbf8\ud130(\u03bcm)<\/label>\n                <div class=\"input-wrapper\">\n                    <input type=\"number\" data-unit=\"\u03bcm\" placeholder=\"\uac12 \uc785\ub825\">\n                <\/div>\n            <\/div>\n            <div class=\"input-group\">\n                <label>\ub098\ub178\ubbf8\ud130(nm)<\/label>\n                <div class=\"input-wrapper\">\n                    <input type=\"number\" data-unit=\"nm\" placeholder=\"\uac12 \uc785\ub825\">\n                <\/div>\n            <\/div>\n        <\/div>\n        <div class=\"reset-button\">\n            <button onclick=\"resetAllInputs()\">\ubaa8\ub450 \ucd08\uae30\ud654<\/button>\n        <\/div>\n        <div class=\"disclaimer-note\">\n            \ucc38\uace0: \ubcc0\ud658\ub41c \uae38\uc774\ub294 \uc18c\uc218\uc810 \uc774\ud558 6\uc790\ub9ac\ub85c \ubc18\uc62c\ub9bc\ub429\ub2c8\ub2e4. \uc2e4\uc81c \uacb0\uacfc\ub294 \ubc18\uc62c\ub9bc \ucc28\uc774\ub85c \uc778\ud574 \uc57d\uac04 \ub2e4\ub97c \uc218 \uc788\uc2b5\ub2c8\ub2e4.\n        <\/div>\n    <\/div>\n\n    <script>\n        \/\/ Conversion factors relative to meters\n        const units = {\n            \/\/ Metric\n            km: 1000,\n            m: 1,\n            cm: 0.01,\n            mm: 0.001,\n            \u03bcm: 1e-6,\n            nm: 1e-9,\n\n            \/\/ Imperial\/US\n            mi: 1609.344,\n            yd: 0.9144,\n            ft: 0.3048,\n            in: 0.0254,\n            nmi: 1852,\n\n            \/\/ Astronomical\n            ly: 9.4607e15 \/\/ Example extra unit\n        };\n\n        const inputs = document.querySelectorAll('input[data-unit]');\n\n        function convert(updatedInput) {\n            const sourceUnit = updatedInput.dataset.unit;\n            const sourceValue = parseFloat(updatedInput.value);\n            \n            if (!isNaN(sourceValue)) {\n                const meters = sourceValue * units[sourceUnit];\n                inputs.forEach(input => {\n                    if (input !== updatedInput) {\n                        const targetUnit = input.dataset.unit;\n                        const convertedValue = meters \/ units[targetUnit];\n                        input.value = parseFloat(convertedValue.toFixed(6));\n                    }\n                });\n            } else {\n                inputs.forEach(input => {\n                    if (input !== updatedInput) input.value = '';\n                });\n            }\n        }\n\n        function resetAllInputs() {\n            inputs.forEach(input => {\n                input.value = '';\n            });\n        }\n\n        inputs.forEach(input => {\n            input.addEventListener('input', (e) => convert(e.target));\n        });\n    <\/script>\n<\/body>\n<\/html>\n\n\n\n<p><\/p>","protected":false},"excerpt":{"rendered":"<p>Length Conversion Kilometers (km) Meters (m) Centimeters (cm) Miles (mi) Yards (yd) Feet (ft) Inches (in) Nautical Miles (nmi) Millimeters [&hellip;]<\/p>","protected":false},"author":2627,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_acf_changed":false,"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":"disabled","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":"set","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-37824","page","type-page","status-publish","hentry"],"acf":[],"_links":{"self":[{"href":"https:\/\/www.anyload.com\/kr\/wp-json\/wp\/v2\/pages\/37824","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.anyload.com\/kr\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.anyload.com\/kr\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.anyload.com\/kr\/wp-json\/wp\/v2\/users\/2627"}],"replies":[{"embeddable":true,"href":"https:\/\/www.anyload.com\/kr\/wp-json\/wp\/v2\/comments?post=37824"}],"version-history":[{"count":0,"href":"https:\/\/www.anyload.com\/kr\/wp-json\/wp\/v2\/pages\/37824\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.anyload.com\/kr\/wp-json\/wp\/v2\/media?parent=37824"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}