
CSS: Cascading Style Sheetν μμκ° μ¬λ¬κ°μ§ μμ±κ°μ μμλ°κ² λ κ²½μ°, cascadingμ ν΅ν΄ μ°μ μμκ° κ²°μ λ¨cssκ° μ μΈλ μμΉμ λ°λΌ μ€μλλ₯Ό νλ¨λΈλΌμ°μ μ€νμΌ μνΈ < μ¬μ© μ€νμΌμνΈ < κ°λ°μ μ€νμΌ μνΈκ°λ°μ μ€νμΌ μνΈ

CSSμμ ν¨μ μ¬μ© ν¨μ μ§μ λ κΈ°λ₯μ μννλ μμ calc( ) κ΄νΈ μμ μ¬μΉμ°μ° κ²°κ³Όλ₯Ό μμ±κ°μΌλ‘ μ¬μ©κ°λ₯ λ§μ , λΊμ κΈ°νΈ μ λ€μ λ°λμ 곡백 Position HTML μμκ° λ°°μΉλλ λ°©μμ κ²°μ νλ μμ± positionμ μ λ ₯λ μμ±κ°μ λ°λΌ μμμ μ’

transform λμμ΄ λλ μμμ μ΄λ, νμ , νλ/μΆμ, λΉνκΈ° λ±μ λ³ν ν¨κ³Όλ₯Ό λΆμ¬ transform μ μμ±κ° translate( x, y ) μμμ μ’νλ₯Ό μμ§μΌ μ μλ€. μ’νκ°μ μ λ ₯νλ λΆλΆμλ μμ, μμ λͺ¨λ μ λ ₯ κ°λ₯ μ’νκ°μ νλλ§

Animation μ΄λ? μ°μλλ μ΄λ―Έμ§λ₯Ό μ°κ²°ν΄μ μμ°μ€λ½κ² μμ§μ΄λ κ²μ²λΌ 보μ΄κ² λ§λλ κΈ°λ² CSSλ₯Ό μ΄μ©ν΄μ μ λλ©μ΄μ μ λ§λλ λ°©λ² transition μμ± νμ© νΉμ μ΄λ²€νΈ(hover λ±)λ₯Ό κΈ°μ μΌλ‘ μλ animation μμ±κ³Ό keyframe

CSS λ μ΄μμ μμ€ν μ μμ¬Float β‘οΈ Flex β‘οΈ Grid(νλμλ Flexμ Gridλ₯Ό μν©μ λ°λΌ νΌμ©)flex1μ°¨μμ ꡬ쑰λ₯Ό κ°μ§row / column μ€ νλλ₯Ό ννμ¬ λ°°μΉ λ°©ν₯μ κ²°μ grid2μ°¨μμ ꡬ쑰λ₯Ό κ°μ§row & column λ°©ν₯μ λ°°μΉ λ°©μμ

λ€μν λλ°μ΄μ€μμ μ μνμ λ κΈ°κΈ°μ Viewport κ·κ²©μ λ°μνμ¬ λ μ΄μμμ΄ μλμΌλ‘ λ³κ²½λλ μΉνμ΄μ§(μμ) μμ΄λΉμ€λΉ μΉνμ΄μ§μΉ λΈλΌμ°μ λ₯Ό ν΅ν΄ μΉ νμ΄μ§μ μ μνμ λ, μ£Όμμ°½μ΄λ ν λ±μ μ μΈνκ³ μ€μ μΉ νμ΄μ§μ 컨ν μΈ κ° μ°¨μ§νλ μμκΈ°κΈ°(Device)μ