CSS로 3개의 div를 나란히 만드는 방법

3개의 div를 나란히 만드는 Css 방법: 1. "display:inline;" 또는 "display:inline-block;" 스타일을 3개의 div 요소에 설정합니다. 2. float 속성을 사용하여 세 개의 div 요소를 부동화합니다. . 구문 "부동:왼쪽;".

이 튜토리얼의 운영 환경: Windows7 시스템, CSS3&&HTML5 버전, Dell G3 컴퓨터.

div는 블록 요소이며 기본적으로 자체 줄에 표시됩니다.

<div></div>
<div></div>
<div></div>

그렇다면 이 세 개의 div를 나란히 표시하려면 어떻게 해야 할까요? 두 가지 방법이 있는데 아래에서 소개하겠습니다.

1 디스플레이 속성

을 사용하여 세 개의 div를 모두 display:inline; 또는 display:inline-으로 설정합니다. 차단; display:inline;或display:inline-block;

div{
	width: 100px;
	height: 20px;
	border: 1px solid red;
	display:inline-block;
}

注：当设置成display:inline;

div{
	width: 100px;
	height: 20px;
	border: 1px solid red;
	float:left;
}

참고: display:inline;으로 설정하면 div에 콘텐츠가 있어야 합니다. 그렇지 않으면 div를 열 수 없습니다.

2. 부동 속성

을 사용하여 세 개의 div를 부동

위 내용은 CSS로 3개의 div를 나란히 만드는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!