วิธีการของ IMG Label Display Center ใน HTML กำลังรู้จักสามประเภทที่นี่
ครั้งแรก: ใช้คลิปของ CSS: อัตรา (ล่างขวาบน);<img src = http://img2.utuku.china.com/640x0/news/20170210/77B8B5CA-11D3-4307-9A93-C12DF5EB1A35.JPG สไตล์ ); ........ 300px;
ตั้งค่ารูปภาพของความกว้างและความสูงของภาพเทียบเท่ากับสัดส่วนของความกว้างที่แท้จริงของภาพจากนั้นใช้วิธีการแก้ไขเพื่อตั้งค่าช่วงการตัดของภาพ
-ในวินาที: ใช้แอตทริบิวต์พื้นหลังของ IMG:<style type = text/css> img {background- image: url (http://img2.utuku.china.com/640x0/news/20170210/77B8B5CA-11D3-9A93-C12DF5EBEBEBEBEBEBEBEBEBEBEBEBEBEBEBEBEBEBEBEBEBEBEBEBEBEBEBEBEBEBEBEBEBEBEBEBEBEBEBEBEBEBEBEBEBEBEBEBEBEBEBEBE ภาพพื้นหลังการทำซ้ำ: ไม่มีการทำซ้ำภาพพื้นหลัง // จะแสดงเพียงครั้งเดียว พื้นหลัง-attachment: Scroll; 300px 200px;
ใช้พื้นหลังเพื่อควบคุมตำแหน่งกึ่งกลางของการแสดงภาพ ในเวลานี้เส้นขอบสีเทาจะปรากฏขึ้นในภาพที่แสดงและไม่มีทางที่จะลบออกได้
ประเภทที่สาม: มี IMG ใน DIV โดยใช้การล้นของ Div: Hidden;<div style = ความกว้าง: 100px; ความสูง: 100px; : relacted id = img_id> </div> <script> var img = document.getElementById (img_id); /ความสูงความกว้างของรูปภาพได้รับรูปภาพของ image.src = http://img2.utuku.china.com/640x0/news/20170210/77B8B5CA-11D3-4307-9A93-C12DF5EB1A35.JPG onload = function () {realwidth = image.width; ออฟเซ็ตถ้า (RealWidth> Realhead) {img.width = (100/realhead)*RealWidth; + ((100/realheight)*RealWidth-100)/2 + 'px'; ความกว้าง = 100; *Realheigh-) // 2 + 'px'; ; imgType = 0 & src = http%3a%2fd.hiphotos.baidu.com%2fzhidao%2FWH%253D450%252C600%2FSIG e17.jpg;
ความคิดเห็นข้างต้นมีความชัดเจนอยู่แล้วส่วนใหญ่เป็นเพราะ DIV ควบคุมขนาดและแท็ก IMG ควบคุมขนาดของมันตามขนาดของ DIV การเปลี่ยนแปลงที่แตกต่างกันไปถึงภาพกลางภาพ โดยส่วนตัวแล้วฉันคิดว่าวิธีที่สามดีกว่า
ด้านบนเป็นแท็ก IMG ใน HTML ที่ Xiaobian แนะนำให้คุณแสดงวิธีการของตำแหน่งศูนย์กลางของรูปภาพ (สามวิธี) Xiaobian จะตอบกลับทุกคนในเวลา ขอบคุณมากสำหรับการสนับสนุนเว็บไซต์ Vevb Wulin!