refactor(topics): 멀티 에이전트용 지식 재편 — _Common(공통 기본기) + Domain_* 구조
에이전트 8종(대화형/프로그래머 C·S/디자이너/설계자/기획자/QA/PD/PM)에게 [공통 기본 능력 + 롤별 Specialty] 2층으로 지식을 주입하기 위한 재분류. 문서 내용·포맷은 무수정, 폴더 이동만 (6,372개 문서 수 보존 확인). - Topic_Programming → Domain_Programming (내부 구조 보존) - Topic_Graphic → Domain_Design - Topic_Business → Domain_Product - Topic_General → Domain_General - _Common 신설: Math(구 Topic_Math_Specialty), Reasoning(구 General/From_Thinking & Reasoning), Reasoning_Creativity(구 General/From_창의성), Communication(Poetic_Blog_Writing + From_writing) - 타 도메인의 From_* 폴더는 유지 (출처 표기일 뿐, 이미 도메인에 맞게 분류된 문서) - 빈 폴더 정리 (memory/procedures) - 에이전트→폴더 매핑은 workspace의 .astra/agent-knowledge-map.json (9개 에이전트) Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
This commit is contained in:
Antigravity Agent
@@ -0,0 +1,133 @@
|
||||
---
|
||||
id: css-display
|
||||
title: "CSS Display"
|
||||
category: "Frontend"
|
||||
status: "draft"
|
||||
verification_status: "conceptual"
|
||||
canonical_id: ""
|
||||
aliases: ["display property", "block vs inline", "display block", "display inline-block", "display none"]
|
||||
duplicate_of: ""
|
||||
source_trust_level: "B"
|
||||
confidence_score: 0.89
|
||||
created_at: 2026-06-23
|
||||
updated_at: 2026-06-23
|
||||
review_reason: ""
|
||||
merge_history: []
|
||||
tags: ["css", "web", "frontend", "w3schools", "display", "layout", "block", "inline"]
|
||||
raw_sources: ["https://www.w3schools.com/css/css_display.asp"]
|
||||
applied_in: []
|
||||
github_commit: ""
|
||||
---
|
||||
|
||||
# [[CSS Display]]
|
||||
|
||||
## 🎯 한 줄 통찰 (One-line insight)
|
||||
The `display` property controls layout by specifying whether an HTML element is treated as a block or an inline element. [S1]
|
||||
|
||||
## 🧠 핵심 개념 (Core concepts)
|
||||
- **Layout control** — the `display` property is an important CSS property for controlling layout; it specifies whether an HTML element is treated as a block or an inline element. [S1]
|
||||
- **Block-level elements** — a block-level element ALWAYS starts on a new line and takes up the full width available (stretches out to the left and right as far as it can). Examples: `<div>`, `<h1>`–`<h6>`, `<p>`, `<form>`, `<header>`, `<footer>`, `<section>`. [S1]
|
||||
- **Inline elements** — an inline element DOES NOT start on a new line and only takes up as much width as necessary. Examples: `<span>`, `<a>`, `<img>`. [S1]
|
||||
- **Display changes presentation, not type** — setting the display property of an element only changes how the element is displayed, NOT what kind of element it is. [S1]
|
||||
- **`none` removes from flow** — `display: none;` makes an element completely hidden from the document flow (does not take up any space). [S1]
|
||||
|
||||
## 🧩 추출된 패턴 (Extracted patterns)
|
||||
- **Override default display** — change an element's default display to suit layout, e.g. make `<li>` inline or make `<span>`/`<a>` block. [S1]
|
||||
- **`inline-block`** — provides an inline-level block container that supports height, width, padding, and margin. [S1]
|
||||
|
||||
## 📖 세부 내용 (Details)
|
||||
The `display` property is an important CSS property for controlling layout. It specifies whether an HTML element is treated as a block or an inline element. [S1]
|
||||
|
||||
**Block-level Elements**
|
||||
A block-level element ALWAYS starts on a new line and takes up the full width available (stretches out to the left and right as far as it can). Examples include `<div>`, `<h1>`–`<h6>`, `<p>`, `<form>`, `<header>`, `<footer>`, and `<section>`. [S1]
|
||||
|
||||
**Inline Elements**
|
||||
An inline element DOES NOT start on a new line and only takes up as much width as necessary. Examples include `<span>`, `<a>`, and `<img>`. [S1]
|
||||
|
||||
**Common Display Values** [S1]
|
||||
|
||||
| Value | Description |
|
||||
|-------|-------------|
|
||||
| inline | Displays an element as an inline element |
|
||||
| block | Displays an element as a block element |
|
||||
| contents | Makes the container disappear, child elements move up a DOM level |
|
||||
| flex | Block-level flex container |
|
||||
| grid | Block-level grid container |
|
||||
| inline-block | Inline-level block container with height/width/padding/margin support |
|
||||
| none | Completely hidden from the document flow (does not take up any space) |
|
||||
|
||||
**Display each `<li>` as inline:** [S1]
|
||||
```css
|
||||
li {
|
||||
display: inline;
|
||||
}
|
||||
```
|
||||
|
||||
**Display `<span>` as a block element:** [S1]
|
||||
```css
|
||||
span {
|
||||
display: block;
|
||||
}
|
||||
```
|
||||
|
||||
**Display anchor `<a>` as a block element:** [S1]
|
||||
```css
|
||||
a {
|
||||
display: block;
|
||||
}
|
||||
```
|
||||
|
||||
**Applying multiple display values:** [S1]
|
||||
```css
|
||||
p.ex1 {display: none;}
|
||||
p.ex2 {display: inline;}
|
||||
p.ex3 {display: block;}
|
||||
p.ex4 {display: inline-block;}
|
||||
p.ex5 {display: flex;}
|
||||
p.ex6 {display: grid;}
|
||||
```
|
||||
|
||||
**Note:** Setting the display property of an element only changes how the element is displayed, NOT what kind of element it is. [S1]
|
||||
|
||||
## ⚖️ 비교 및 선택 기준 (Comparison & decision criteria)
|
||||
- **Block vs inline** — choose block (`display: block;`) when the element should start on a new line and take the full width; choose inline (`display: inline;`) when it should flow within text and take only the width it needs. [S1]
|
||||
- **`inline-block`** — choose this when you need inline placement (no forced new line) but still want to set height, width, padding, and margin. [S1]
|
||||
- **`none`** — choose when the element should be completely removed from the flow and take up no space. [S1]
|
||||
|
||||
## 🛠️ 적용 사례 (Applied in summary)
|
||||
The page's own examples are the applied cases: `<li>` set to inline, `<span>` and `<a>` set to block, and a paragraph set demonstrating `none`, `inline`, `block`, `inline-block`, `flex`, and `grid`. No external project/commit applications found in the source.
|
||||
|
||||
## 💻 코드 패턴 (Code patterns)
|
||||
Override default display to inline (language: CSS):
|
||||
```css
|
||||
li {
|
||||
display: inline;
|
||||
}
|
||||
```
|
||||
Override default display to block (language: CSS):
|
||||
```css
|
||||
span {
|
||||
display: block;
|
||||
}
|
||||
```
|
||||
|
||||
## ⚖️ 모순 및 업데이트 (Contradictions & updates)
|
||||
No contradictions found in the source.
|
||||
|
||||
## ✅ 검증 상태 및 신뢰도
|
||||
- **상태:** draft
|
||||
- **검증 단계:** conceptual (실제 적용 사례 발견 시 applied/validated로 승격 가능)
|
||||
- **출처 신뢰도:** B (W3Schools — widely used educational reference, not a primary standards body)
|
||||
- **신뢰 점수:** 0.89
|
||||
- **중복 검사 결과:** 신규 생성 (New discovery)
|
||||
|
||||
## 🔗 지식 그래프 (Knowledge Graph)
|
||||
- **상위/루트:** [[CSS Tutorial]]
|
||||
- **관련 개념:** [[CSS Visibility Hide]], [[CSS Max Width]], [[CSS Position]]
|
||||
- **참조 맥락:** Referenced whenever controlling how an element participates in page layout (block vs inline) or removing it from flow.
|
||||
|
||||
## 📚 출처 (Sources)
|
||||
- [S1] W3Schools — CSS Display — https://www.w3schools.com/css/css_display.asp
|
||||
|
||||
## 📝 변경 이력 (Change history)
|
||||
- 2026-06-23: Initial draft synthesized from the W3Schools "CSS Display" page (Astra wiki-curation, P-Reinforce v3.1 format).
|
||||
Reference in New Issue
Block a user