W3Schools 튜토리얼을 P-Reinforce v3.1 포맷으로 위키화(영어 본문, 한/영 섹션 헤더). - Topic_HTML: 59문서 (튜토리얼+예제, 레퍼런스/메타 제외) - Topic_CSS: 190문서 (메인 + Advanced/Flexbox/Grid/RWD 전체) - Topic_JavaScript: 120문서 (코어 언어; Temporal/DOM상세/BOM/WebAPI/AJAX/jQuery/Graphics 등은 후속) 각 폴더 00_INDEX.md(MOC) 포함. 코드 verbatim, 미확인분은 "Not found in source" 표기. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
5.8 KiB
id, title, category, status, verification_status, canonical_id, aliases, duplicate_of, source_trust_level, confidence_score, created_at, updated_at, review_reason, merge_history, tags, raw_sources, applied_in, github_commit
| id | title | category | status | verification_status | canonical_id | aliases | duplicate_of | source_trust_level | confidence_score | created_at | updated_at | review_reason | merge_history | tags | raw_sources | applied_in | github_commit | |||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
| html-iframes | HTML Iframes | Frontend | draft | conceptual |
|
B | 0.89 | 2026-06-23 | 2026-06-23 |
|
|
HTML Iframes
🎯 한 줄 통찰 (One-line insight)
An HTML iframe (<iframe>) is an inline frame that embeds another HTML document inside the current page. [S1]
🧠 핵심 개념 (Core concepts)
<iframe>embeds a document — it specifies an inline frame used to embed another document within the current HTML document. [S1]srcattribute — defines the URL of the page to embed. [S1]titleattribute — it is good practice to always include atitle; screen readers use it to read out what the iframe content is. [S1]- Sizing —
heightandwidthattributes (in pixels) set the iframe size; CSSstylecan be used instead. [S1] - Border control — use
style="border:none;"to remove the default border, or a CSSbordervalue to customize it. [S1] - Link target — naming an iframe (
name="...") lets a link target it so the linked page loads inside the iframe. [S1]
🧩 추출된 패턴 (Extracted patterns)
- Embed pattern —
<iframe src="url" title="description"></iframe>to place an external/internal page inside the current one. [S1] - Styling pattern — control size and border with either HTML attributes (
height/width) or inline CSS (style). [S1] - Named-target pattern — give the iframe a
name, then point a link'stargetat that name to load content into the frame. [S1]
📖 세부 내용 (Details)
HTML Iframes. An HTML iframe is used to display a web page within a web page. The HTML <iframe> tag specifies an inline frame. An inline frame is used to embed another document within the current HTML document. [S1]
Iframe Syntax. [S1]
<iframe src="url" title="description"></iframe>
Tip: It is a good practice to always include a
titleattribute for the<iframe>. This is used by screen readers to read out what the content of the iframe is. [S1]
Iframe — Set Height and Width. Use the height and width attributes to specify the size of the iframe. The attribute values are specified in pixels by default, but they can also be in percent (like "80%"). [S1]
<iframe src="demo_iframe.htm" height="200" width="300" title="Iframe Example"></iframe>
Or you can use the CSS height and width properties: [S1]
<iframe src="demo_iframe.htm" style="height:200px;width:300px;" title="Iframe Example"></iframe>
Iframe — Remove the Border. By default, an iframe has a border around it. To remove the border, add the style attribute and use the CSS border property: [S1]
<iframe src="demo_iframe.htm" style="border:none;" title="Iframe Example"></iframe>
With CSS, you can also change the size, style, and color of the iframe's border: [S1]
<iframe src="demo_iframe.htm" style="border:2px solid red;" title="Iframe Example"></iframe>
Iframe — Target for a Link. An iframe can be used as the target frame for a link. The target attribute of the link must refer to the name attribute of the iframe. [S1]
<iframe src="demo_iframe.htm" name="iframe_a" title="Iframe Example"></iframe>
<p><a href="https://www.w3schools.com" target="iframe_a">W3Schools.com</a></p>
Chapter Summary. [S1]
- The HTML
<iframe>tag specifies an inline frame. - The
srcattribute defines the URL of the page to embed. - Always include a
titleattribute (for screen readers). - The
heightandwidthattributes specify the size of the iframe. - Use
border:none;to remove the border around the iframe.
HTML iframe Tag. [S1]
| Tag | Description |
|---|---|
<iframe> |
Defines an inline frame |
🛠️ 적용 사례 (Applied in summary)
The demo_iframe.htm embeds (sized, borderless, custom-border) and the named iframe_a used as a link target are the canonical applied examples. No external project/commit applications found in the source.
💻 코드 패턴 (Code patterns)
Basic iframe (HTML):
<iframe src="url" title="description"></iframe>
Sized, borderless iframe (HTML):
<iframe src="demo_iframe.htm" style="height:200px;width:300px;border:none;" title="Iframe Example"></iframe>
Iframe as link target (HTML):
<iframe src="demo_iframe.htm" name="iframe_a" title="Iframe Example"></iframe>
<a href="https://www.w3schools.com" target="iframe_a">W3Schools.com</a>
⚖️ 모순 및 업데이트 (Contradictions & updates)
No contradictions found in the source. [S1]
✅ 검증 상태 및 신뢰도
- 상태: draft
- 검증 단계: conceptual (실제 적용 사례 발견 시 applied/validated로 승격 가능)
- 출처 신뢰도: B (W3Schools — widely used educational reference, not a primary standards body)
- 신뢰 점수: 0.89
- 중복 검사 결과: 신규 생성 (New discovery)
🔗 지식 그래프 (Knowledge Graph)
- 상위/루트: HTML Tutorial
- 관련 개념: HTML Div, HTML JavaScript, HTML Block and Inline, HTML Tables
- 참조 맥락: Referenced whenever one web page must be embedded inside another, or a link should load content into a named frame.
📚 출처 (Sources)
- [S1] W3Schools — HTML Iframes — https://www.w3schools.com/html/html_iframe.asp
📝 변경 이력 (Change history)
- 2026-06-23: Initial draft synthesized from the W3Schools "HTML Iframes" page (Astra wiki-curation, P-Reinforce v3.1 format).