Kod penskalaan berkadar img skrin penyesuaian imej HTML 5 untuk halaman web HTML XNUMX

Oleh kerana Internet mudah alih yang berkembang pesat,Pemasaran WechatPopulariti telefon bimbit telah menjadiHidupalat yang mesti ada.

membina laman webtemplat, adalah disyorkan untuk digunakanWordPressTema penyesuaian untuk:

Apakah maksud penyesuaian imej CSS?

Adaptif imej CSS bermaksud untuk membuat imej dalam halaman web html, melalui kod CSS:

Seterusnya,Chen WeiliangSaya akan berkongsi dengan anda kod penskalaan berkadar CSS img ^_^

Kod penyesuaian tinggi dan lebar imej CSS

Sisipkan imej dalam html:

Jika anda mahu imej menyesuaikan dengan saiz skrin yang kecil dan bukannya tetap pada lebar dan ketinggian.

Anda boleh menambah kod berikut pada fail style.css tema WordPress anda ▼

/*图片自适应宽度和高度*/ 
img { max-width: 100%; height: auto; width: auto\9; width: auto; }

kenyataan di sinimax-widthperaturan lebar maksimum

• untuk memastikan bahawa semua imej dipaparkan pada maksimum 100% (iaitu ia hanya boleh dipaparkan sebesar imej mereka sendiri).
• Pada ketika ini, jika elemen yang mengandungi imej (contohnya, badan atau div yang mengandungi imej) adalah lebih kecil daripada lebar sedia ada imej, imej akan diskalakan untuk mengisi ruang maksimum yang tersedia.

width:auto;bermaksud lebar automatik

\9 Ia adalah satu cara menulis hack css.

• Dengan cara ini, "\9" ditambahkan pada kod css biasa, hanya pelayar IE boleh mengenalinya, pelayar lain akan mengabaikan kenyataan ini.
• Ini akan mencapai pembezaan penyemak imbas, membolehkan tujuan penyemak imbas yang serasi.

Mengapa tidak menggunakan lebar: 100%?

Untuk mencapai penskalaan automatik imej, anda juga boleh menggunakan sifat lebar yang lebih biasa digunakan, mis.width：100％.

Walau bagaimanapun, peraturan ini tidak terpakai di sini.

• Kerana peraturan ini akan menjadikannya kelihatan selebar bekasnya.
• Dalam kes di mana bekas jauh lebih lebar daripada imej, imej akan diregangkan tanpa perlu.

注意 事项

Apakah pemilih CSS? Apakah perbezaan antara kelas dan id?Tutorial berikut bercakap tentang ▼

Apakah perbezaan antara kelas pemilih CSS dan id? id dan penggunaan kelas dalam HTML

Apakah perbezaan antara kelas pemilih CSS dan id? Penggunaan id dan kelas dalam HTML Chen Weiliang sedang melaksanakan SEO dan mengoptimumkan tema WordPress tapak web.Walaupun saya telah mempelajari beberapa pengetahuan asas HTML dan CSS sebelum ini, tetapi saya sudah lama tidak mengendalikannya, terutamanya bahagian CSS...

Bagaimanakah tapak web mudah alih memainkan video MP4 yang disesuaikan dengan halaman?Sila klik pautan di bawah ▼

Bagaimanakah MP5 halaman web H4 menyesuaikan diri dengan halaman? Tapak web mudah alih memainkan kod html video

Pemasaran video ialah bahagian penting dalam pemasaran dalam talian: ramai pengamal promosi dalam talian sering menggunakan video digabungkan dengan "pemasaran virus" untuk mendorong trafik.Jika pemasaran WeChat digabungkan dengan pemasaran video, ia boleh meningkatkan lagi kadar penukaran copywriting media baharu dan e-dagang sosial.Saya mempunyai ramai kawan...