aboutsummaryrefslogtreecommitdiff
path: root/files/ko/web/css/@import
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/@import
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/@import')
-rw-r--r--files/ko/web/css/@import/index.html83
1 files changed, 83 insertions, 0 deletions
diff --git a/files/ko/web/css/@import/index.html b/files/ko/web/css/@import/index.html
new file mode 100644
index 0000000000..a4648971ae
--- /dev/null
+++ b/files/ko/web/css/@import/index.html
@@ -0,0 +1,83 @@
+---
+title: '@import'
+slug: Web/CSS/@import
+tags:
+ - At-rule
+ - CSS
+ - Reference
+translation_of: Web/CSS/@import
+---
+<div>{{CSSRef}}</div>
+
+<p><span class="seoSummary"><strong><code>@import</code></strong> <a href="/ko/docs/Web/CSS">CSS</a> <a href="/ko/docs/Web/CSS/At-rule">@규칙</a>은 다른 스타일 시트에서 스타일 규칙을 가져올 때 쓰입니다.</span> 이 규칙은 {{cssxref("@charset")}} 규칙을 제외하고 모든 다른 종류의 규칙보다 선행해야 합니다. <code>@import</code>는 <a href="/ko/docs/Web/CSS/Syntax#nested_statements" title="nested statement">중첩 명령문</a>이 아니기 때문에 <a href="/ko/docs/Web/CSS/At-rule#Conditional_Group_Rules" title="conditional group at-rules">조건부 그룹 @규칙</a> 내에 사용할 수 없습니다.</p>
+
+<pre class="brush: css">@import url("fineprint.css") print;
+@import url("bluish.css") speech;
+@import 'custom.css';
+@import url("chrome://communicator/skin/");
+@import "common.css" screen;
+@import url('landscape.css') screen and (orientation:landscape);
+</pre>
+
+<p>사용자 에이전트는 지원되지 않는 미디어 유형에 대한 자원 검색을 피할 수 있도록, 제작자는 미디어에 의존한 <code>@import</code> 규칙을 지정할 수 있습니다. 이러한 조건부 import는 URI 뒤에 쉼표로 구분된 <a href="/ko/docs/Web/CSS/Media_Queries/Using_media_queries" title="media queries">미디어 질의</a>를 지정합니다. 미디어 질의가 없으면, import는 무조건(unconditional)입니다. 미디어에 <code>all</code>을 지정하면 같은 효과가 있습니다.</p>
+
+<h2 id="구문">구문</h2>
+
+<pre class="syntaxbox">@import <em>url</em>;
+@import <em>url</em> <em>list-of-media-queries</em>;
+</pre>
+
+<p>where:</p>
+
+<dl>
+ <dt><code><em>url</em></code></dt>
+ <dd>import할 자원의 위치를 나타내는 {{cssxref("&lt;string&gt;")}} 또는 {{cssxref("&lt;uri&gt;")}}입니다. URL은 절대 또는 상대일 수 있습니다. URL은 실제로 파일에 지정할 필요는 없음을 주의하세요; 그냥 패키지 명 및 일부를 지정할 수 있으며 적절한 파일이 자동으로 선택됩니다(가령 <strong>chrome://communicator/skin/</strong>). 자세한 내용은 <a href="/ko/docs/XUL_Tutorial/The_Chrome_URL">여기를 참조</a>.</dd>
+ <dt><code><em>list-of-media-queries</em></code></dt>
+ <dd>링크된 URL 내에 정의된 CSS 규칙의 적용을 조절하는 쉼표 구분된 <a href="/ko/docs/Web/CSS/Media_Queries/Using_media_queries" title="media queries">미디어 질의</a> 목록입니다. 브라우저가 이러한 질의를 지원하지 않으면, 링크된 자원을 로드하지 않습니다.</dd>
+</dl>
+
+<h3 id="형식_구문">형식 구문</h3>
+
+<pre class="syntaxbox">{{csssyntax}}
+</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 Cascade', '#at-ruledef-import', '@import')}}</td>
+ <td>{{Spec2('CSS3 Cascade')}}</td>
+ <td> </td>
+ </tr>
+ <tr>
+ <td>{{SpecName('CSS3 Media Queries', '#media0', '@import')}}</td>
+ <td>{{Spec2('CSS3 Media Queries')}}</td>
+ <td>Extended the syntax to support any media query and not only simple <a href="/en-US/docs/Web/CSS/@media#Media_types">media types</a>.</td>
+ </tr>
+ <tr>
+ <td>{{SpecName('CSS2.1', 'cascade.html#at-import', '@import')}}</td>
+ <td>{{Spec2('CSS2.1')}}</td>
+ <td>Added support for {{cssxref("&lt;string&gt;")}} to denote the url of a stylesheet,<br>
+ and requirement to insert the <code>@import</code> rule at the beginning of the CSS document.</td>
+ </tr>
+ <tr>
+ <td>{{SpecName('CSS1', '#the-cascade', '@import')}}</td>
+ <td>{{Spec2('CSS1')}}</td>
+ <td>Initial definition</td>
+ </tr>
+ </tbody>
+</table>
+
+<h2 id="브라우저_호환성">브라우저 호환성</h2>
+
+
+
+<p>{{Compat("css.at-rules.import")}}</p>