• Skip to main content
  • Skip to search
  • Skip to select language
MDN Web Docs
  • References
    • Overview / Web Technology

      Web technology reference for developers

    • HTML

      Structure of content on the web

    • CSS

      Code used to describe document style

    • JavaScript

      General-purpose scripting language

    • HTTP

      Protocol for transmitting web resources

    • Web APIs

      Interfaces for building web applications

    • Web Extensions

      Developing extensions for web browsers

    • Web Technology

      Web technology reference for developers

  • Guides
    • Overview / MDN Learning Area

      Learn web development

    • MDN Learning Area

      Learn web development

    • HTML

      Learn to structure web content with HTML

    • CSS

      Learn to style content using CSS

    • JavaScript

      Learn to run scripts in the browser

    • Accessibility

      Learn to make the web accessible to all

  • Plus
    • Overview

      A customized MDN experience

    • AI Help

      Get real-time assistance and support

    • Updates

      All browser compatibility updates at a glance

    • Documentation

      Learn how to use MDN Plus

    • FAQ

      Frequently asked questions about MDN Plus

  • Curriculum
  • Blog
    • Playground

      Write, test and share your code

    • HTTP Observatory

      Scan a website for free

    • AI Help

      Get real-time assistance and support

  • Log in
  • Sign up for free
  1. 개발자를 위한 웹 기술
  2. CSS
  3. CSS Namespaces
    • English (US)
    • Français
    • 日本語

이 페이지는 영어로부터 커뮤니티에 의하여 번역되었습니다. MDN Web Docs에서 한국 커뮤니티에 가입하여 자세히 알아보세요.

