aboutsummaryrefslogtreecommitdiff
path: root/files/ko/web/css/cursor
diff options
context:
space:
mode:
authorPeter Bengtsson <mail@peterbe.com>2020-12-08 14:42:17 -0500
committerPeter Bengtsson <mail@peterbe.com>2020-12-08 14:42:17 -0500
commitda78a9e329e272dedb2400b79a3bdeebff387d47 (patch)
treee6ef8aa7c43556f55ddfe031a01cf0a8fa271bfe /files/ko/web/css/cursor
parent1109132f09d75da9a28b649c7677bb6ce07c40c0 (diff)
downloadtranslated-content-da78a9e329e272dedb2400b79a3bdeebff387d47.tar.gz
translated-content-da78a9e329e272dedb2400b79a3bdeebff387d47.tar.bz2
translated-content-da78a9e329e272dedb2400b79a3bdeebff387d47.zip
initial commit
Diffstat (limited to 'files/ko/web/css/cursor')
-rw-r--r--files/ko/web/css/cursor/index.html315
-rw-r--r--files/ko/web/css/cursor/using_url_values_for_the_cursor_property/index.html70
2 files changed, 385 insertions, 0 deletions
diff --git a/files/ko/web/css/cursor/index.html b/files/ko/web/css/cursor/index.html
new file mode 100644
index 0000000000..113920f9ee
--- /dev/null
+++ b/files/ko/web/css/cursor/index.html
@@ -0,0 +1,315 @@
+---
+title: cursor
+slug: Web/CSS/cursor
+tags:
+ - CSS
+ - CSS Property
+ - Reference
+ - Web
+translation_of: Web/CSS/cursor
+---
+<div>{{CSSRef}}</div>
+
+<p><a href="/ko/docs/Web/CSS">CSS</a> <strong><code>cursor</code></strong> 속성은 요소 위에 마우스 커서가 올라갔을 때 보여줄 모양을 지정합니다.</p>
+
+<div>{{EmbedInteractiveExample("pages/css/cursor.html")}}</div>
+
+<div class="hidden">The source for this interactive example is stored in a GitHub repository. If you'd like to contribute to the interactive examples project, please clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> and send us a pull request.</div>
+
+<h2 id="구문">구문</h2>
+
+<pre class="brush: css no-line-numbers">/* 키워드 값 */
+cursor: pointer;
+cursor: auto;
+
+/* URL, 대체용 키워드 */
+cursor: url(hand.cur), pointer;
+
+/* URL과 좌표 및 대체 키워드
+crsor: url(cursor1.png) 4 12, auto;
+cursor: url(cursor2.png) 2 2, pointer;
+
+/* 전역 값 */
+cursor: inherit;
+cursor: initial;
+cursor: unset;
+</pre>
+
+<p><code>cursor</code> 속성은 쉼표로 구분한 0개 이상의 <code>{{anch("&lt;url&gt;")}}</code>과, 필수로 지정해야 하는 키워드 값으로 이루어집니다. 각각의 <code>&lt;url&gt;</code>은 이미지 파일을 가리켜야 합니다. 브라우저는 첫 번째 이미지를 불러오려 시도하고, 실패했을 땐 다음 이미지를, 모두 실패하거나 지정한 이미지가 처음부터 없었다면 키워드 값을 사용합니다.</p>
+
+<p><code>&lt;url&gt;</code>은 공백으로 구분한 숫자 쌍을 받을 수 있습니다. 두 숫자는 이미지의 좌상단 모서리를 기준으로, 커서가 상호작용하는 부분의 <a href="#&lt;x>&lt;y>">x, y 좌표</a>를 나타냅니다.</p>
+
+<p>아래 예제는 <code>&lt;url&gt;</code> 값으로 이미지 두 개를 지정했고, 두 번째 이미지는 <code>&lt;x&gt;&lt;y&gt;</code> 좌표도 설정했으며 모두 불러올 수 없으면 <code>progress</code> 키워드를 사용합니다.</p>
+
+<pre class="brush: css">cursor: url(one.svg), url(two.svg) 5 5, progress;</pre>
+
+<h3 id="값">값</h3>
+
+<dl>
+ <dt><a id="&lt;url>" name="&lt;url>"><code id="&lt;url>">&lt;url&gt;</code></a></dt>
+ <dd>이미지 파일을 가리키는 <code>url(…)</code>, 또는 쉼표로 구분한 <code>url(…), url(…), …</code> 목록. 일부 커서 이미지를 사용할 수 없을 때를 대비해 여러 이미지를 지정할 수 있습니다. 이미지를 사용할 경우 URL이 아닌 값(하나 이상의 키워드 값)을 목록의 맨 뒤에 붙여야 합니다. <a href="/ko/docs/Web/CSS/CSS_Basic_User_Interface/Using_URL_values_for_the_cursor_property"><code>cursor</code> 속성값으로 URL 사용하기</a>를 참고하세요.</dd>
+ <dt><a id="&lt;x>&lt;y>" name="&lt;x>&lt;y>"><code>&lt;x&gt;</code> <code>&lt;y&gt;</code></a> {{experimental_inline}}</dt>
+ <dd>xy 좌표. 32 미만의 {{cssxref("&lt;number&gt;")}}여야 합니다.</dd>
+ <dt><span id="Keyword values">키워드 값</span></dt>
+ <dd>
+ <p><em>행 위로 마우스를 올리면 현재 브라우저에서 보이는 모습을 확인할 수 있습니다.</em></p>
+
+ <table class="standard-table">
+ <thead>
+ <tr>
+ <th scope="col">카테고리</th>
+ <th scope="col">CSS 값</th>
+ <th scope="col">예제</th>
+ <th scope="col">설명</th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr style="cursor: auto;">
+ <th rowspan="3" scope="row">일반</th>
+ <td><code>auto</code></td>
+ <td></td>
+ <td>사용자 에이전트가 현재 맥락에 맞춰 표시할 커서를 결정. 예를 들어 글씨 위에서는 <code>text</code>를 사용합니다.</td>
+ </tr>
+ <tr style="cursor: default;">
+ <td><code>default</code></td>
+ <td><img alt="default.gif" src="/@api/deki/files/3438/=default.gif" style="height: 26px; width: 26px;"></td>
+ <td>플랫폼에 따라 다른 기본 커서. 보통 화살표입니다.</td>
+ </tr>
+ <tr style="cursor: none;">
+ <td><code>none</code></td>
+ <td></td>
+ <td>커서 없음.</td>
+ </tr>
+ <tr style="cursor: context-menu;">
+ <th rowspan="5" scope="row" style="cursor: auto;">링크와 상태</th>
+ <td><code>context-menu</code></td>
+ <td><img alt="context-menu.png" src="/@api/deki/files/3461/=context-menu.png" style="height: 26px; width: 26px;"></td>
+ <td>콘텍스트 메뉴 사용 가능.</td>
+ </tr>
+ <tr style="cursor: help;">
+ <td><code>help</code></td>
+ <td><img alt="help.gif" src="/@api/deki/files/3442/=help.gif" style="height: 26px; width: 26px;"></td>
+ <td>도움말 사용 가능.</td>
+ </tr>
+ <tr style="cursor: pointer;">
+ <td><code>pointer</code></td>
+ <td><img alt="pointer.gif" src="/@api/deki/files/3449/=pointer.gif" style="height: 26px; width: 26px;"></td>
+ <td>링크를 나타내는 포인터. 보통 한 쪽을 가리키는 손입니다.</td>
+ </tr>
+ <tr style="cursor: progress;">
+ <td><code>progress</code></td>
+ <td><img alt="progress.gif" src="/@api/deki/files/3450/=progress.gif" style="height: 26px; width: 26px;"></td>
+ <td>프로그램이 백그라운드에서 작업 중이지만, 사용자가 인터페이스와 상호작용할 수 있음. (<code>wait</code>과 반대)</td>
+ </tr>
+ <tr style="cursor: wait;">
+ <td><code>wait</code></td>
+ <td><img alt="wait.gif" src="/@api/deki/files/3457/=wait.gif" style="height: 26px; width: 26px;"></td>
+ <td>프로그램이 작업 중이고, 사용자가 인터페이스와 상호작용할 수 없음. (<code>progress</code>와 반대) 간혹 모래시계나 시계모양 그림을 사용합니다.</td>
+ </tr>
+ <tr style="cursor: cell;">
+ <th rowspan="4" scope="row" style="cursor: auto;">선택</th>
+ <td><code>cell</code></td>
+ <td><img alt="cell.gif" src="/@api/deki/files/3434/=cell.gif" style="height: 26px; width: 26px;"></td>
+ <td>표의 칸이나 여러 칸을 선택할 수 있음.</td>
+ </tr>
+ <tr style="cursor: crosshair;">
+ <td><code>crosshair</code></td>
+ <td><img alt="crosshair.gif" src="/@api/deki/files/3437/=crosshair.gif" style="height: 26px; width: 26px;"></td>
+ <td>십자 커서. 종종 비트맵 선택에 사용합니다.</td>
+ </tr>
+ <tr style="cursor: text;">
+ <td><code>text</code></td>
+ <td><img alt="text.gif" class="default" src="/files/3809/text.gif" style="height: 26px; width: 26px;"></td>
+ <td>글씨 선택 가능. 보통 I빔 모양입니다.</td>
+ </tr>
+ <tr style="cursor: vertical-text;">
+ <td><code>vertical-text</code></td>
+ <td><img alt="vertical-text.gif" src="/@api/deki/files/3456/=vertical-text.gif" style="height: 26px; width: 26px;"></td>
+ <td>세로쓰기 글씨 선택 가능. 보통 옆으로 누운 I빔 모양입니다.</td>
+ </tr>
+ <tr style="cursor: alias;">
+ <th rowspan="7" scope="row" style="cursor: auto;">드래그 앤 드롭</th>
+ <td><code>alias</code></td>
+ <td><img alt="alias.gif" src="/@api/deki/files/3432/=alias.gif" style="height: 26px; width: 26px;"></td>
+ <td>별칭이나 바로가기를 만드는 중.</td>
+ </tr>
+ <tr style="cursor: copy;">
+ <td><code>copy</code></td>
+ <td><img alt="copy.gif" class="default" src="/@api/deki/files/3436/=copy.gif" style="height: 26px; width: 26px;"></td>
+ <td>복사하는 중.</td>
+ </tr>
+ <tr style="cursor: move;">
+ <td><code>move</code></td>
+ <td><img alt="move.gif" src="/@api/deki/files/3443/=move.gif" style="height: 26px; width: 26px;"></td>
+ <td>움직이는 중.</td>
+ </tr>
+ <tr style="cursor: no-drop;">
+ <td><code>no-drop</code></td>
+ <td><img alt="no-drop.gif" class="lwrap" src="/@api/deki/files/3445/=no-drop.gif" style="float: left; height: 26px; width: 33px;"></td>
+ <td>현재 위치에 놓을 수 없음.<br>
+ {{bug("275173")}}: Windows와 Mac OS X에서 <code>no-drop</code>은 <code>not-allowed</code>와 같습니다.</td>
+ </tr>
+ <tr style="cursor: not-allowed;">
+ <td><code>not-allowed</code></td>
+ <td><img alt="not-allowed.gif" src="/@api/deki/files/3446/=not-allowed.gif" style="height: 26px; width: 26px;"></td>
+ <td>요청한 행동을 수행할 수 없음.</td>
+ </tr>
+ <tr id="grab" style="cursor: -moz-grab; cursor: -webkit-grab; cursor: grab;">
+ <td><code>grab</code></td>
+ <td><img alt="grab.gif" class="default" src="/@api/deki/files/3440/=grab.gif"></td>
+ <td>잡을 수 있음. (잡아서 이동)</td>
+ </tr>
+ <tr style="cursor: -moz-grabbing; cursor: -webkit-grabbing; cursor: grabbing;">
+ <td><code>grabbing</code></td>
+ <td><img alt="grabbing.gif" class="default" src="/@api/deki/files/3441/=grabbing.gif"></td>
+ <td>잡고 있음. (잡아서 이동)</td>
+ </tr>
+ <tr style="cursor: all-scroll;">
+ <th rowspan="15" scope="row" style="cursor: auto;">크기 조절과 스크롤</th>
+ <td><code>all-scroll</code></td>
+ <td><img alt="all-scroll.gif" src="/@api/deki/files/3433/=all-scroll.gif" style="height: 26px; width: 26px;"></td>
+ <td>모든 방향으로 이동 가능. (패닝)<br>
+ {{bug("275174")}}: Windows에서 <code>all-scroll</code>은 <code>move</code>와 같습니다.</td>
+ </tr>
+ <tr style="cursor: col-resize;">
+ <td><code>col-resize</code></td>
+ <td><img alt="col-resize.gif" src="/@api/deki/files/3435/=col-resize.gif" style="height: 26px; width: 26px;"></td>
+ <td>항목/행의 크기를 좌우로 조절할 수 있음. 종종 좌우 화살표의 가운데를 세로로 분리한 모양을 사용합니다.</td>
+ </tr>
+ <tr style="cursor: row-resize;">
+ <td><code>row-resize</code></td>
+ <td><img alt="row-resize.gif" src="/@api/deki/files/3451/=row-resize.gif" style="height: 26px; width: 26px;"></td>
+ <td>항목/열의 크기를 상하로 조절할 수 있음. 종종 상하 화살표의 가운데를 가로로 분리한 모양을 사용합니다.</td>
+ </tr>
+ <tr style="cursor: n-resize;">
+ <td><code>n-resize</code></td>
+ <td><img alt="Example of a resize towards the top cursor" src="/files/4083/n-resize.gif" style="border-style: solid; border-width: 0px; height: 26px; width: 26px;"></td>
+ <td rowspan="8" style="cursor: auto;">움직일 수 있는 모서리. 예를 들어, <code>se-resize</code> 커서는 움직임이 사각형의 동남쪽에서 시작할 때 사용합니다. 어떤 환경에선 동일한 방향의 양방향 화살표를 대신 보여줍니다. 즉 <code>n-resize</code>와 <code>s-resize</code>는 <code>ns-resize</code>와 같습니다.</td>
+ </tr>
+ <tr style="cursor: e-resize;">
+ <td><code>e-resize</code></td>
+ <td><img alt="Example of a resize towards the right cursor" src="/files/4085/e-resize.gif" style="height: 26px; width: 26px;"></td>
+ </tr>
+ <tr style="cursor: s-resize;">
+ <td><code>s-resize</code></td>
+ <td><img alt="Example of a resize towards the bottom cursor " src="/files/4087/s-resize.gif" style="height: 26px; width: 26px;"></td>
+ </tr>
+ <tr style="cursor: w-resize;">
+ <td><code>w-resize</code></td>
+ <td><img alt="Example of a resize towards the left cursor" src="/files/4089/w-resize.gif" style="height: 26px; width: 26px;"></td>
+ </tr>
+ <tr style="cursor: ne-resize;">
+ <td><code>ne-resize</code></td>
+ <td><img alt="Example of a resize towards the top-right corner cursor" src="/files/4091/ne-resize.gif" style="height: 26px; width: 26px;"></td>
+ </tr>
+ <tr style="cursor: nw-resize;">
+ <td><code>nw-resize</code></td>
+ <td><img alt="Example of a resize towards the top-left corner cursor" src="/files/4093/nw-resize.gif" style="height: 26px; width: 26px;"></td>
+ </tr>
+ <tr style="cursor: se-resize;">
+ <td><code>se-resize</code></td>
+ <td><img alt="Example of a resize towards the bottom-right corner cursor" src="/files/4097/se-resize.gif" style="height: 26px; width: 26px;"></td>
+ </tr>
+ <tr style="cursor: sw-resize;">
+ <td><code>sw-resize</code></td>
+ <td><img alt="Example of a resize towards the bottom-left corner cursor" src="/files/4095/sw-resize.gif" style="height: 26px; width: 26px;"></td>
+ </tr>
+ <tr style="cursor: ew-resize;">
+ <td><code>ew-resize</code></td>
+ <td><img alt="3-resize.gif" class="default" src="/files/3806/3-resize.gif" style="height: 26px; width: 26px;"></td>
+ <td rowspan="4" style="cursor: auto;">양방향 크기 조절 커서.</td>
+ </tr>
+ <tr style="cursor: ns-resize;">
+ <td><code>ns-resize</code></td>
+ <td><img alt="6-resize.gif" class="default" src="/files/3808/6-resize.gif" style="height: 26px; width: 26px;"></td>
+ </tr>
+ <tr style="cursor: nesw-resize;">
+ <td><code>nesw-resize</code></td>
+ <td><img alt="1-resize.gif" class="default" src="/files/3805/1-resize.gif"></td>
+ </tr>
+ <tr style="cursor: nwse-resize;">
+ <td><code>nwse-resize</code></td>
+ <td><img alt="4-resize.gif" class="default" src="/files/3807/4-resize.gif" style="height: 26px; width: 26px;"></td>
+ </tr>
+ <tr style="cursor: -webkit-zoom-in; cursor: zoom-in;">
+ <th rowspan="2" scope="row" style="cursor: auto;">확대와 축소</th>
+ <td><code>zoom-in</code></td>
+ <td><img alt="zoom-in.gif" class="default" src="/@api/deki/files/3459/=zoom-in.gif"></td>
+ <td rowspan="2" style="cursor: auto;">
+ <p>확대/축소할 수 있음.</p>
+ </td>
+ </tr>
+ <tr style="cursor: -webkit-zoom-out; cursor: zoom-out;">
+ <td><code>zoom-out</code></td>
+ <td><img alt="zoom-out.gif" class="default" src="/@api/deki/files/3460/=zoom-out.gif"></td>
+ </tr>
+ </tbody>
+ </table>
+ </dd>
+</dl>
+
+<h3 id="형식_구문">형식 구문</h3>
+
+<pre class="syntaxbox">{{csssyntax}}
+</pre>
+
+<h2 id="사용_일람">사용 일람</h2>
+
+<p>비록 명세에 cursor의 크기 제한은 정해져있지 않지만, 각각의 {{Glossary("user agent", "사용자 에이전트")}}가 별도로 최대 크기를 규정할 수도 있습니다. 이 때, 크기를 넘어가는 이미지를 사용할 경우, 보통 사용자 에이전트는 해당 이미지를 완전히 무시합니다.</p>
+
+<p>{{anch("브라우저 호환성")}} 항목에서 커서 크기 제한을 찾아보세요.</p>
+
+<h2 id="예제">예제</h2>
+
+<pre class="brush:css">.foo {
+ cursor: crosshair;
+}
+
+.bar {
+ cursor: zoom-in;
+}
+
+/* URL을 쓸 땐 키워드 값 필수 */
+.baz {
+ cursor: url("hyper.cur"), auto;
+}
+</pre>
+
+<h2 id="명세">명세</h2>
+
+<table class="standard-table">
+ <thead>
+ <tr>
+ <th scope="col">Specification</th>
+ <th scope="col">Status</th>
+ <th scope="col">Comment</th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr>
+ <td>{{SpecName('CSS3 Basic UI', '#cursor', 'cursor')}}</td>
+ <td>{{Spec2('CSS3 Basic UI')}}</td>
+ <td>Addition of several keywords and the positioning syntax for <code>url()</code>.</td>
+ </tr>
+ <tr>
+ <td>{{SpecName('CSS2.1', 'ui.html#cursor-props', 'cursor')}}</td>
+ <td>{{Spec2('CSS2.1')}}</td>
+ <td>Initial definition.</td>
+ </tr>
+ </tbody>
+</table>
+
+<p>{{cssinfo}}</p>
+
+<h2 id="브라우저_호환성">브라우저 호환성</h2>
+
+
+
+<div>{{Compat("css.properties.cursor")}}</div>
+
+<h2 id="같이_보기">같이 보기</h2>
+
+<ul>
+ <li><a href="/ko/docs/Web/CSS/CSS_Basic_User_Interface/Using_URL_values_for_the_cursor_property"><code>cursor</code> 속성값으로 URL 사용하기</a></li>
+ <li>{{cssxref("pointer-events")}}</li>
+</ul>
diff --git a/files/ko/web/css/cursor/using_url_values_for_the_cursor_property/index.html b/files/ko/web/css/cursor/using_url_values_for_the_cursor_property/index.html
new file mode 100644
index 0000000000..416718c17f
--- /dev/null
+++ b/files/ko/web/css/cursor/using_url_values_for_the_cursor_property/index.html
@@ -0,0 +1,70 @@
+---
+title: cursor 속성값에 URL 사용
+slug: Web/CSS/cursor/Using_URL_values_for_the_cursor_property
+tags:
+ - CSS
+ - CSS_2.1
+ - Cross-browser_Development
+ - Web Development
+translation_of: Web/CSS/CSS_Basic_User_Interface/Using_URL_values_for_the_cursor_property
+---
+<p><a href="ko/Gecko">Gecko</a> 1.8 (<a href="ko/Firefox_1.5">Firefox 1.5</a>, SeaMonkey 1.0)은 URL 값을 <a class="external" href="http://www.w3.org/TR/CSS21/ui.html#cursor-props">CSS2 커서 속성</a>값으로 사용하는 것을 지원합니다. 이 기능은 마우스 커서 모양으로 임의의 이미지 를 지정할 수 있게 해줍니다 — Gecko가 지원하는 모든 이미지 포맷을 사용할 수 있습니다.</p>
+
+<h3 id=".EB.AC.B8.EB.B2.95" name=".EB.AC.B8.EB.B2.95">문법</h3>
+
+<p>이 속성의 문법은 다음과 같습니다:</p>
+
+<pre class="eval">cursor: [&lt;url&gt;,]* keyword;
+</pre>
+
+<p>즉, URL을 지정하지 않거나 혹은 다수의 콤마로 분리된 URL값들을 지정할 수 있으며, 이 값들 뒤엔 <strong>반드시</strong> <a href="ko/CSS">CSS</a>규정에 정의된 <code>auto</code> 나 <code>pointer</code>같은 키워드들이 따라와야 합니다.</p>
+
+<p>예를 들면, 다음과 같은 값이 지정될 수 있습니다:</p>
+
+<pre class="eval">cursor: url(foo.cur), url(<span class="nowiki">http://www.example.com/bar.gif</span>), auto;
+</pre>
+
+<p>우선 foo.cur의 로딩이 시도 되고, 만약 이 파일이 없거나 어떤 다른 이유로 파일이 부적합할 경우, bar.gif를 로드하게 되고 이것 마저 사용할 수 없게 되면, <code>auto</code>가 사용될 것입니다.</p>
+
+<p>커서 값에 대한 CSS3 <a class="external" href="http://www.w3.org/TR/css3-ui/#cursor">syntax</a> 지원은 Gecko 1.8beta3에 부가되었으며, 따라서 Firefox 1.5에서 사용할 수 있습니다. 이 기능은 커서 이미지의 바운더리에 부착시킬 커서의 핫스팟의 좌표를 지정할 수 있게 해줍니다. 만일 아무것도 지정되지 않을 경우, 핫스팟의 좌표는 이미지 파일 자체에서 (CUR 와 XBN 파일의 경우) 읽어 들이거나 이미지의 좌측 상단 코너로 지정됩니다. CSS3 문법의 예문은 다음과 같습니다:</p>
+
+<pre class="eval">cursor: url(foo.png) 4 12, auto;
+</pre>
+
+<p>첫번째 숫자는 x좌표이며, 두번째 숫자는 y좌표입니다. 이 예문은 이미지의 왼쪽 위 (0,0)로부터 (4, 12)의 위치의 픽셀을 핫스팟으로 지정할 것입니다.</p>
+
+<h3 id=".EC.A0.9C.EC.95.BD_.EC.82.AC.ED.95.AD" name=".EC.A0.9C.EC.95.BD_.EC.82.AC.ED.95.AD">제약 사항</h3>
+
+<p>Gecko가 지원하는 모든 이미지 포팻이 사용가능합니다. 즉, BMP, JPG, CUR, GIF 등의 이미지를 사용할 수 있습니다. 그러나, ANI는 지원되지 않습니다. animated GIF 이미지로 지정해도, 커서는 animated 커서가 되지는 않을 것입니다. 이런 문제점은 향후 릴리즈에서 제거될 것입니다.</p>
+
+<p>Gecko는 커서의 크기에 관해서 어떤 제약을 두고 있지는 않습니다만, 다른 운영체제나 플랫폼들과의 최대의 호환성을 유지하기 위해 커서 크기를 32x32로 제한할것을 권장합니다. 특히, 이보다 큰 커서는 윈도우 9x (95, 98, ME) 에서 작동하지 않을 것입니다.</p>
+
+<p>투명 커서는 XP보다 이전 윈도우 릴리즈에서는 지원되지 않으며, 이는 운영체제의 제약사항입니다. 투명기능은 모든 플랫폼에서 작동합니다.</p>
+
+<p>모질라의 윈도우, OS/2 그리고 리눅스(GTK+ 2.4 나 그 이후 버전 사용) 릴리즈에서만 커서로 URL값이 지원됩니다. 다른 플랫폼들에대한 지원은 향후 릴리즈에 추가될 것입니다.(Mac OS: {{ Bug(286304) }}, QNX Neutrino: {{ Bug(286307) }}, XLib: {{ Bug(286309) }}, Qt: {{ Bug(286310) }}, BeOS: {{ Bug(298184) }}, GTK 2.0/2.2: {{ Bug(308536) }})</p>
+
+<h3 id=".EB.8B.A4.EB.A5.B8_.EB.B8.8C.EB.9D.BC.EC.9A.B0.EC.A0.80.EB.93.A4.EA.B3.BC.EC.9D.98_.ED.98.B8.ED.99.98.EC.84.B1" name=".EB.8B.A4.EB.A5.B8_.EB.B8.8C.EB.9D.BC.EC.9A.B0.EC.A0.80.EB.93.A4.EA.B3.BC.EC.9D.98_.ED.98.B8.ED.99.98.EC.84.B1">다른 브라우저들과의 호환성</h3>
+
+<p>마이크로소프트 인터넷 익스플로러(MSIE)도 <code>cursor</code>속성으로 URL 값을 지원합니다. 그러나, CUR 과 ANI 포맷만을 지원합니다.</p>
+
+<p><code>cursor</code>속성 문법도 또한 제약이 덜한 관계로</p>
+
+<pre class="eval">cursor: url(foo.cur);
+</pre>
+
+<p>이나</p>
+
+<pre class="eval">cursor: url(foo.cur), pointer, url(bar.cur), auto;
+</pre>
+
+<p>와 같은 값도 MSIE에선 작동할 것입니다. 그러나 이런 값은 Gecko에선 작동하지 않을 것입니다. Gecko와의 호환성을 위해서 또 CSS규약에 따라, 항상 URL 리스트를 먼저 나열하시고, 정확히 하나의 키워드 값을 그 뒤에 사용하십시오.</p>
+
+<h3 id="To-do" name="To-do">To-do</h3>
+
+<dl>
+ <dd><em>To-do: document what MSIE does with CSS 3 hotspot locations</em></dd>
+</dl>
+
+<p><span class="comment">Interwiki Language Links</span></p>
+
+<p>{{ languages( { "ja": "ja/Using_URL_values_for_the_cursor_property" } ) }}</p>