koriweb
9609c04755
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>
7.9 KiB
7.9 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 | |||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
| css-tutorial-index | CSS Tutorial | Frontend | draft | conceptual |
|
B | 0.90 | 2026-06-23 | 2026-06-23 |
|
|
CSS Tutorial
🎯 한 줄 통찰 (One-line insight)
Map of Content (MOC) for the W3Schools CSS Tutorial — the root that links every CSS knowledge page in this topic folder. [S1]
🧠 핵심 개념 (Core concepts)
- This folder (
Topic_CSS) wikifies the W3Schools CSS Tutorial (left-sidebar tutorial menu), one knowledge page per document, in P-Reinforce v3.1 format. [S1] - Scope: tutorial + "Learning by examples" pages only. The CSS Reference tables and non-knowledge meta pages (Quiz, Exercises, Certificate, Bootcamp, Syllabus) are excluded by design. [S1]
- Progress: the entire CSS Tutorial is complete (190 docs) — main section + CSS Advanced + Flexbox + Grid + Responsive (RWD).
- Every page roots its Knowledge Graph back to this
[[CSS Tutorial]]node.
📖 세부 내용 (Details)
Intro & Syntax
How To Add CSS
Colors
Backgrounds
- CSS Background Color
- CSS Background Image
- CSS Background Repeat
- CSS Background Attachment
- CSS Background Shorthand
Borders
- CSS Border Style
- CSS Border Width
- CSS Border Color
- CSS Border Sides
- CSS Border Shorthand
- CSS Rounded Borders
Margins & Padding
Dimensions & Box Model
Outline
Text
- CSS Text Color
- CSS Text Alignment
- CSS Text Decoration
- CSS Text Decoration Styles
- CSS Text Transformation
- CSS Text Spacing
- CSS Text Shadow
Fonts
- CSS Font Family
- CSS Web Safe Fonts
- CSS Font Fallbacks
- CSS Font Style
- CSS Font Size
- CSS Google Fonts
- CSS Font Pairings
- CSS Font Shorthand
Icons
Links & Lists
Tables
Display, Position & Layout
- CSS Display
- CSS Visibility and Hide
- CSS Position Static and Relative
- CSS Position Fixed and Absolute
- CSS Position Sticky
- CSS Position Offsets
- CSS Z-index
- CSS Overflow
- CSS Overflow X and Y
- CSS Float
- CSS Clear and Clearfix
- CSS Float Examples
- CSS Inline-block
- CSS Center Align
- CSS Horizontal Align
- CSS Vertical Align
Selectors (Advanced) & Pseudo
- CSS Combinators
- CSS Pseudo-classes
- CSS Interactive Pseudo-classes
- CSS Structural Pseudo-classes
- CSS Pseudo-elements
- CSS Text Pseudo-elements
- CSS Content Pseudo-elements
- CSS Attribute Selectors
- CSS Advanced Attribute Selectors
UI Components
- CSS Opacity
- CSS Navigation Bar
- CSS Vertical Navbar
- CSS Horizontal Navbar
- CSS Dropdowns
- CSS Advanced Dropdowns
- CSS Image Gallery
- CSS Image Sprites
Forms
Counters, Units & Cascade
- CSS Counters
- CSS Nested Counters
- CSS Units
- CSS Absolute Units
- CSS Relative Units
- CSS Inheritance
- CSS Specificity
- CSS Specificity Hierarchy
- CSS !important
Functions, Performance & Layout
CSS Advanced — Borders, Backgrounds & Colors
- CSS Rounded Corners
- CSS Border Images
- CSS Multiple Backgrounds
- CSS Background Size
- CSS Background Origin
- CSS Background Clip
- CSS Colors (CSS3)
- CSS Color Keywords
CSS Advanced — Gradients, Shadows & Effects
- CSS Linear Gradients
- CSS Radial Gradients
- CSS Conic Gradients
- CSS Text Shadow Effects
- CSS Box Shadow
- CSS Text Effects
- CSS Custom Fonts
CSS Advanced — Transforms, Transitions & Animations
- CSS 2D Transforms
- CSS 2D Transform Scale
- CSS 2D Transform Skew and Matrix
- CSS 3D Transforms
- CSS Transitions
- CSS Transition Timing
- CSS Animations
- CSS Animation Timing
- CSS Animation Properties
CSS Advanced — Images & UI
- CSS Tooltips
- CSS Tooltip Arrows
- CSS Image Styling
- CSS Image Effects
- CSS Image Hover Overlays
- CSS Image Modal
- CSS Image Centering
- CSS Image Filters
- CSS Image Shapes
- CSS object-fit
- CSS object-position
- CSS Masking with PNG
- CSS Masking with Gradients
- CSS Masking with SVG
- CSS Styling Buttons
- CSS Button Hover Effects
- CSS Button Groups
- CSS Pagination
- CSS Pagination Styles
- CSS Multiple Columns
- CSS Multiple Column Rules
- CSS User Interface
CSS Advanced — Variables, @property, Box Sizing & Media Queries
- CSS Variables var()
- CSS Overriding Variables
- CSS Variables and JavaScript
- CSS Variables in Media Queries
- CSS @property
- CSS Box Sizing
- CSS Media Queries
- CSS Media Queries Examples
CSS Flexbox
- CSS Flexbox Intro
- CSS Flexbox Container
- CSS Flexbox Justify Content
- CSS Flexbox Align Items
- CSS Flex Items
- CSS Flexbox Responsive
CSS Grid
- CSS Grid Intro
- CSS Grid Container
- CSS Grid Tracks
- CSS Grid Gaps
- CSS Grid Align
- CSS Grid Items
- CSS Grid Item Named
- CSS Grid Item Align
- CSS Grid Item Order
- CSS Grid 12-column Layout
- CSS @supports
CSS Responsive (RWD)
- CSS RWD Intro
- CSS RWD Viewport
- CSS RWD Grid View
- CSS RWD Media Queries
- CSS RWD Images
- CSS RWD Videos
🛠️ 적용 사례 (Applied in summary)
190 knowledge documents generated for the complete CSS Tutorial (main section + Advanced + Flexbox + Grid + Responsive), all grounded in the corresponding W3Schools pages.
✅ 검증 상태 및 신뢰도
- 상태: draft
- 검증 단계: conceptual
- 출처 신뢰도: B (W3Schools — widely used educational reference)
- 신뢰 점수: 0.90
- 중복 검사 결과: 신규 생성 (New discovery)
🔗 지식 그래프 (Knowledge Graph)
- 상위/루트: 10_Wiki
- 관련 개념: CSS Introduction, CSS Box Model, CSS Selectors, HTML Tutorial
- 참조 맥락: Entry point for the W3Schools CSS knowledge set; sits alongside HTML Tutorial; future Topic_JavaScript / Topic_SQL folders will join them.
📚 출처 (Sources)
- [S1] W3Schools — CSS Tutorial — https://www.w3schools.com/css/
📝 변경 이력 (Change history)
- 2026-06-23: Created CSS Tutorial MOC and linked the 112 main-section docs; Advanced/Flexbox/Grid/Responsive marked pending (Astra wiki-curation, P-Reinforce v3.1 format).
- 2026-06-23: Completed CSS Advanced + Flexbox + Grid + Responsive (77 docs) and linked all sections; CSS Tutorial now complete at 190 docs.