[SIST] Web_CSS_days03_CSS overflow 속성

2022. 5. 23. 21:44·TIL/Web(HTML, CSS, JS, jQuery)
728x90
반응형

1. 영역보다 콘텐츠가 너무 커서 맞지 않는 경우 제어하는 속성

 

2. 속성 값들

  > visible(기본값) : 영역 외부에 넘치는 콘텐츠가 출력(랜더링) 되어진다.

  > hidden : 잘라버린다(보이지않는다.)

  > scroll : 스크롤바가 생겨서 안보이는 부분은 움직여서 보일 수 있도록 한다.

  > auto : 스크롤바가 생긴다.

 

3. scroll과 auto의 차이점?

  > scroll은 넘치지 않아도 스크롤바가 생기고 auto는 넘치면 스크롤바가 생기고 안넘치는 생기지 않는다.


[코드 예시]

 

[visible 결과]

 

[hidden 결과]

 

[scroll 결과]

 

[auto 결과]

 

[overflow-x, overflow-y 결과]

728x90
반응형

'TIL > Web(HTML, CSS, JS, jQuery)' 카테고리의 다른 글

[SIST] Web_CSS_days04_CSS 4가지 결합자  (0) 2022.05.24
[SIST] Web_CSS_days04_CSS float 속성과 clear 속성  (0) 2022.05.24
[SIST] Web_CSS_days03_CSS의 z-index 속성  (0) 2022.05.23
[SIST] Web_CSS_days03_CSS의 position(위치) 속성과 sticky 속성값을 javascript로 구현하기  (0) 2022.05.23
[SIST] Web_CSS_days03_CSS 목록 태그 속성  (0) 2022.05.23
'TIL/Web(HTML, CSS, JS, jQuery)' 카테고리의 다른 글
  • [SIST] Web_CSS_days04_CSS 4가지 결합자
  • [SIST] Web_CSS_days04_CSS float 속성과 clear 속성
  • [SIST] Web_CSS_days03_CSS의 z-index 속성
  • [SIST] Web_CSS_days03_CSS의 position(위치) 속성과 sticky 속성값을 javascript로 구현하기
야리니
야리니
오늘보다 내일 더 성장하는 개발자가 되기 위한 야리니 블로그입니다 :)
    반응형
    250x250
  • 야리니
    야리니의 step by step
    야리니
  • 링크

    • GitHub
    • Linkedin
  • 전체
    오늘
    어제
    • 분류 전체보기 (478) N
      • TIL (379)
        • Java (97)
        • Kotlin (28)
        • JPA (16)
        • Spring (37)
        • Oracle (22)
        • JDBC (7)
        • Web(HTML, CSS, JS, jQuery) (90)
        • View Template (31)
        • AWS (7)
        • HTTP (7)
        • CS (5)
        • Linux, Unix (2)
        • Python (20)
      • Trouble Shooting(Error) (37)
      • Algorithm (15)
      • Git,GitHub (8)
      • Diary (24) N
      • 독서 (9)
      • Etc (6)
        • Mac (1)
        • 학원준비과정 (2)
  • 블로그 메뉴

    • 방명록
    • 태그
  • 공지사항

    • 안녕하세요 :)
  • 인기 글

  • 태그

    국비지원학원
    oracle
    HTML
    백엔드 개발자
    CSS
    java
    java기초
    쌍용교육센터
    Kotlin
    코틀린
  • 최근 댓글

  • 최근 글

  • hELLO· Designed By정상우.v4.10.2
야리니
[SIST] Web_CSS_days03_CSS overflow 속성
상단으로

티스토리툴바