Stile objectFit Proprietà
Esempio
Taglia i lati di un'immagine, preservando le proporzioni e riempi lo spazio:
document.getElementById("myImg").style.objectFit = "cover";
Definizione e utilizzo
La proprietà objectFit viene utilizzata per specificare come ridimensionare un <img> o un <video> per adattarlo al suo contenitore.
Questa proprietà indica al contenuto di riempire il contenitore in vari modi; come "preserva le proporzioni" o "allunga e occupa più spazio possibile"
Supporto browser
I numeri nella tabella specificano la prima versione del browser che supporta completamente la proprietà.
Property | |||||
---|---|---|---|---|---|
objectFit | 31.0 | 16.0 | 36.0 | 7.1 | 19.0 |
Sintassi
Restituisce la proprietà objectFit:
object.style.objectFit
Imposta la proprietà objectFit:
object.style.objectFit = "fill|contain|cover|scale-down|none|initial|inherit"
Valori di proprietà
Value | Description |
---|---|
fill | This is default. The replaced content is sized to fill the element's content box. If necessary, the object will be stretched or squished to fit |
contain | The replaced content is scaled to maintain its aspect ratio while fitting within the element's content box |
cover | The replaced content is sized to maintain its aspect ratio while filling the element's entire content box. The object will be clipped to fit |
none | The replaced content is not resized |
scale-down | The content is sized as if none or contain were specified (would result in a smaller concrete object size) |
initial | Sets this property to its default value. Read about initial |
inherit | Inherits this property from its parent element. Read about inherit |
Dettagli tecnici
Valore di default: | riempire |
---|---|
Valore di ritorno: | Una stringa, che rappresenta l'adattamento all'oggetto di un elemento |
Versione CSS | CSS3 |
Pagine correlate
Tutorial CSS: adattamento agli oggetti CSS
Riferimento CSS: proprietà adatta agli oggetti
❮ Oggetto stile