MENO - Funzione dimensione immagine

Descrizione

Viene utilizzato per esaminare la dimensione dell'immagine dal file. Esamina sia la larghezza che l'altezza dell'immagine.

Esempio

L'esempio seguente mostra l'uso della dimensione dell'immagine nel file LESS:

<!doctype html>
   <head>
      <link rel = "stylesheet" href = "style.css" type = "text/css" />
   </head>

   <body>
     <h2>Welcome to TutorialsPoint</h2>
     <h3>The largest Tutorials Library on the web.</h3>
   </body>
</html>

Quindi, crea il file style.less .

style.less

body {
   background-image:url("startup.jpg");
   image-size:image-size("startup.jpg");
}

È possibile compilare il file style.less in style.css utilizzando il seguente comando:

lessc style.less style.css

Esegui il comando precedente; creerà automaticamente il file style.css con il seguente codice -

style.css

body {
   background-image: url("startup.jpg");
   image-size: 1200px 800px;
}

Produzione

Segui questi passaggi per vedere come funziona il codice sopra:

  • Salva il codice html sopra nel file misc_example.htm file.

  • Apri questo file HTML in un browser, verrà visualizzato il seguente output.