수직 정렬을 사용하여 입력 요소와 img 요소를 정렬하는 방법

이번에는 vertical-align을 사용하여 입력 요소와 img 요소를 정렬하는 방법을 보여 드리겠습니다. 수직 정렬을 사용하여 입력 요소와 img 요소를 정렬할 때의 주의 사항은 다음과 같습니다. 실제 사례를 살펴보겠습니다.

우리는 입력과 img가 같은 줄에 배치되면 img 태그가 항상 입력보다 머리 위가 된다는 것을 알고 있습니다. 이는 매우 보기 흉합니다. 이전에 여러 가지 방법을 시도했지만 그 중 아무 것도 작동하지 않았습니다. 나중에 웹사이트에서 가장 많이 검색된 것은 img에 align="absmiddle"attribute를 추가하는 것이었습니다. 이 방법은 가능할 것 같지만 HTML 표준을 준수하지 않습니다. 나중에 우연히 input과 img에 Vertical-align:middle을 추가하는 것을 발견했습니다.

코드는 다음과 같습니다.

input,img{vertical-align:middle;}

이런 방식으로 코드는 가로로 정렬됩니다.

이 사례를 읽으신 후 방법을 마스터하셨다고 생각합니다. 더 흥미로운 정보를 보려면 PHP 중국어 웹사이트Other 관련 기사를 주목하세요!

관련 읽기:

type="file"의 입력 상자 스타일을 작동하는 방법

HTML에서 헤더 구조를 사용하는 방법

iframe을 사용하여 웹페이지에 날씨를 표시하는 방법

위 내용은 수직 정렬을 사용하여 입력 요소와 img 요소를 정렬하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!