방법: 1. div 및 범위로 이미지를 래핑합니다. 2. setAttribute()를 사용하여 "display:table;text-align:center" 및 "display:table-cell;vertical-align:middle;" 스타일을 추가합니다. 그것.
이 튜토리얼의 운영 환경: Windows 7 시스템, JavaScript 버전 1.8.5, Dell G3 컴퓨터.
자바스크립트에서 이미지 중심 정렬 설정 방법:
HTML 프레임워크 구축
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <style> div { width: 500px; height: 200px; border: green solid 1px; } </style> </head> <body> <div id="app"> <span id="img"> <img src="img/1.jpg" style="max-width:90%" / alt="자바스크립트에서 이미지를 가운데로 설정하는 방법" > </span> </div> </body> </html>
setAttribute() 메서드를 사용하여 이미지 중심 스타일 추가
var div=document.getElementById("app"); var img=document.getElementById("img"); div.setAttribute("style","display:table;text-align: center;"); img.setAttribute("style","display:table-cell;vertical-align: middle;");
[관련 권장 사항: javascript 학습 튜토리얼 ]
위 내용은 자바스크립트에서 이미지를 가운데로 설정하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!