목차

  • 참고서
  • 명세
  1. CSS
  2. 자습서
  3. CSS 기초
  4. CSS 첫 번째 단계
    1. CSS 첫 번째 단계
    2. CSS란 무엇인가?
    3. CSS 시작하기
    4. CSS의 구조
    5. CSS 작동 방식
    6. 과제: 프로필 페이지 만들기
  5. CSS 구성요소
    1. CSS 구성요소
    2. CSS 선택자
    3. Type, class, and ID selectors
    4. Attribute selectors
    5. Pseudo-classes and pseudo-elements
    6. Combinators
    7. 계단식 및 상속
    8. Cascade layers
    9. 박스 모델
    10. 배경 및 테두리
    11. 텍스트 표시 방향 제어하기
    12. 콘텐츠 overflow
    13. CSS 값과 단위
    14. CSS에서 항목 크기 조정
    15. 이미지, 미디어 및 양식 요소
    16. 표 꾸미기
    17. CSS 디버깅
    18. CSS 구성
    19. 과제: 기본적인 CSS 이해
    20. 과제: 이쁜 레터 모양 종이 만들기
    21. 과제: 멋진 박스 만들기
  6. 텍스트 꾸미기
    1. 텍스트 꾸미기
    2. 기본적인 텍스트 및 글꼴 꾸미기
    3. 목록 꾸미기
    4. 링크 꾸미기
    5. 웹 글꼴
    6. 과제: 학교 홈페이지 만들기
  7. CSS 레이아웃
    1. CSS 레이아웃
    2. CSS 레이아웃 입문서
    3. 일반 대열
    4. 플렉스박스
    5. 그리드
    6. Floats
    7. 위치 잡기
    8. 다단 레이아웃
    9. 반응형 디자인
    10. 초보자를 위한 미디어 쿼리 안내서
    11. 레거시 레이아웃 메서드
    12. 이전 브라우저 지원
    13. 과제 기본적인 레이아웃 사용하기
  8. CSS 참고서
  9. Modules
    1. CSS anchor positioning
    2. CSS animations
    3. CSS 배경 및 테두리
    4. CSS Basic User Interface
    5. CSS box alignment
    6. CSS box model
    7. CSS box sizing
    8. CSS cascade and inheritance
    9. CSS Custom Properties for Cascading Variables
    10. CSS color adjustment
    11. CSS colors
    12. Compositing and Blending
    13. CSS Conditional Rules
    14. CSS Containment
    15. CSS counter styles
    16. CSS display
    17. Filter Effects
    18. CSS Flexible Box Layout
    19. CSS font loading
    20. CSS Fonts
    21. CSS fragmentation
    22. CSS Generated Content
    23. CSS 그리드 레이아웃
    24. CSS Images
    25. CSS Lists
    26. CSS 논리적 속성과 값
    27. CSS Masking
    28. 미디어 쿼리
    29. CSS motion path
    30. CSS Multi-column Layout
    31. CSS Namespaces
    32. CSS nesting
    33. CSS overflow
    34. CSS overscroll behavior
    35. CSS paged media
    36. CSS positioned layout
    37. CSS properties and values API
    38. CSS pseudo-elements
    39. CSS Ruby
    40. CSS scoping
    41. CSS scroll-driven animations
    42. CSS Scroll Snap Points
    43. CSS Scrollbars
    44. CSS 선택자
    45. CSS shadow parts
    46. CSS Shapes
    47. CSS Charsets
    48. CSS Table
    49. CSS text
    50. CSS Text Decoration
    51. CSS transforms
    52. CSS Transitions
    53. CSS view transitions
    54. CSS Writing Modes
    55. CSSOM view
  10. Properties
    1. -moz-*
      1. -moz-float-edge 비표준 지원이 중단되었습니다
      2. -moz-force-broken-image-icon 비표준 지원이 중단되었습니다
      3. -moz-image-region 비표준
      4. -moz-orient 비표준
      5. -moz-user-focus 비표준 지원이 중단되었습니다
      6. -moz-user-input 비표준 지원이 중단되었습니다
    2. -webkit-*
      1. -webkit-border-before 비표준
      2. -webkit-box-reflect 비표준
      3. -webkit-line-clamp
      4. -webkit-mask-box-image 비표준
      5. -webkit-mask-composite 비표준
      6. -webkit-mask-position-x 비표준
      7. -webkit-mask-position-y 비표준
      8. -webkit-mask-repeat-x 비표준
      9. -webkit-mask-repeat-y 비표준
      10. -webkit-tap-highlight-color 비표준
      11. -webkit-text-fill-color
      12. -webkit-text-security 비표준
      13. -webkit-text-stroke
      14. -webkit-text-stroke-color
      15. -webkit-text-stroke-width
      16. -webkit-touch-callout 비표준
    3. accent-color
    4. align-*
      1. align-content
      2. align-items
      3. align-self
    5. all
    6. anchor-name Experimental
    7. animation-*
      1. animation
      2. animation-composition
      3. animation-delay
      4. animation-direction
      5. animation-duration
      6. animation-fill-mode
      7. animation-iteration-count
      8. animation-name
      9. animation-play-state
      10. animation-range Experimental
      11. animation-range-end Experimental
      12. animation-range-start Experimental
      13. animation-timeline Experimental
      14. animation-timing-function
    8. appearance
    9. aspect-ratio
    10. backdrop-filter
    11. backface-visibility
    12. background-*
      1. background
      2. background-attachment
      3. background-blend-mode
      4. background-clip
      5. background-color
      6. background-image
      7. background-origin
      8. background-position
      9. background-position-x
      10. background-position-y
      11. background-repeat
      12. background-size
    13. block-size
    14. border-*
      1. border
      2. border-block
      3. border-block-color
      4. border-block-end
      5. border-block-end-color
      6. border-block-end-style
      7. border-block-end-width
      8. border-block-start
      9. border-block-start-color
      10. border-block-start-style
      11. border-block-start-width
      12. border-block-style
      13. border-block-width
      14. border-bottom
      15. border-bottom-color
      16. border-bottom-left-radius
      17. border-bottom-right-radius
      18. border-bottom-style
      19. border-bottom-width
      20. border-collapse
      21. border-color
      22. border-end-end-radius
      23. border-end-start-radius
      24. border-image
      25. border-image-outset
      26. border-image-repeat
      27. border-image-slice
      28. border-image-source
      29. border-image-width
      30. border-inline
      31. border-inline-color
      32. border-inline-end
      33. border-inline-end-color
      34. border-inline-end-style
      35. border-inline-end-width
      36. border-inline-start
      37. border-inline-start-color
      38. border-inline-start-style
      39. border-inline-start-width
      40. border-inline-style
      41. border-inline-width
      42. border-left
      43. border-left-color
      44. border-left-style
      45. border-left-width
      46. border-radius
      47. border-right
      48. border-right-color
      49. border-right-style
      50. border-right-width
      51. border-spacing
      52. border-start-end-radius
      53. border-start-start-radius
      54. border-style
      55. border-top
      56. border-top-color
      57. border-top-left-radius
      58. border-top-right-radius
      59. border-top-style
      60. border-top-width
      61. border-width
    15. bottom
    16. box-*
      1. box-align 비표준 지원이 중단되었습니다
      2. box-decoration-break
      3. box-direction 비표준 지원이 중단되었습니다
      4. box-flex 비표준 지원이 중단되었습니다
      5. box-flex-group 비표준 지원이 중단되었습니다
      6. box-lines 비표준 지원이 중단되었습니다
      7. box-ordinal-group 비표준 지원이 중단되었습니다
      8. box-orient 비표준 지원이 중단되었습니다
      9. box-pack 비표준 지원이 중단되었습니다
      10. box-shadow
      11. box-sizing
    17. break-*
      1. break-after
      2. break-before
      3. break-inside
    18. caption-side
    19. caret-color
    20. clear
    21. clip-*
      1. clip 지원이 중단되었습니다
      2. clip-path
      3. clip-rule
    22. color-*
      1. color
      2. color-interpolation
      3. color-interpolation-filters
      4. color-scheme
    23. column-*
      1. column-count
      2. column-fill
      3. column-gap
      4. column-rule
      5. column-rule-color
      6. column-rule-style
      7. column-rule-width
      8. column-span
      9. column-width
    24. columns
    25. contain-*
      1. contain
      2. contain-intrinsic-block-size
      3. contain-intrinsic-height
      4. contain-intrinsic-inline-size
      5. contain-intrinsic-size
      6. contain-intrinsic-width
    26. container-*
      1. container
      2. container-name
      3. container-type
    27. content
    28. content-visibility
    29. counter-*
      1. counter-increment
      2. counter-reset
      3. counter-set
    30. cursor
    31. cx
    32. cy
    33. d
    34. direction
    35. display
    36. dominant-baseline
    37. empty-cells
    38. field-sizing Experimental
    39. fill-*
      1. fill
      2. fill-opacity
      3. fill-rule
    40. filter
    41. flex-*
      1. flex
      2. flex-basis
      3. flex-direction
      4. flex-flow
      5. flex-grow
      6. flex-shrink
      7. flex-wrap
    42. float
    43. font-*
      1. font
      2. font-family
      3. font-feature-settings
      4. font-kerning
      5. font-language-override
      6. font-optical-sizing
      7. font-palette
      8. font-size
      9. font-size-adjust
      10. font-smooth 비표준
      11. font-stretch
      12. font-style
      13. font-synthesis
      14. font-synthesis-position
      15. font-synthesis-small-caps
      16. font-synthesis-style
      17. font-synthesis-weight
      18. font-variant
      19. font-variant-alternates
      20. font-variant-caps
      21. font-variant-east-asian
      22. font-variant-emoji
      23. font-variant-ligatures
      24. font-variant-numeric
      25. font-variant-position
      26. font-variation-settings
      27. font-weight
    44. forced-color-adjust
    45. gap
    46. grid-*
      1. grid
      2. grid-area
      3. grid-auto-columns
      4. grid-auto-flow
      5. grid-auto-rows
      6. grid-column
      7. grid-column-end
      8. grid-column-start
      9. grid-row
      10. grid-row-end
      11. grid-row-start
      12. grid-template
      13. grid-template-areas
      14. grid-template-columns
      15. grid-template-rows
    47. hanging-punctuation
    48. height
    49. hyphenate-character
    50. hyphenate-limit-chars
    51. hyphens
    52. image-*
      1. image-orientation
      2. image-rendering
      3. image-resolution Experimental
    53. initial-letter
    54. inline-size
    55. inset-*
      1. inset
      2. inset-block
      3. inset-block-end
      4. inset-block-start
      5. inset-inline
      6. inset-inline-end
      7. inset-inline-start
    56. isolation
    57. justify-*
      1. justify-content
      2. justify-items
      3. justify-self
    58. left
    59. letter-spacing
    60. line-*
      1. line-break
      2. line-height
      3. line-height-step Experimental
    61. list-*
      1. list-style
      2. list-style-image
      3. list-style-position
      4. list-style-type
    62. margin-*
      1. margin
      2. margin-block
      3. margin-block-end
      4. margin-block-start
      5. margin-bottom
      6. margin-inline
      7. margin-inline-end
      8. margin-inline-start
      9. margin-left
      10. margin-right
      11. margin-top
      12. margin-trim Experimental
    63. marker-*
      1. marker
      2. marker-end
      3. marker-mid
      4. marker-start
    64. mask-*
      1. mask
      2. mask-border
      3. mask-border-mode
      4. mask-border-outset
      5. mask-border-repeat
      6. mask-border-slice
      7. mask-border-source
      8. mask-border-width
      9. mask-clip
      10. mask-composite
      11. mask-image
      12. mask-mode
      13. mask-origin
      14. mask-position
      15. mask-repeat
      16. mask-size
      17. mask-type
    65. math-*
      1. math-depth
      2. math-shift Experimental
      3. math-style
    66. max-*
      1. max-block-size
      2. max-height
      3. max-inline-size
      4. max-width
    67. min-*
      1. min-block-size
      2. min-height
      3. min-inline-size
      4. min-width
    68. mix-blend-mode
    69. object-fit
    70. object-position
    71. offset-*
      1. offset
      2. offset-anchor
      3. offset-distance
      4. offset-path
      5. offset-position
      6. offset-rotate
    72. opacity
    73. order
    74. orphans
    75. outline-*
      1. outline
      2. outline-color
      3. outline-offset
      4. outline-style
      5. outline-width
    76. overflow-*
      1. overflow
      2. overflow-anchor
      3. overflow-block
      4. overflow-clip-margin
      5. overflow-inline
      6. overflow-wrap
      7. overflow-x
      8. overflow-y
    77. overlay Experimental
    78. overscroll-*
      1. overscroll-behavior
      2. overscroll-behavior-block
      3. overscroll-behavior-inline
      4. overscroll-behavior-x
      5. overscroll-behavior-y
    79. padding-*
      1. padding
      2. padding-block
      3. padding-block-end
      4. padding-block-start
      5. padding-bottom
      6. padding-inline
      7. padding-inline-end
      8. padding-inline-start
      9. padding-left
      10. padding-right
      11. padding-top
    80. page-*
      1. page
      2. page-break-after
      3. page-break-before
      4. page-break-inside
    81. paint-order
    82. perspective
    83. perspective-origin
    84. place-*
      1. place-content
      2. place-items
      3. place-self
    85. pointer-events
    86. position-*
      1. position
      2. position-anchor Experimental
      3. position-area Experimental
      4. position-try Experimental
      5. position-try-fallbacks Experimental
      6. position-try-order Experimental
      7. position-visibility Experimental
    87. print-color-adjust
    88. quotes
    89. r
    90. resize
    91. right
    92. rotate
    93. row-gap
    94. ruby-align
    95. ruby-position
    96. rx
    97. ry
    98. scale
    99. scroll-*
      1. 스크롤 동작
      2. scroll-margin
      3. scroll-margin-block
      4. scroll-margin-block-end
      5. scroll-margin-block-start
      6. scroll-margin-bottom
      7. scroll-margin-inline
      8. scroll-margin-inline-end
      9. scroll-margin-inline-start
      10. scroll-margin-left
      11. scroll-margin-right
      12. scroll-margin-top
      13. scroll-padding
      14. scroll-padding-block
      15. scroll-padding-block-end
      16. scroll-padding-block-start
      17. scroll-padding-bottom
      18. scroll-padding-inline
      19. scroll-padding-inline-end
      20. scroll-padding-inline-start
      21. scroll-padding-left
      22. scroll-padding-right
      23. scroll-padding-top
      24. scroll-snap-align
      25. scroll-snap-stop
      26. scroll-snap-type
      27. scroll-timeline Experimental
      28. scroll-timeline-axis Experimental
      29. scroll-timeline-name Experimental
    100. scrollbar-*
      1. scrollbar-color
      2. scrollbar-gutter
      3. scrollbar-width
    101. shape-*
      1. shape-image-threshold
      2. shape-margin
      3. shape-outside
      4. shape-rendering
    102. stop-color
    103. stop-opacity
    104. stroke-*
      1. stroke
      2. stroke-dasharray
      3. stroke-dashoffset
      4. stroke-linecap
      5. stroke-linejoin
      6. stroke-miterlimit
      7. stroke-opacity
      8. stroke-width
    105. tab-size
    106. table-layout
    107. text-*
      1. text-align
      2. text-align-last
      3. text-anchor
      4. text-combine-upright
      5. text-decoration
      6. text-decoration-color
      7. text-decoration-line
      8. text-decoration-skip Experimental
      9. text-decoration-skip-ink
      10. text-decoration-style
      11. text-decoration-thickness
      12. text-emphasis
      13. text-emphasis-color
      14. text-emphasis-position
      15. text-emphasis-style
      16. text-indent
      17. text-justify
      18. text-orientation
      19. text-overflow
      20. text-rendering
      21. text-shadow
      22. text-size-adjust Experimental
      23. text-spacing-trim Experimental
      24. text-transform
      25. text-underline-offset
      26. text-underline-position
      27. text-wrap
      28. text-wrap-mode
      29. text-wrap-style
    108. timeline-scope Experimental
    109. top
    110. touch-action
    111. transform-*
      1. transform
      2. transform-box
      3. transform-origin
      4. transform-style
    112. transition-*
      1. transition
      2. transition-behavior
      3. transition-delay
      4. transition-duration
      5. transition-property
      6. transition-timing-function
    113. translate
    114. unicode-bidi
    115. user-modify 비표준 지원이 중단되었습니다
    116. user-select
    117. vector-effect
    118. vertical-align
    119. view-*
      1. view-timeline Experimental
      2. view-timeline-axis Experimental
      3. view-timeline-inset Experimental
      4. view-timeline-name Experimental
      5. view-transition-name
    120. visibility
    121. white-space
    122. white-space-collapse
    123. widows
    124. width
    125. will-change
    126. word-break
    127. word-spacing
    128. writing-mode
    129. x
    130. y
    131. z-index
    132. zoom
  11. Selectors
    1. 특성 선택자
    2. 클래스 선택자
    3. ID 선택자
    4. & nesting selector
    5. 유형 선택자
    6. 전체 선택자
  12. Combinators
    1. 자식 결합자
    2. Column combinator Experimental
    3. 자손 결합자
    4. Namespace separator
    5. 인접 형제 결합자
    6. 선택자 목록
    7. 일반 형제 결합자
  13. Pseudo-classes
    1. :-moz-broken 비표준 지원이 중단되었습니다
    2. :-moz-drag-over 비표준
    3. :-moz-first-node Experimental 비표준
    4. :-moz-handler-blocked 비표준
    5. :-moz-handler-crashed 비표준
    6. :-moz-handler-disabled 비표준
    7. :-moz-last-node Experimental 비표준
    8. :-moz-loading 비표준
    9. :-moz-locale-dir(ltr) 비표준
    10. :-moz-locale-dir(rtl) 비표준
    11. :-moz-only-whitespace 비표준
    12. :-moz-submit-invalid 비표준
    13. :-moz-suppressed 비표준
    14. :-moz-user-disabled 비표준
    15. :-moz-window-inactive 비표준
    16. :active
    17. :any-link
    18. :autofill
    19. :blank Experimental
    20. :buffering
    21. :checked
    22. :current
    23. :default
    24. :defined
    25. :dir()
    26. :disabled
    27. :empty
    28. :enabled
    29. :first
    30. :first-child
    31. :first-of-type
    32. :focus
    33. :focus-visible
    34. :focus-within
    35. :fullscreen
    36. :future
    37. :has()
    38. :host
    39. :host-context()
    40. :host()
    41. :hover
    42. :in-range
    43. :indeterminate
    44. :invalid
    45. :is()
    46. :lang()
    47. :last-child
    48. :last-of-type
    49. :left
    50. :link
    51. :local-link
    52. :modal
    53. :muted
    54. :not()
    55. :nth-child
    56. :nth-last-child()
    57. :nth-last-of-type()
    58. :nth-of-type()
    59. :only-child
    60. :only-of-type
    61. :optional
    62. :out-of-range
    63. :past
    64. :paused
    65. :picture-in-picture
    66. :placeholder-shown
    67. :playing
    68. :popover-open
    69. :read-only
    70. :read-write
    71. :required
    72. :right
    73. :root
    74. :scope
    75. :seeking
    76. :stalled
    77. :state()
    78. :target
    79. :target-within Experimental
    80. :user-invalid
    81. :user-valid
    82. :valid
    83. :visited
    84. :volume-locked
    85. :where()
  14. Pseudo-elements
    1. ::-moz-color-swatch 비표준
    2. ::-moz-focus-inner Experimental 비표준
    3. ::-moz-list-bullet Experimental 비표준
    4. ::-moz-list-number Experimental 비표준
    5. ::-moz-meter-bar 비표준
    6. ::-moz-progress-bar Experimental 비표준
    7. ::-moz-range-progress 비표준
    8. ::-moz-range-thumb 비표준
    9. ::-moz-range-track 비표준
    10. ::-webkit-inner-spin-button 비표준
    11. ::-webkit-meter-bar 비표준 지원이 중단되었습니다
    12. ::-webkit-meter-even-less-good-value 비표준
    13. ::-webkit-meter-inner-element 비표준
    14. ::-webkit-meter-optimum-value 비표준
    15. ::-webkit-meter-suboptimum-value 비표준
    16. ::-webkit-progress-bar 비표준
    17. ::-webkit-progress-inner-element 비표준
    18. ::-webkit-progress-value 비표준
    19. ::-webkit-scrollbar 비표준
    20. ::-webkit-search-cancel-button 비표준
    21. ::-webkit-search-results-button 비표준
    22. ::-webkit-slider-runnable-track Experimental
    23. ::-webkit-slider-thumb Experimental
    24. ::after (:after)
    25. ::backdrop
    26. ::before
    27. ::cue
    28. ::file-selector-button
    29. ::first-letter
    30. ::first-line
    31. ::grammar-error
    32. ::highlight()
    33. ::marker
    34. ::part()
    35. ::placeholder
    36. ::selection
    37. ::slotted()
    38. ::spelling-error
    39. ::target-text
    40. ::view-transition
    41. ::view-transition-group
    42. ::view-transition-image-pair
    43. ::view-transition-new
    44. ::view-transition-old
  15. At-rules
    1. @charset
    2. @color-profile
    3. @container
    4. @counter-style
    5. @document 비표준 지원이 중단되었습니다
    6. @font-face
    7. @font-feature-values
    8. @font-palette-values
    9. @import
    10. @keyframes
    11. @layer
    12. @media
    13. @namespace
    14. @page
    15. @position-try Experimental
    16. @property
    17. @scope
    18. @starting-style
    19. @supports
    20. @view-transition Experimental
  16. Functions
    1. -moz-image-rect 비표준 지원이 중단되었습니다
    2. abs()
    3. acos()
    4. anchor-size() Experimental
    5. anchor() Experimental
    6. asin()
    7. atan()
    8. atan2()
    9. attr()
    10. blur()
    11. brightness()
    12. calc()
    13. circle()
    14. clamp()
    15. color-contrast() Experimental
    16. color-mix()
    17. color()
    18. conic-gradient()
    19. contrast()
    20. cos()
    21. counter()
    22. counters()
    23. cross-fade()
    24. device-cmyk()
    25. drop-shadow()
    26. element() Experimental
    27. ellipse()
    28. env()
    29. exp()
    30. fit-content()
    31. grayscale()
    32. hsl()
    33. hue-rotate()
    34. hwb()
    35. hypot()
    36. image-set()
    37. image()
    38. inset()
    39. invert()
    40. lab()
    41. layer()
    42. lch()
    43. light-dark()
    44. linear-gradient()
    45. log()
    46. matrix()
    47. matrix3d()
    48. max()
    49. min()
    50. minmax()
    51. mod()
    52. oklab()
    53. oklch()
    54. opacity()
    55. paint()
    56. palette-mix() Experimental
    57. path()
    58. perspective()
    59. polygon()
    60. pow()
    61. radial-gradient()
    62. ray()
    63. rect()
    64. rem()
    65. repeat()
    66. repeating-conic-gradient()
    67. repeating-linear-gradient()
    68. repeating-radial-gradient()
    69. rgb()
    70. rotate()
    71. rotate3d()
    72. rotateX()
    73. rotateY()
    74. rotateZ()
    75. round()
    76. saturate()
    77. scale()
    78. scale3d()
    79. scaleX()
    80. scaleY()
    81. scaleZ()
    82. scroll() Experimental
    83. sepia()
    84. shape() Experimental
    85. sign()
    86. sin()
    87. skew()
    88. skewX()
    89. skewY()
    90. sqrt()
    91. symbols()
    92. tan()
    93. translate()
    94. translate3d()
    95. translateX()
    96. translateY()
    97. translateZ()
    98. url()
    99. var()
    100. view() Experimental
    101. xywh()
  17. Types
    1. <absolute-size>
    2. <alpha-value>
    3. <angle>
    4. <angle-percentage>
    5. <basic-shape>
    6. <blend-mode>
    7. <box-edge>
    8. <calc-keyword>
    9. <calc-sum>
    10. <color-interpolation-method>
    11. <color>
    12. <custom-ident>
    13. <dashed-ident>
    14. <dimension>
    15. <display-box>
    16. <display-inside>
    17. <display-internal>
    18. <display-legacy>
    19. <display-listitem>
    20. <display-outside>
    21. <easing-function>
    22. <filter-function>
    23. <flex>
    24. <frequency>
    25. <frequency-percentage>
    26. <generic-family>
    27. <gradient>
    28. <hex-color>
    29. <hue>
    30. <hue-interpolation-method>
    31. <ident>
    32. <image>
    33. <integer>
    34. <length>
    35. <length-percentage>
    36. <line-style>
    37. <named-color>
    38. <number>
    39. <overflow>
    40. <percentage>
    41. <position-area> Experimental
    42. <position>
    43. <ratio>
    44. <relative-size>
    45. <resolution>
    46. <shape> 지원이 중단되었습니다
    47. <string>
    48. <system-color>
    49. <time>
    50. <time-percentage>
    51. <transform-function>
    52. <url>
  18. 안내서
  19. 애니메이션
    1. CSS 애니메이션 사용하기
  20. 배경과 보더
    1. 한 번에 여러 배경 사용하기
    2. 배경 이미지 크기 조정하기
  21. 박스 정렬
    1. 블록 레이아웃 박스 정렬하기
    2. 플렉스박스 박스 정렬하기
    3. 그리드 레이아웃의 박스 정렬
    4. 다단 레이아웃 박스 정렬하기
  22. 박스 모델
    1. CSS 기본 박스 모델 입문
    2. 여백 상쇄 정복
  23. Colors
    1. Applying color to HTML elements
    2. Color values
    3. Using relative colors
    4. Using color wisely
    5. Accessibility: Understanding colors and luminance
    6. Accessibility: Color contrast
  24. 열
    1. 다단 레이아웃의 기본 개념
    2. 다단 레이아웃 꾸미기
    3. Spanning 과 balancing
    4. 다단 레이아웃에서 overflow 처리하기
    5. 다단 레이아웃에서 컨텐츠 나누기
  25. CSS에서 규칙 정의하기
    1. 기능 쿼리 사용하기
  26. Containment
    1. Using CSS containment
    2. CSS container queries
    3. Using container size and style queries
  27. CSSOM view
    1. 좌표 시스템
  28. 플렉스박스
    1. 플렉스박스의 기본 개념
    2. 다른 레이아웃과 비교해보기
    3. 항목 정렬하기
    4. 항목 순서 정하기
    5. 항목 비율 설정하기
    6. 항목 wrapping 정복하기
    7. 플렉스박스 적용 사례
  29. 플로 레이아웃
    1. 일반 대열 속 블록 및 인라인 레이아웃
    2. 대열과 탈대열
    3. 서식 상황 입문서
    4. 플로 레이아웃과 쓰기 모드
    5. 플로 레이아웃과 overflow
  30. 글꼴
    1. 오픈타입 글꼴 기능 안내서
    2. 다양한 글꼴 안내서
  31. 그리드
    1. 그리드 레이아웃 기본 개념
    2. 그리드 레이아웃과 다른 레이아웃과의 관계성
    3. 라인을 이용한 그리드 배치
    4. 그리드 템플릿 영역
    5. 이름으로 레이아웃 정하기
    6. 그리드 레이아웃의 자동 배치
    7. 그리드 레이아웃의 박스 정렬
    8. 그리드, logical 값, 쓰기 모드
    9. 그리드 레이아웃과 접근성
    10. 그리드 레이아웃과 꾸준한 발전
    11. 자주 사용되는 레이아웃
    12. 하위 그리드
    13. Masonry 레이아웃
  32. 이미지
    1. CSS 그레이디언트 사용하기
  33. 리스트와 카운터
    1. CSS 카운터 사용하기
    2. 리스트 들여쓰기
  34. Logical 속성
    1. 기본 개념
    2. Floating 과 positioning
    3. 바깥여백(마진), 테두리(보더) 그리고 안쪽여백(패딩)
    4. 크기 조절하기
  35. Math functions
    1. Using CSS math functions
  36. 미디어 쿼리
    1. 미디어 쿼리 사용하기
    2. 접근성을 위한 미디어 쿼리 사용하기
    3. 미디어 쿼리 테스트하기
    4. Printing
  37. Nesting style rules
    1. Using CSS nesting
    2. Nesting at-rules
    3. Nesting and specificity
  38. 위치 잡기
    1. CSS z-index 이해하기
  39. 스크롤 스냅
    1. 스크롤 스냅 기본 개념
  40. 도형
    1. 도형의 기본 개념
    2. CSS 박스 모델로 도형 만들기
    3. 기본 도형들
    4. 이미지로 도형 만들기
  41. 텍스트
    1. 텍스 포장하기 및 나누기
  42. 변형
    1. CSS 변형 사용하기
  43. 트랜지션
    1. CSS 트랜지션 사용하기
  44. 레이아웃 비법서
    1. 미디어 객체
    2. 열
    3. 아이템 중앙 정렬 하기
    4. 바닥글 sticky 설정하기
    5. 네비게이션 나누기
    6. 네비게이션 breadcrumb 설정하기
    7. 뱃지로 리스트 그룹화하기
    8. Pagination
    9. 카드
    10. 그리드 wrapper
  46. 도구
    1. 색상 선택 도구
    2. 박스에 그림자 생성기
    3. 보더 이미지 생성기
    4. Border-radius 생성기

목차

  • 참고서
  • 명세

CSS Namespaces

CSS Namespaces는 CSS에서 XML 네임스페이스를 지정할 수 있는 CSS 모듈입니다.

참고서

@규칙

  • @namespace

명세

Specification
CSS Namespaces Module Level 3
# declaration

Help improve MDN

Learn how to contribute.

This page was last modified on 2023년 6월 3일 by MDN contributors.

View this page on GitHub • Report a problem with this content
MDN logo

Your blueprint for a better internet.

  • MDN on Mastodon
  • MDN on X (formerly Twitter)
  • MDN on GitHub
  • MDN Blog RSS Feed

MDN

  • About
  • Blog
  • Careers
  • Advertise with us

Support

  • Product help
  • Report an issue

Our communities

  • MDN Community
  • MDN Forum
  • MDN Chat

Developers

  • Web Technologies
  • Learn Web Development
  • MDN Plus
  • Hacks Blog
Mozilla logo
  • Website Privacy Notice
  • Cookies
  • Legal
  • Community Participation Guidelines

Visit Mozilla Corporation’s not-for-profit parent, the Mozilla Foundation.
Portions of this content are ©1998–2024 by individual mozilla.org contributors. Content available under a Creative Commons license.