Front-End/CSS

CSS 요소의 크기 지정

코드깎는머슴 2024. 2. 22. 10:37
728x90
반응형

aspect-ratio

    - 요소의 크기에 대한 비율 지정
    - 크기와 관련된 속성(width, height)이 지정되어 있지 않거나, 하나만 지정되어 있을 때 사용
    - 값
        w/h     : 가로와 세로 비율을 각 자연수인 w와 h로 한다

height

    - 요소의 세로 크기 지정
    - 값
        auto
        [크기 리터럴] : 값의 단위가 비율(%)일 때 기준은 속성이 부여되는 요소의 부모 요소의 세로 크기이다.

max-height

    - 요소가 가질 수 있는 최대 세로 크기를 지정
    - 값
        auto
        [크기 리터럴] : 값의 단위가 비율(%)일 때 기준은 속성이 부여되는 요소의 부모 요소의 세로 크기이다.

min-height

    - 요소가 가질 수 있는 최소 세로 크기를 지정
    - 값
        auto
        [크기 리터럴] : 값의 단위가 비율(%)일 때 기준은 속성이 부여되는 요소의 부모 요소의 세로 크기이다.


width

    - 요소의 가로 크기 지정
    - 값
        auto
        [크기 리터럴] : 값의 단위가 비율(%)일 때 기준은 속성이 부여되는 요소의 부모 요소의 가로 크기이다.

max-width

    - 요소가 가질 수 있는 최대 가로 크기 지정
    - 요소가 가지는 내용이 max-height값을 초과하는 경우 오버플로우(overflow) 발생
    - 값
        auto
        [크기 리터럴] : 값의 단위가 비율(%)일 때 기준은 속성이 부여되는 요소의 부모 요소의 가로 크기이다.

min-width

    - 요소가 가질 수 있는 최소 가로 크기 지정
    - 값
        auto
        [크기 리터럴] : 값의 단위가 비율(%)일 때 기준은 속성이 부여되는 요소의 부모 요소의 가로 크기이다.

728x90
반응형