HTML에서는 스타일 및 "overflow-x" 속성을 사용하여 스크롤 막대를 가로로 이동하고 표시하지 않도록 div를 설정할 수 있습니다. 속성 값이 "hidden"으로 설정되면 가로 스크롤 메커니즘이 작동합니다. 구문은 "
"입니다.
이 튜토리얼의 운영 환경: Windows 10 시스템, HTML5 버전, Dell G3 컴퓨터.
html div 가로 스크롤 막대가 표시되지 않도록 설정하는 방법
overflow-x 속성은 요소의 콘텐츠 영역을 초과하는 경우 왼쪽/오른쪽 가장자리 콘텐츠를 자를지 여부를 지정합니다.
구문은
overflow-x: visible|hidden|scroll|auto|no-display|no-content;
매개변수는 다음과 같이 표현됩니다.
예제는 다음과 같습니다.
<html>
<head>
<meta charset="utf-8">
<title>123</title>
<style>
div
{
width:110px;
height:110px;
border:thin solid black;
overflow-y:hidden;
}
</style>
</head>
<body>
<div style="overflow-x:hidden;"><p style="width:140px">
In my younger and more vulnerable years my father gave me some advice that I've been turning over in my mind ever since.
'Whenever you feel like criticizing anyone,' he told me, 'just remember that all the people in this world haven't had the advantages that you've had.'
</p></div>
<p>Overflow-x指定是否要剪辑的左/右边缘的内容.</p>
<p>Overflow-y指定是否要剪辑的顶部/底部边缘的内容</p>
</body>
</html>style="overflow-x:hidden;" 스타일이 div에 추가되지 않은 경우 요소의 경우 출력 결과는 다음과 같습니다.
위 예제에서 이 스타일을 추가하면 출력 결과는 다음과 같습니다.
추천 튜토리얼: "html 비디오 튜토리얼"
