HTML 5 gambar adaptif kode skala proporsional img kanggo kaca web HTML XNUMX

Amarga Internet seluler booming,Wechat marketingPopularitas ponsel wis dadiUripalat sing kudu ana.

mbangun situs webCithakan, kang dianjurake kanggo nggunakakeWordPressTema adaptif kanggo:

Apa tegese adaptif gambar CSS?

Adaptasi diri gambar CSS nuduhake nggawe gambar ing kaca web html, liwat kode CSS:

SabanjureChen WeiliangAku bakal nuduhake sampeyan kode skala proporsional CSS img ^_^

dhuwur gambar CSS lan kode adaptif jembaré

Lebokake gambar ing html:

Yen sampeyan pengin gambar kanggo ngganti ukuran cilik saka layar tinimbang tetep tetep ing jembaré lan dhuwur.

Sampeyan bisa nambah kode ing ngisor iki menyang file style.css tema WordPress sampeyan ▼

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

statement ing kenemax-widthaturan jembaré maksimum

• kanggo mesthekake yen kabeh gambar ditampilake ing maksimum 100% (i.e. padha mung bisa ditampilake minangka gedhe minangka gambar dhewe).
• Ing titik iki, yen unsur ngemot gambar (contone, awak utawa div ngemot gambar) luwih cilik saka jembaré gawan gambar, gambar bakal scaled kanggo ngisi spasi kasedhiya maksimum.

width:auto;tegese jembaré otomatis

\9 Iku cara nulis hack css.

• Kanthi cara iki, "\9" ditambahake menyang kode css normal, mung browser IE sing bisa ngenali, browser liyane bakal nglirwakake statement iki.
• Iki bakal entuk diferensiasi browser, mbisakake tujuan browser sing kompatibel.

Apa ora nggunakake jembaré: 100%?

Kanggo entuk skala gambar kanthi otomatis, sampeyan uga bisa nggunakake sifat jembar sing luwih umum, contone.width：100％.

Nanging, aturan iki ora ditrapake ing kene.

• Amarga aturan iki bakal katon amba minangka wadhah.
• Ing kasus ing ngendi wadhah luwih amba tinimbang gambar, gambar bakal digawe dowo tanpa perlu.

Pancegahan

Apa pamilih CSS? Apa bedane antarane kelas lan id?Tutorial ing ngisor iki ngomong babagan ▼

Apa bedane antarane kelas pamilih CSS lan id? id lan panggunaan kelas ing HTML

Apa bedane antarane kelas pamilih CSS lan id? Panggunaan id lan kelas ing HTML Chen Weiliang lagi nindakake SEO lan ngoptimalake tema WordPress situs web.Senajan aku wis sinau sawetara kawruh dhasar HTML lan CSS sadurunge, nanging aku wis ora operate kanggo sawetara wektu, utamané bagean CSS ...

Kepiye cara ngganti kaca kanggo muter video MP4 ing situs web seluler?Mangga klik link ing ngisor iki ▼

Kepiye carane MP5 kaca web H4 bisa adaptasi karo kaca kasebut? Situs web seluler muter kode html video

Pemasaran video minangka bagean integral saka marketing online: akeh praktisi promosi online asring nggunakake video sing digabungake karo "marketing viral" kanggo ngarahake lalu lintas.Yen marketing WeChat digabungake karo marketing video, bisa nambah tingkat konversi copywriting media anyar lan e-commerce sosial.Aku duwe akeh kanca ...