HTML의 IMG 레이블 디스플레이 이미지 센터의 방법은 현재 세 가지 유형을 알고 있습니다
첫 번째 : CSS의 클립 사용 : 왼쪽 상단 왼쪽 사용; 위치와 협력해야합니다<img src = http://img2.utuku.china.com/640x0/news/20170210/77b8b5ca-11d3-4307-9a93-c12df5eb1a35.jpg 스타일 : 절대 클립 : eart, 50px; ); ........ 300px;
그림의 너비와 높이의 그림은 그림의 실제 너비의 비율에 해당하는 다음, 직장 방법을 사용하여 그림의 절단 범위를 설정하십시오.
-두 번째 : IMG의 배경 속성 사용 : <text/css> img {배경-이미지 : URL (http://img2.utuku.china.com/640x0/news/20170210/77b8b5ca-11d3-9a93-c12df5ebebebebebebe bebebe 1A35. JPG); 그림 배경 반복 : No-Repeat; // 배경 이미지는 한 번만 표시됩니다. 배경 변호사 : SCROLL; -50px 0px; 300px 200px; //// 백그라운드의 크기를 설정합니다.배경을 사용하여 그림 디스플레이의 중앙 위치를 제어하십시오. 그런 다음 그림의 실제 너비 높이 비율에 따라 배경을 설정해야합니다. 현재 회색 테두리가 표시된 그림에 나타납니다. 0PX는 SRC에 기본 및 투명한 그림을 넣는 것이 아닙니다.
세 번째 유형 : DIV의 오버플로를 사용하여 DIV에 IMG를 포함합니다. <div 스타일 = 100px; 오버플로; : relacted id = img_id> < /div> <cript> var img. var image = 0; /그림의 너비는 image.src = http://img2.utuku.china.com/640x0/news/20170210/77b8b5ca-11d3-4307-9a93-c12df5eb1a35.jpg; onload = function () {realwidth = image.width; if (realwidth> realhead) {img.width = (100/realHead)*img의 너비의 너비. + ((100/realHeight)*RealWidth-100)/2 + 'px'; 너비 = 100; // DIV의 높이는 img.head = (100/realWidth)*Zoom의 높이와 동일합니다. *RealHeigh-) // 2 + 'PX'; ; // 그림의 그림은 img img의 실패를로드합니다. gtype = 0 & src = http%3a%2fd.hotos.baidu.com%2fzhidao%2fwh%253d450%252c600%2fsign%3d0c96dc8633c895a62b907fe4235fc6%2f0823dd544e9258dff9f 4 e17.jpg; img.width = 100;위의 의견은 주로 DIV가 크기를 제어하고 IMG 태그는 DIV의 크기에 따라 크기를 조절하기 때문에 이미 매우 명확합니다. 차별화는 그림 중간에 그림에 도달하기 위해 이동합니다. 개인적으로 세 번째 방법이 더 좋다고 생각합니다.
위는 Xiaobian에 의해 소개 된 HTML의 IMG 태그는 그림의 중심 위치를 표시합니다 (세 가지 방법). . VEVB WULIN 웹 사이트를 지원해 주셔서 대단히 감사합니다!