HTML 5 slikovni prilagodljivi ekran img kod proporcionalnog skaliranja za web stranicu HTML XNUMX

Zbog procvata mobilnog interneta,Wechat marketingPopularnost mobilnih telefona je postalaŽivotalat koji morate imati.

Izgradite stanicušablon, preporučljivo je koristitiWordPressPrilagodljiva tema za:

Šta znači CSS adaptivna slika?

Samoprilagođavanje CSS slike se odnosi na pravljenje slika na html web stranici, putem CSS koda:

Sljedeći,Chen WeiliangPodijelit ću s vama CSS img proporcionalni kod za skaliranje ^_^

CSS adaptivni kod za visinu i širinu slike

Ubaci sliku u html:

Ako želite da se slika prilagodi maloj veličini ekrana umjesto da ostane fiksna po širini i visini.

Možete dodati sljedeći kod u style.css datoteku vaše WordPress teme ▼

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

izjava ovdemax-widthpravilo maksimalne širine

• kako bi se osiguralo da se sve slike prikazuju na maksimalno 100% (tj. mogu se prikazati samo onoliko koliko su velike njihove slike).
• U ovom trenutku, ako je element koji sadrži sliku (na primjer, tijelo ili div koji sadrži sliku) manji od inherentne širine slike, slika će se skalirati da popuni maksimalni raspoloživi prostor.

width:auto;znači automatska širina

\9 To je način pisanja hack css-a.

• Na ovaj način, "\9" se dodaje normalnom css kodu, samo IE pretraživač ga može prepoznati, drugi pretraživači će ignorisati ovu izjavu.
• Ovo će postići diferencijaciju pretraživača, omogućavajući svrhu kompatibilnih pretraživača.

Zašto ne koristite širinu: 100%?

Da biste postigli automatsko skaliranje slika, možete koristiti i najčešće korištena svojstva širine, npr.width：100％.

Međutim, ovo pravilo ovdje ne vrijedi.

• Zato što će ovo pravilo učiniti da izgleda širok kao njegov kontejner.
• U slučajevima kada je kontejner mnogo širi od slike, slika će se nepotrebno rastegnuti.

Predostrožnosti

Šta su CSS selektori? Koja je razlika između klase i id-a?Sljedeći tutorijali govore o ▼

Koja je razlika između klase CSS selektora i id-a? id i upotreba klase u HTML-u

Koja je razlika između klase CSS selektora i ID-a? Upotreba id-a i klase u HTML-u Chen Weiliang trenutno obavlja SEO i optimizira WordPress temu web stranice.Iako sam ranije naučio osnovna znanja HTML-a i CSS-a, ali nisam koristio neko vrijeme, posebno CSS dio...

Kako mobilna web stranica reproducira MP4 video prilagođen stranici?Molimo kliknite na link ispod ▼

Kako se H5 web stranica MP4 prilagođava stranici? Mobilna web stranica reproducira video html kod

Video marketing je sastavni dio internetskog marketinga: mnogi praktičari online promocije često koriste video u kombinaciji s "virusnim marketingom" za povećanje prometa.Ako se WeChat marketing kombinira s video marketingom, to može dodatno poboljšati stopu konverzije kopirajta novih medija i društvene e-trgovine.Imam mnogo prijatelja...