Dans le langage de balisage hypertexte (HTML), une commande spéciale « balise » est utilisée pour afficher une image sur une page. Cette balise est appelée img et contient un ensemble de variables - "attributs". A l'aide d'attributs, vous pouvez déterminer tous les aspects de l'affichage d'une image dans une page hypertexte, y compris ses dimensions. Cependant, ce n'est pas la seule façon de résoudre le problème - vous pouvez également réduire la taille de l'image à l'aide de feuilles de style en cascade (CSS).
Instructions
Étape 1
Placez les attributs de hauteur et de largeur dans la balise chargée d'afficher l'image souhaitée. Réglez le premier à la taille verticale de l'image et le second à l'horizontale. Définissez les deux nombres en pixels, mais il n'est pas nécessaire d'indiquer les unités - px - ici. Lors du calcul des valeurs nécessaires pour ces attributs, faites attention au respect des proportions de la réduction de l'image, sinon elle sera affichée sous une forme déformée. Par exemple, pour mettre dans une page une image coupée en deux à partir d'un fichier nommé SomePic.jpg, dont les dimensions initiales sont de 500 par 300 pixels, la balise peut se faire avec la commande suivante:
Étape 2
Vous pouvez définir la réduction proportionnelle des dimensions de l'image d'origine en pourcentage. Pour ce faire, utilisez uniquement l'attribut height sans spécifier de largeur et ajoutez un signe de pourcentage après avoir spécifié le nombre définissant la taille. Par exemple, vous pouvez obtenir le même effet que dans l'exemple de l'étape précédente avec une balise écrite sous cette forme:
Étape 3
Si vous souhaitez spécifier la taille de l'image à l'aide de la description des styles, utilisez le même nom de balise - img - et les attributs - largeur et hauteur. Dans ce cas, les unités de mesure - px, pt ou % - doivent toujours être spécifiées. Pour définir la réduction de moitié de la taille d'absolument toutes les images de la page, placez l'entrée suivante dans le bloc de description de style: img {hauteur: 50 %;} Si vous devez réduire la taille d'une seule image, ajoutez un attribut id supplémentaire à sa balise et attribuez-lui une valeur unique pour les images de cette page - par exemple, PicOne: ajoutez la même valeur à l'enregistrement de style, en la séparant par un "dièse" # du nom de la balise. La description complète du style dans ce cas peut ressembler à ceci: img # OnePic {hauteur: 50 %;}
