CSS 오버플로 속성을 사용하면 div를 수직으로 스크롤 가능하게 만드는 것이 쉽습니다. 에는 다양한 값이 있습니다. 오버플로 속성 . 웹 페이지에 스크롤 막대를 가져오는 데 해당 속성을 사용할 수 있습니다. 아래 예제는 웹페이지에 세로 스크롤바를 설정하는 방법입니다.

예시 1: 이 예에서는 Overflow-x:hidden;을 설정했습니다. 오버플로-y: 자동; 자동으로 가로 스크롤 막대를 숨기고 세로 스크롤 막대만 표시합니다.

HTML

> <> html> >> <> head> >> > <> style> >> > h1 {> > color: Green;> > }> > div.scroll {> > margin: 4px, 4px;> > padding: 4px;> > background-color: green;> > width: 500px;> > height: 110px;> > overflow-x: hidden;> > overflow-y: auto;> > text-align: justify;> > }> > style>머리>

`techcodeview.comh1>`
프로그래밍을 배우기에 좋은 플랫폼입니다. 교육사이트입니다. 무료 온라인 배치 준비 과정을 통해 Microsoft, Amazon, Adobe 등과 같은 제품 기반 기업의 채용 활동을 준비하세요. 이 과정은 인터뷰에서 질문할 수 있는 다양한 MCQ 및 코딩 질문에 중점을 두고 다가오는 배치 시즌을 효율적이고 성공적으로 만듭니다. 또한 모든 괴짜는 techcodeview.com에 기사를 작성하여 다른 괴짜를 도울 수 있으며 기사 게시는 몇 단계를 따르며 리뷰어의 수정/개선이 거의 필요하지 않은 기사가 먼저 게시됩니다. 귀하의 기사를 신속하게 검토하려면 기존 기사, 해당 형식 스타일, 코딩 스타일을 참조하여 해당 기사에 가깝도록 노력하십시오. 초보자인 경우 기사 작성 지침을 참고하세요. div> center> body> html>>

산출:

산출

예 2: 이 예에서는 Overflow-x:hidden 대신 auto를 사용합니다. 그리고 Overflow-y:auto; div를 수직으로 스크롤 가능하게 만듭니다.

HTML

> <> html> >> <> head> >> > <> style> >> > h1 {> > color: Green;> > }> > div.gfg {> > margin: 5px;> > padding: 5px;> > background-color: green;> > width: 500px;> > height: 110px;> > overflow: auto;> > text-align: justify;> > }> > style>머리>