Come Ridurre L'immagine In Html

Sommario:

Come Ridurre L'immagine In Html
Come Ridurre L'immagine In Html

Video: Come Ridurre L'immagine In Html

Video: Come Ridurre L'immagine In Html
Video: COME INSERIRE E MAPPARE IMMAGINI IN UN SITO WEB - Corso HTML #6 | Vita Da Founder 2024, Aprile
Anonim

Nel linguaggio di marcatura ipertestuale (HTML), viene utilizzato un comando speciale "tag" per visualizzare un'immagine su una pagina. Questo tag è denominato img e contiene un insieme di variabili - "attributi". Con l'aiuto degli attributi, puoi determinare tutti gli aspetti della visualizzazione di un'immagine in una pagina ipertestuale, comprese le sue dimensioni. Tuttavia, questo non è l'unico modo per risolvere il problema: puoi anche ridurre le dimensioni dell'immagine utilizzando i fogli di stile a cascata (CSS).

Come ridurre l'immagine in html
Come ridurre l'immagine in html

Istruzioni

Passo 1

Posiziona gli attributi di altezza e larghezza nel tag responsabile della visualizzazione dell'immagine desiderata. Imposta il primo sulla dimensione verticale dell'immagine e il secondo orizzontalmente. Imposta entrambi i numeri in pixel, ma non è necessario indicare le unità - px - qui. Quando si calcolano i valori necessari per questi attributi, prestare attenzione all'osservanza delle proporzioni della riduzione dell'immagine, altrimenti verrà visualizzata in una forma distorta. Ad esempio, per inserire in una pagina un'immagine dimezzata da un file chiamato SomePic.jpg, le cui dimensioni iniziali sono 500 per 300 pixel, il tag può essere eseguito con il seguente comando:

Passo 2

È possibile impostare la riduzione proporzionale delle dimensioni dell'immagine originale in percentuale. Per fare ciò, utilizzare solo l'attributo altezza senza specificare la larghezza e aggiungere un segno di percentuale dopo aver specificato il numero che definisce la dimensione. Ad esempio, puoi ottenere lo stesso effetto dell'esempio del passaggio precedente con un tag scritto in questa forma:

Passaggio 3

Se vuoi specificare la dimensione dell'immagine usando la descrizione degli stili, usa lo stesso nome del tag - img - e gli attributi - larghezza e altezza. In questo caso, le unità di misura - px, pt o% - devono essere sempre specificate. Per impostare il dimezzamento della dimensione di tutte le immagini della pagina, inserisci la seguente voce nel blocco della descrizione dello stile: img {height: 50%;} Se devi ridurre la dimensione di una sola immagine, aggiungi un attributo id aggiuntivo al suo tag e assegnargli un valore univoco per le immagini di questa pagina, ad esempio PicOne: aggiungi lo stesso valore al record di stile, separandolo con un "cancelletto" # dal nome del tag. La descrizione completa dello stile in questo caso potrebbe essere simile a questa: img # OnePic {altezza: 50%;}

Consigliato: