프로그래머 문호영
Sample Page
The New UMoMA Opens its Doors
문의하기
블로그
소개
반응형 홈페이지
이 소스는 지식인에 반응형 버튼 문의가 올라와서 소스코드로 직접 만들어보았습니다.
아래 소스코드를 그대로 복사하셔서 붙여넣어 사용가능합니다
width:250
height:250
<noscript><img data-lazy-fallback="1" decoding="async" class="alignnone wp-image-90 size-full" src="https://munhoyoung.com/wp-content/uploads/2020/08/반응형홈페이지.gif" alt="" width="704" height="324" /></noscript></p> <h1>반응형 버튼 소스코드</h1> <pre><!doctype html> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>반응형 웹 버튼 만들기</title> <style> /* 최소 비율 */ @media (min-aspect-ratio: 8/5) { div { background: #9af; /* blue */ } } /* 최고 비율 */ @media (max-aspect-ratio: 3/2) { div { background: #9ff; /* cyan */ } } /* 기본 */ @media (aspect-ratio: 1/1) { div { background: #f9a; /* red */ } } </style> </head> <body> <label id="wf" for="w">width:250</label> <input id="w" name="w" type="range" min="100" max="250" step="5" value="165"> <label id="hf" for="w">height:250</label> <input id="h" name="h" type="range" min="100" max="250" step="5" value="165"> <iframe id="outer" src="data:text/html,<style> @media (min-aspect-ratio: 8/5) { div { background: %239af; } } @media (max-aspect-ratio: 3/2) { div { background: %239ff; } } @media (aspect-ratio: 1/1) { div { background: %23f9a; } }</style><div id='inner'>this...</div>" style="height: 250px; width: 250px;"> </iframe> <script> outer.style.width=outer.style.height="165px" w.onchange=w.oninput=function(){ outer.style.width=w.value+"px" wf.textContent="width:"+w.value } h.onchange=h.oninput=function(){ outer.style.height=h.value+"px" hf.textContent="height:"+h.value } </script> </body> </html></pre> <p> </p> </div></div> <div class="wp-block-column is-layout-flow wp-block-column-is-layout-flow" style="flex-basis:25%"></div> </div> <div class="wp-block-template-part"> <div style="height:0" aria-hidden="true" class="wp-block-spacer"></div> <div class="wp-block-group has-global-padding is-layout-constrained wp-block-group-is-layout-constrained" style="margin-top:var(--wp--preset--spacing--70)"> <hr class="wp-block-separator alignwide has-css-opacity is-style-wide"/> <div class="wp-block-columns alignwide has-small-font-size is-layout-flex wp-container-16 wp-block-columns-is-layout-flex" style="margin-top:var(--wp--preset--spacing--30)"> <div class="wp-block-column is-layout-flow wp-container-13 wp-block-column-is-layout-flow"> <div class="wp-block-group is-layout-flex wp-container-11 wp-block-group-is-layout-flex"> <p> 게시됨 </p> <div class="wp-block-post-date"><time datetime="2020-08-08T10:57:48+09:00">08/08/2020</time></div> <p> 카테고리 </p> <div class="taxonomy-category wp-block-post-terms"><a href="https://munhoyoung.com/category/programming-source/" rel="tag">Programming Source</a></div> </div> <div class="wp-block-group is-layout-flex wp-container-12 wp-block-group-is-layout-flex"> <p> 작성자 </p> <div class="wp-block-post-author"><div class="wp-block-post-author__content"><p class="wp-block-post-author__name">ationkr</p></div></div> </div> </div> <div class="wp-block-column is-layout-flow wp-container-15 wp-block-column-is-layout-flow"> <div class="wp-block-group is-vertical is-layout-flex wp-container-14 wp-block-group-is-layout-flex"> <p> 태그: </p> <div class="taxonomy-post_tag wp-block-post-terms"><a href="https://munhoyoung.com/tag/html%eb%b0%98%ec%9d%91%ed%98%95/" rel="tag">HTML반응형</a><span class="wp-block-post-terms__separator">, </span><a href="https://munhoyoung.com/tag/html%eb%b0%98%ec%9d%91%ed%98%95%ed%99%88%ed%8e%98%ec%9d%b4%ec%a7%80/" rel="tag">HTML반응형홈페이지</a><span class="wp-block-post-terms__separator">, </span><a href="https://munhoyoung.com/tag/%eb%b0%98%ec%9d%91%ed%98%95html/" rel="tag">반응형HTML</a><span class="wp-block-post-terms__separator">, </span><a href="https://munhoyoung.com/tag/%eb%b0%98%ec%9d%91%ed%98%95%eb%b2%84%ed%8a%bc/" rel="tag">반응형버튼</a><span class="wp-block-post-terms__separator">, </span><a href="https://munhoyoung.com/tag/%eb%b0%98%ec%9d%91%ed%98%95%ec%82%ac%ec%9d%b4%ed%8a%b8/" rel="tag">반응형사이트</a><span class="wp-block-post-terms__separator">, </span><a href="https://munhoyoung.com/tag/%eb%b0%98%ec%9d%91%ed%98%95%ec%86%8c%ec%8a%a4/" rel="tag">반응형소스</a><span class="wp-block-post-terms__separator">, </span><a href="https://munhoyoung.com/tag/%eb%b0%98%ec%9d%91%ed%98%95%ec%9b%b9%eb%b2%84%ed%8a%bc%eb%a7%8c%eb%93%a4%ea%b8%b0/" rel="tag">반응형웹버튼만들기</a><span class="wp-block-post-terms__separator">, </span><a href="https://munhoyoung.com/tag/%eb%b0%98%ec%9d%91%ed%98%95%ec%9b%b9%ed%8e%98%ec%9d%b4%ec%a7%80/" rel="tag">반응형웹페이지</a><span class="wp-block-post-terms__separator">, </span><a href="https://munhoyoung.com/tag/%eb%b0%98%ec%9d%91%ed%98%95%ec%9b%b9%ed%8e%98%ec%9d%b4%ec%a7%80%ea%b5%ac%ed%98%84/" rel="tag">반응형웹페이지구현</a><span class="wp-block-post-terms__separator">, </span><a href="https://munhoyoung.com/tag/%eb%b0%98%ec%9d%91%ed%98%95%ed%99%88%ed%8e%98%ec%9d%b4%ec%a7%80/" rel="tag">반응형홈페이지</a><span class="wp-block-post-terms__separator">, </span><a href="https://munhoyoung.com/tag/%eb%b0%98%ec%9d%91%ed%98%95%ed%99%88%ed%8e%98%ec%9d%b4%ec%a7%80html/" rel="tag">반응형홈페이지HTML</a><span class="wp-block-post-terms__separator">, </span><a href="https://munhoyoung.com/tag/%eb%b0%98%ec%9d%91%ed%98%95%ed%99%88%ed%8e%98%ec%9d%b4%ec%a7%80%eb%b2%84%ed%8a%bc/" rel="tag">반응형홈페이지버튼</a><span class="wp-block-post-terms__separator">, </span><a href="https://munhoyoung.com/tag/%eb%b0%98%ec%9d%91%ed%98%95%ed%99%88%ed%8e%98%ec%9d%b4%ec%a7%80%ec%86%8c%ec%8a%a4/" rel="tag">반응형홈페이지소스</a></div> </div> </div> </div> </div> </div> <section class="wp-block-template-part"> <div class="wp-block-group has-global-padding is-layout-constrained wp-block-group-is-layout-constrained" style="padding-top:var(--wp--preset--spacing--40);padding-right:var(--wp--preset--spacing--40);padding-bottom:var(--wp--preset--spacing--40);padding-left:var(--wp--preset--spacing--40)"> </div> </section></main> <footer class="wp-block-template-part"> <div class="wp-block-columns is-layout-flex wp-container-24 wp-block-columns-is-layout-flex"> <div class="wp-block-column is-layout-flow wp-block-column-is-layout-flow" style="flex-basis:25%"></div> <div class="wp-block-column is-layout-flow wp-block-column-is-layout-flow" style="flex-basis:50%"><form role="search" method="get" action="https://munhoyoung.com/" class="wp-block-search__button-inside wp-block-search__text-button aligncenter wp-block-search"><label class="wp-block-search__label screen-reader-text" for="wp-block-search__input-21" >검색</label><div class="wp-block-search__inside-wrapper has-border-color has-contrast-border-color" style="width: 80%;border-width: 3px;border-radius: calc(13px + 4px)"><input class="wp-block-search__input has-small-font-size" id="wp-block-search__input-21" placeholder="" value="" type="search" name="s" required style="border-radius: 13px"/><button aria-label="검색" class="wp-block-search__button has-text-color has-base-color has-background has-contrast-background-color has-small-font-size wp-element-button" type="submit" style="border-radius: 13px">검색</button></div></form></div> <div class="wp-block-column is-layout-flow wp-block-column-is-layout-flow" style="flex-basis:25%"></div> </div> <div style="height:60px" aria-hidden="true" class="wp-block-spacer"></div> <div class="wp-block-columns is-layout-flex wp-container-28 wp-block-columns-is-layout-flex"> <div class="wp-block-column is-layout-flow wp-block-column-is-layout-flow" style="flex-basis:25%"></div> <div class="wp-block-column is-layout-flow wp-block-column-is-layout-flow" style="flex-basis:50%"><div class="aligncenter wp-block-site-logo"><a href="https://munhoyoung.com/" class="custom-logo-link" rel="home"><img width="157" height="157" src="https://munhoyoung.com/wp-content/uploads/2020/07/cropped-cropped-이미지_2020-07-26_오전-5_42_10.jpg" class="custom-logo jetpack-lazy-image" alt="프로그래머 문호영" decoding="async" data-lazy-srcset="https://munhoyoung.com/wp-content/uploads/2020/07/cropped-cropped-이미지_2020-07-26_오전-5_42_10.jpg 512w, https://munhoyoung.com/wp-content/uploads/2020/07/cropped-cropped-이미지_2020-07-26_오전-5_42_10-300x300.jpg 300w, https://munhoyoung.com/wp-content/uploads/2020/07/cropped-cropped-이미지_2020-07-26_오전-5_42_10-150x150.jpg 150w" data-lazy-sizes="(max-width: 157px) 100vw, 157px" data-lazy-src="https://munhoyoung.com/wp-content/uploads/2020/07/cropped-cropped-이미지_2020-07-26_오전-5_42_10.jpg?is-pending-load=1" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" /></a></div></div> <div class="wp-block-column is-layout-flow wp-block-column-is-layout-flow" style="flex-basis:25%"></div> </div> <div style="height:43px" aria-hidden="true" class="wp-block-spacer"></div> <p class="has-text-align-center">티온 | 문호영 대표 | 621-42-00020</p> <div class="wp-block-group has-global-padding is-layout-constrained wp-block-group-is-layout-constrained"> <div class="wp-block-group alignwide is-content-justification-center is-layout-flex wp-container-29 wp-block-group-is-layout-flex" style="padding-top:var(--wp--preset--spacing--40)"><p style="font-style:normal;font-weight:700;" class="wp-block-site-title has-large-font-size"><a href="https://munhoyoung.com" target="_self" rel="home">프로그래머 문호영</a></p></div> </div> </footer></div> <style id="skip-link-styles"> .skip-link.screen-reader-text { border: 0; clip: rect(1px,1px,1px,1px); clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute !important; width: 1px; word-wrap: normal !important; } .skip-link.screen-reader-text:focus { background-color: #eee; clip: auto !important; clip-path: none; color: #444; display: block; font-size: 1em; height: auto; left: 5px; line-height: normal; padding: 15px 23px 14px; text-decoration: none; top: 5px; width: auto; z-index: 100000; } </style> <script type="application/ld+json" class="rank-math-schema-pro">{"@context":"https://schema.org","@graph":[{"@type":["Person","Organization"],"@id":"https://munhoyoung.com/#person","name":"ationkr","logo":{"@type":"ImageObject","@id":"https://munhoyoung.com/#logo","url":"https://munhoyoung.com/wp-content/uploads/2020/07/cropped-cropped-\uc774\ubbf8\uc9c0_2020-07-26_\uc624\uc804-5_42_10-150x150.jpg","contentUrl":"https://munhoyoung.com/wp-content/uploads/2020/07/cropped-cropped-\uc774\ubbf8\uc9c0_2020-07-26_\uc624\uc804-5_42_10-150x150.jpg","caption":"\ud504\ub85c\uadf8\ub798\uba38 \ubb38\ud638\uc601","inLanguage":"ko-KR"},"image":{"@type":"ImageObject","@id":"https://munhoyoung.com/#logo","url":"https://munhoyoung.com/wp-content/uploads/2020/07/cropped-cropped-\uc774\ubbf8\uc9c0_2020-07-26_\uc624\uc804-5_42_10-150x150.jpg","contentUrl":"https://munhoyoung.com/wp-content/uploads/2020/07/cropped-cropped-\uc774\ubbf8\uc9c0_2020-07-26_\uc624\uc804-5_42_10-150x150.jpg","caption":"\ud504\ub85c\uadf8\ub798\uba38 \ubb38\ud638\uc601","inLanguage":"ko-KR"}},{"@type":"WebSite","@id":"https://munhoyoung.com/#website","url":"https://munhoyoung.com","name":"\ud504\ub85c\uadf8\ub798\uba38 \ubb38\ud638\uc601","alternateName":"\ud504\ub85c\uadf8\ub798\uba38 \ubb38\ud638\uc601","publisher":{"@id":"https://munhoyoung.com/#person"},"inLanguage":"ko-KR"},{"@type":"ImageObject","@id":"https://munhoyoung.com/wp-content/uploads/2020/08/\ubc18\uc751\ud615\ud648\ud398\uc774\uc9c0.gif","url":"https://munhoyoung.com/wp-content/uploads/2020/08/\ubc18\uc751\ud615\ud648\ud398\uc774\uc9c0.gif","width":"704","height":"324","inLanguage":"ko-KR"},{"@type":"WebPage","@id":"https://munhoyoung.com/%eb%b0%98%ec%9d%91%ed%98%95%ed%99%88%ed%8e%98%ec%9d%b4%ec%a7%80/#webpage","url":"https://munhoyoung.com/%eb%b0%98%ec%9d%91%ed%98%95%ed%99%88%ed%8e%98%ec%9d%b4%ec%a7%80/","name":"\ubc18\uc751\ud615 \ud648\ud398\uc774\uc9c0","datePublished":"2020-08-08T10:57:48+09:00","dateModified":"2020-10-07T12:47:43+09:00","isPartOf":{"@id":"https://munhoyoung.com/#website"},"primaryImageOfPage":{"@id":"https://munhoyoung.com/wp-content/uploads/2020/08/\ubc18\uc751\ud615\ud648\ud398\uc774\uc9c0.gif"},"inLanguage":"ko-KR"},{"@type":"Person","@id":"https://munhoyoung.com/%eb%b0%98%ec%9d%91%ed%98%95%ed%99%88%ed%8e%98%ec%9d%b4%ec%a7%80/#author","name":"ationkr","description":"\ud504\ub85c\uadf8\ub798\uba38 \ubb38\ud638\uc601","image":{"@type":"ImageObject","@id":"https://secure.gravatar.com/avatar/afed6d3626a4d21b0ceaf9e8311cc23e?s=96&d=mm&r=g","url":"https://secure.gravatar.com/avatar/afed6d3626a4d21b0ceaf9e8311cc23e?s=96&d=mm&r=g","caption":"ationkr","inLanguage":"ko-KR"},"sameAs":["http://www.munhoyoung.com"]},{"@type":"BlogPosting","headline":"\ubc18\uc751\ud615 \ud648\ud398\uc774\uc9c0","datePublished":"2020-08-08T10:57:48+09:00","dateModified":"2020-10-07T12:47:43+09:00","author":{"@id":"https://munhoyoung.com/%eb%b0%98%ec%9d%91%ed%98%95%ed%99%88%ed%8e%98%ec%9d%b4%ec%a7%80/#author","name":"ationkr"},"publisher":{"@id":"https://munhoyoung.com/#person"},"description":"\ubc18\uc751\ud615 \ud648\ud398\uc774\uc9c0 HTML\ubc18\uc751\ud615","name":"\ubc18\uc751\ud615 \ud648\ud398\uc774\uc9c0","@id":"https://munhoyoung.com/%eb%b0%98%ec%9d%91%ed%98%95%ed%99%88%ed%8e%98%ec%9d%b4%ec%a7%80/#richSnippet","isPartOf":{"@id":"https://munhoyoung.com/%eb%b0%98%ec%9d%91%ed%98%95%ed%99%88%ed%8e%98%ec%9d%b4%ec%a7%80/#webpage"},"image":{"@id":"https://munhoyoung.com/wp-content/uploads/2020/08/\ubc18\uc751\ud615\ud648\ud398\uc774\uc9c0.gif"},"inLanguage":"ko-KR","mainEntityOfPage":{"@id":"https://munhoyoung.com/%eb%b0%98%ec%9d%91%ed%98%95%ed%99%88%ed%8e%98%ec%9d%b4%ec%a7%80/#webpage"}}]}</script><script> window._wpemojiSettings = {"baseUrl":"https:\/\/s.w.org\/images\/core\/emoji\/14.0.0\/72x72\/","ext":".png","svgUrl":"https:\/\/s.w.org\/images\/core\/emoji\/14.0.0\/svg\/","svgExt":".svg","source":{"concatemoji":"https:\/\/munhoyoung.com\/wp-includes\/js\/wp-emoji-release.min.js?ver=6.3.1"}}; /*! This file is auto-generated */ !function(i,n){var o,s,e;function c(e){try{var t={supportTests:e,timestamp:(new Date).valueOf()};sessionStorage.setItem(o,JSON.stringify(t))}catch(e){}}function p(e,t,n){e.clearRect(0,0,e.canvas.width,e.canvas.height),e.fillText(t,0,0);var t=new Uint32Array(e.getImageData(0,0,e.canvas.width,e.canvas.height).data),r=(e.clearRect(0,0,e.canvas.width,e.canvas.height),e.fillText(n,0,0),new Uint32Array(e.getImageData(0,0,e.canvas.width,e.canvas.height).data));return t.every(function(e,t){return e===r[t]})}function u(e,t,n){switch(t){case"flag":return n(e,"\ud83c\udff3\ufe0f\u200d\u26a7\ufe0f","\ud83c\udff3\ufe0f\u200b\u26a7\ufe0f")?!1:!n(e,"\ud83c\uddfa\ud83c\uddf3","\ud83c\uddfa\u200b\ud83c\uddf3")&&!n(e,"\ud83c\udff4\udb40\udc67\udb40\udc62\udb40\udc65\udb40\udc6e\udb40\udc67\udb40\udc7f","\ud83c\udff4\u200b\udb40\udc67\u200b\udb40\udc62\u200b\udb40\udc65\u200b\udb40\udc6e\u200b\udb40\udc67\u200b\udb40\udc7f");case"emoji":return!n(e,"\ud83e\udef1\ud83c\udffb\u200d\ud83e\udef2\ud83c\udfff","\ud83e\udef1\ud83c\udffb\u200b\ud83e\udef2\ud83c\udfff")}return!1}function f(e,t,n){var r="undefined"!=typeof WorkerGlobalScope&&self instanceof WorkerGlobalScope?new OffscreenCanvas(300,150):i.createElement("canvas"),a=r.getContext("2d",{willReadFrequently:!0}),o=(a.textBaseline="top",a.font="600 32px Arial",{});return e.forEach(function(e){o[e]=t(a,e,n)}),o}function t(e){var t=i.createElement("script");t.src=e,t.defer=!0,i.head.appendChild(t)}"undefined"!=typeof Promise&&(o="wpEmojiSettingsSupports",s=["flag","emoji"],n.supports={everything:!0,everythingExceptFlag:!0},e=new Promise(function(e){i.addEventListener("DOMContentLoaded",e,{once:!0})}),new Promise(function(t){var n=function(){try{var e=JSON.parse(sessionStorage.getItem(o));if("object"==typeof e&&"number"==typeof e.timestamp&&(new Date).valueOf()<e.timestamp+604800&&"object"==typeof e.supportTests)return e.supportTests}catch(e){}return null}();if(!n){if("undefined"!=typeof Worker&&"undefined"!=typeof OffscreenCanvas&&"undefined"!=typeof URL&&URL.createObjectURL&&"undefined"!=typeof Blob)try{var e="postMessage("+f.toString()+"("+[JSON.stringify(s),u.toString(),p.toString()].join(",")+"));",r=new Blob([e],{type:"text/javascript"}),a=new Worker(URL.createObjectURL(r),{name:"wpTestEmojiSupports"});return void(a.onmessage=function(e){c(n=e.data),a.terminate(),t(n)})}catch(e){}c(n=f(s,u,p))}t(n)}).then(function(e){for(var t in e)n.supports[t]=e[t],n.supports.everything=n.supports.everything&&n.supports[t],"flag"!==t&&(n.supports.everythingExceptFlag=n.supports.everythingExceptFlag&&n.supports[t]);n.supports.everythingExceptFlag=n.supports.everythingExceptFlag&&!n.supports.flag,n.DOMReady=!1,n.readyCallback=function(){n.DOMReady=!0}}).then(function(){return e}).then(function(){var e;n.supports.everything||(n.readyCallback(),(e=n.source||{}).concatemoji?t(e.concatemoji):e.wpemoji&&e.twemoji&&(t(e.twemoji),t(e.wpemoji)))}))}((window,document),window._wpemojiSettings); </script><script src='https://c0.wp.com/c/6.3.1/wp-includes/blocks/navigation/view.min.js' id='wp-block-navigation-view-js'></script><script src='https://c0.wp.com/c/6.3.1/wp-includes/blocks/navigation/view-modal.min.js' id='wp-block-navigation-view-2-js'></script><script src='https://c0.wp.com/c/6.3.1/wp-includes/js/jquery/jquery.min.js' id='jquery-core-js'></script><script src='https://c0.wp.com/c/6.3.1/wp-includes/js/jquery/jquery-migrate.min.js' id='jquery-migrate-js'></script><script id="ez-toc-scroll-scriptjs-js-after"> jQuery(document).ready(function(){document.querySelectorAll(".ez-toc-link").forEach(t=>{t=t.replaceWith(t.cloneNode(!0))}),document.querySelectorAll(".ez-toc-section").forEach(t=>{t.setAttribute("ez-toc-data-id","#"+decodeURI(t.getAttribute("id")))}),jQuery("a.ez-toc-link").click(function(){let t=jQuery(this).attr("href"),e=jQuery("#wpadminbar"),i=jQuery("header"),o=0;30>30&&(o=30),e.length&&(o+=e.height()),(i.length&&"fixed"==i.css("position")||"sticky"==i.css("position"))&&(o+=i.height()),jQuery('[ez-toc-data-id="'+decodeURI(t)+'"]').length>0&&(o=jQuery('[ez-toc-data-id="'+decodeURI(t)+'"]').offset().top-o),jQuery("html, body").animate({scrollTop:o},500)})}); </script><script src='https://www.googletagmanager.com/gtag/js?id=UA-173527122-2' id='google_gtagjs-js' async></script><script id="google_gtagjs-js-after"> window.dataLayer = window.dataLayer || [];function gtag(){dataLayer.push(arguments);} gtag('set', 'linker', {"domains":["munhoyoung.com"]} ); gtag("js", new Date()); gtag("set", "developer_id.dZTNiMT", true); gtag("config", "UA-173527122-2", {"anonymize_ip":true}); gtag("config", "GT-WF36SDK"); </script><script> document.documentElement.classList.add( 'jetpack-lazy-images-js-enabled' ); </script><script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-2424258271435998&host=ca-host-pub-2644536267352236" crossorigin="anonymous"></script><script> outer.style.width=outer.style.height="165px"; w.onchange=w.oninput=function(){ outer.style.width=w.value+"px" wf.textContent="width:"+w.value }; h.onchange=h.oninput=function(){ outer.style.height=h.value+"px" hf.textContent="height:"+h.value }; </script><script> ( function() { var skipLinkTarget = document.querySelector( 'main' ), sibling, skipLinkTargetID, skipLink; // Early exit if a skip-link target can't be located. if ( ! skipLinkTarget ) { return; } /* * Get the site wrapper. * The skip-link will be injected in the beginning of it. */ sibling = document.querySelector( '.wp-site-blocks' ); // Early exit if the root element was not found. if ( ! sibling ) { return; } // Get the skip-link target's ID, and generate one if it doesn't exist. skipLinkTargetID = skipLinkTarget.id; if ( ! skipLinkTargetID ) { skipLinkTargetID = 'wp--skip-link--target'; skipLinkTarget.id = skipLinkTargetID; } // Create the skip link. skipLink = document.createElement( 'a' ); skipLink.classList.add( 'skip-link', 'screen-reader-text' ); skipLink.href = '#' + skipLinkTargetID; skipLink.innerHTML = '콘텐츠로 바로가기'; // Inject the skip link. sibling.parentElement.insertBefore( skipLink, sibling ); }() ); </script><script src='https://munhoyoung.com/wp-content/plugins/easy-table-of-contents/vendor/js-cookie/js.cookie.min.js?ver=2.2.1' id='ez-toc-js-cookie-js'></script><script src='https://munhoyoung.com/wp-content/plugins/easy-table-of-contents/vendor/sticky-kit/jquery.sticky-kit.min.js?ver=1.9.2' id='ez-toc-jquery-sticky-kit-js'></script><script id='ez-toc-js-js-extra'> var ezTOC = {"smooth_scroll":"1","visibility_hide_by_default":"","scroll_offset":"30","fallbackIcon":"<span class=\"\"><span style=\"display:none;\">Toggle<\/span><span class=\"ez-toc-icon-toggle-span\"><svg style=\"fill: #999;color:#999\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"list-377408\" width=\"20px\" height=\"20px\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M6 6H4v2h2V6zm14 0H8v2h12V6zM4 11h2v2H4v-2zm16 0H8v2h12v-2zM4 16h2v2H4v-2zm16 0H8v2h12v-2z\" fill=\"currentColor\"><\/path><\/svg><svg style=\"fill: #999;color:#999\" class=\"arrow-unsorted-368013\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"10px\" height=\"10px\" viewBox=\"0 0 24 24\" version=\"1.2\" baseProfile=\"tiny\"><path d=\"M18.2 9.3l-6.2-6.3-6.2 6.3c-.2.2-.3.4-.3.7s.1.5.3.7c.2.2.4.3.7.3h11c.3 0 .5-.1.7-.3.2-.2.3-.5.3-.7s-.1-.5-.3-.7zM5.8 14.7l6.2 6.3 6.2-6.3c.2-.2.3-.5.3-.7s-.1-.5-.3-.7c-.2-.2-.4-.3-.7-.3h-11c-.3 0-.5.1-.7.3-.2.2-.3.5-.3.7s.1.5.3.7z\"\/><\/svg><\/span><\/span>"}; </script><script src='https://munhoyoung.com/wp-content/plugins/easy-table-of-contents/assets/js/front.min.js?ver=2.0.55-1693848418' id='ez-toc-js-js'></script><script src='https://munhoyoung.com/wp-content/plugins/jetpack/jetpack_vendor/automattic/jetpack-lazy-images/dist/intersection-observer.js?minify=false&ver=83ec8aa758f883d6da14' id='jetpack-lazy-images-polyfill-intersectionobserver-js'></script><script id='jetpack-lazy-images-js-extra'> var jetpackLazyImagesL10n = {"loading_warning":"\uc774\ubbf8\uc9c0\ub97c \uc544\uc9c1 \ub85c\ub4dc\ud558\ub294 \uc911\uc785\ub2c8\ub2e4. \uc778\uc1c4\ub97c \ucde8\uc18c\ud558\uace0 \ub2e4\uc2dc \uc2dc\ub3c4\ud574 \uc8fc\uc138\uc694."}; </script><script src='https://munhoyoung.com/wp-content/plugins/jetpack/jetpack_vendor/automattic/jetpack-lazy-images/dist/lazy-images.js?minify=false&ver=de7a5ed9424adbf44f32' id='jetpack-lazy-images-js'></script><script defer src='https://stats.wp.com/e-202338.js' id='jetpack-stats-js'></script><script id="jetpack-stats-js-after"> _stq = window._stq || []; _stq.push([ "view", {v:'ext',blog:'213340895',post:'85',tz:'9',srv:'munhoyoung.com',j:'1:12.6.1'} ]); _stq.push([ "clickTrackerInit", "213340895", "85" ]); </script></body> </html>
