Rumah hujung hadapan web tutorial css Pemusatan menegak dan mendatar imej saiz yang tidak diketahui dalam bekas yang diketahui_CSS/HTML

Pemusatan menegak dan mendatar imej saiz yang tidak diketahui dalam bekas yang diketahui_CSS/HTML

May 16, 2016 pm 12:10 PM

Melainkan dinyatakan sebaliknya, kandungan di tapak ini dibuat dengan kebenaran perkongsian dan adalah untuk kegunaan bukan komersial Sila hormati hasil kerja anda.

Dalam reka letak CSS, pemusatan menegak bagi imej yang tidak diketahui saiznya selalu menyusahkan penyemak imbas Standard hanya perlu menetapkan ketinggian garisan bekas dan penjajaran menegak: tengah imej, tetapi ia tidak berguna untuk IE, saya melihat penyelesaian kepada IE di laman web asing beberapa bulan yang lalu. Baru-baru ini, saya sering melihat rakan bertanya soalan yang sama, dan saya mencungkil kod tersebut dan mengubah suainya untuk IE.

CSS

.box{
tinggi:140px;
lebar:200px;
sempadan: padu 1px #666;
text-align:center;/*Pemusatan mendatar */
line-height:140px;
font-size:126px;/*IE dipusatkan secara menegak di sini*/
}
.box[class]{
font-size:12px ;/*Pelayar standard memerlukan nilai ini*/
}
img{
vertical-align:middle;/*Imej penyemak imbas standard berpusat secara menegak*/
}

Asal saiz fon kod asing adalah sama dengan ketinggian Selepas mencubanya, ketinggian bekas adalah lebih tinggi sedikit daripada pelayar standard saya mencuba beberapa kali untuk menolak 10% daripada ketinggian bekas saiz fon dengan cara ini, ia kelihatan hampir sama. Sebabnya masih tidak jelas.

Ujian telah berjaya di bawah IE5.5, IE6.0, FF1.5, Opera9.0, tetapi tidak sah untuk IE5.0 dan IE7.0.

Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn

Tag artikel panas

Notepad++7.3.1

Notepad++7.3.1

Editor kod yang mudah digunakan dan percuma

SublimeText3 versi Cina

SublimeText3 versi Cina

Versi Cina, sangat mudah digunakan

Hantar Studio 13.0.1

Hantar Studio 13.0.1

Persekitaran pembangunan bersepadu PHP yang berkuasa

Dreamweaver CS6

Dreamweaver CS6

Alat pembangunan web visual

SublimeText3 versi Mac

SublimeText3 versi Mac

Perisian penyuntingan kod peringkat Tuhan (SublimeText3)

Menambah bayang -bayang kotak ke blok dan elemen WordPress Menambah bayang -bayang kotak ke blok dan elemen WordPress Mar 09, 2025 pm 12:53 PM

Menambah bayang -bayang kotak ke blok dan elemen WordPress

Buat borang hubungan JavaScript dengan rangka kerja pintar Buat borang hubungan JavaScript dengan rangka kerja pintar Mar 07, 2025 am 11:33 AM

Buat borang hubungan JavaScript dengan rangka kerja pintar

Buat editor teks sebaris dengan atribut yang boleh dipertikaikan Buat editor teks sebaris dengan atribut yang boleh dipertikaikan Mar 02, 2025 am 09:03 AM

Buat editor teks sebaris dengan atribut yang boleh dipertikaikan

Bekerja dengan Caching Graphql Bekerja dengan Caching Graphql Mar 19, 2025 am 09:36 AM

Bekerja dengan Caching Graphql

Menjadikan Peralihan Svelte Khas pertama anda Menjadikan Peralihan Svelte Khas pertama anda Mar 15, 2025 am 11:08 AM

Menjadikan Peralihan Svelte Khas pertama anda

Membandingkan 5 Pembina Borang PHP Terbaik (dan 3 skrip percuma) Membandingkan 5 Pembina Borang PHP Terbaik (dan 3 skrip percuma) Mar 04, 2025 am 10:22 AM

Membandingkan 5 Pembina Borang PHP Terbaik (dan 3 skrip percuma)

Muat naik fail dengan multer di node.js dan ekspres Muat naik fail dengan multer di node.js dan ekspres Mar 02, 2025 am 09:15 AM

Muat naik fail dengan multer di node.js dan ekspres

Pembaca Skrin Demystifying: Borang & Amalan Terbaik Diakses Pembaca Skrin Demystifying: Borang & Amalan Terbaik Diakses Mar 08, 2025 am 09:45 AM

Pembaca Skrin Demystifying: Borang & Amalan Terbaik Diakses

See all articles