CSS 텍스트와 이미지가 정렬되지 않은 경우 수행할 작업

CSS 텍스트 및 이미지 정렬 문제에 대한 해결 방법: 1. 해당 HTML 파일을 엽니다. 2. 텍스트 및 이미지 태그를 찾습니다. 3. 이미지에 "img {width: 20px;vertical-align: middle"이라는 속성을 추가합니다. ;}"를 사용하여 텍스트와 이미지를 정렬합니다.

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

css 텍스트와 그림이 정렬되지 않으면 어떻게 해야 합니까?

css는 텍스트와 그림이 같은 가로선에 있지 않은 문제를 해결합니다

보통 그림은 기본적으로 위쪽에 정렬되고 텍스트는 기본적으로 아래쪽에 정렬되므로 그림과 텍스트가 깨지는 문제가 자주 발생합니다. 레이아웃 중에는 정렬할 수 없습니다.

해결책은 매우 간단합니다. 이미지에 속성만 추가하면 됩니다

img {
  width         : 20px;
  vertical-align: middle;
}
 
vertical-align: text-top;    //顶部对齐
vertical-align: middle;      //居中对齐
vertical-align: text-bottom; //底部对齐

추천 학습: "css 비디오 튜토리얼"

위 내용은 CSS 텍스트와 이미지가 정렬되지 않은 경우 수행할 작업의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!