HTML을 변경하지 않고 요소를 수평으로 정렬하려면 어떻게 해야 합니까?

HTML 수정 없이 같은 줄에 요소 정렬

CSS 부동 소수점을 사용하여 두 요소를 나란히 정렬하려고 하면 어렵습니다. 요소의 너비가 다를 때 정확한 정렬을 보장합니다. HTML 구조를 수정할 수 없는 경우 요소를 같은 줄에 정렬하는 CSS 기술이 있습니다.

해결책은 display:inline-block 속성을 활용하는 것입니다. 방법은 다음과 같습니다.

#element1 {display:inline-block;margin-right:10px;} 
#element2 {display:inline-block;}

이 CSS는 두 요소가 모두 인라인 블록으로 표시되도록 설정하여 텍스트처럼 나란히 배치되도록 합니다. #element1의 margin-right 속성은 요소 사이에 원하는 간격을 만듭니다.

예를 들어 #element1에 "요소 1 마크업"이 포함되고 #element2에 "요소 2 마크업"이 포함된 경우 위 CSS는 다음과 같은 결과를 낳습니다. 다음은 다음과 같습니다.

<div>

이 기술을 사용하면 폭이 다양하더라도 두 요소가 모두 수평으로 정렬되어 균일한 정렬 환경을 제공할 수 있습니다.

위 내용은 HTML을 변경하지 않고 요소를 수평으로 정렬하려면 어떻게 해야 합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!