CSS img max-width: 100%

Question 1

Dacă vom specifica max-width: 100% pentru un element de imagine (de exemplu o imagine de 250px * 500px) și ne-am pus această imagine în interiorul unui element părinte de lățime 1000px, apoi, dacă părintele este scăzut <= 500px, imaginea va fi micșorat în mod corespunzător pentru a ocupa întreaga lungime a părintelui. Cu toate acestea, în cazul în care părintele este lățimea este de la > 500px, imaginea nu va fi majorat, dar la cele originale 500px.

Ceea ce mă nedumerește este sensul 100% aici. Din înțelegerea mea, procentul este întotdeauna cu privire la părintele său. Deci nu înseamnă că lățimea maximă este întotdeauna lățimea curentă a societății sale mamă? Deci imaginea va fi întotdeauna scăzut/scalate pentru a se potrivi părinții săi pentru că lățimea maximă este de 100%? Ce sunt eu neînțelegere aici? cum să înțeleagă procent relativ utilizate în max-lățime în acest caz? Ce este relativă a? Multumesc!!!

Question 2

Da, există o diferență între width și max-width.

Această definiție de w3school va face mai ușor pentru tine să înțeleagă.

https://www.w3schools.com/cssref/pr_dim_max-width.asp

La max-width proprietate definește lățimea maximă a unui element.

În cazul în care conținutul este mai mare decât lățimea maximă, acesta va automat modificați înălțimea elementului.

În cazul în care conținutul este mai mică decât lățimea maximă, max-lățime proprietatea are nici un efect.

Notă: Acest lucru previne valoarea width proprietatea de a deveni mai mare decât max-width. Valoarea max-width proprietatea suprascrie la width proprietate.

Vine la intrebarea ta acum, dacă înlocuiți max-width cu width și a verifica pentru lățimea imaginii pentru punct de spargere >=500px sau <500px, se va de-curs de ia părinți latime.

Dar, așa cum este menționat din definiția de mai sus, max-width face-vă că lățimea elementului nu merge mai sus de o anumită lățime (indiferent de ceea ce este părinte lățime) și de aceea această proprietate a fost adus în.

Imran Rafiq Rather · Answer 1 · 2021-11-24T03:21:07

Da, există o diferență între width și max-width.

Această definiție de w3school va face mai ușor pentru tine să înțeleagă.

https://www.w3schools.com/cssref/pr_dim_max-width.asp

La max-width proprietate definește lățimea maximă a unui element.

În cazul în care conținutul este mai mare decât lățimea maximă, acesta va automat modificați înălțimea elementului.

În cazul în care conținutul este mai mică decât lățimea maximă, max-lățime proprietatea are nici un efect.

Notă: Acest lucru previne valoarea width proprietatea de a deveni mai mare decât max-width. Valoarea max-width proprietatea suprascrie la width proprietate.

Vine la intrebarea ta acum, dacă înlocuiți max-width cu width și a verifica pentru lățimea imaginii pentru punct de spargere >=500px sau <500px, se va de-curs de ia părinți latime.

Dar, așa cum este menționat din definiția de mai sus, max-width face-vă că lățimea elementului nu merge mai sus de o anumită lățime (indiferent de ceea ce este părinte lățime) și de aceea această proprietate a fost adus în.

tu ar trebui să utilizați surse oficiale, în schimb, cum ar fi W3C sau MDN. w3schools este inexactă.
@Raptor: eu admir recomanda, eu prefer surse oficiale. Cu toate acestea MDN sau W3C este încă nu așa de rău pentru incepatori. Am început totul de la aceste site-uri și, cu timpul, deși am observat w3c are câteva probleme, în unele cazuri, dar pentru un incepator pentru a înțelege un punct, eu nu simt că este rău pentru share :) Oricum, Multumesc

CSS img max-width: 100%

Problema

Cel mai bun răspuns

În alte limbi

Această pagină este în alte limbi

Popular în această categorie

Întrebări frecvente în această categorie