En el llenguatge de marcatge d’hipertext (HTML), s’utilitza una ordre especial “tag” per mostrar una imatge en una pàgina. Aquesta etiqueta es coneix com img i conté un conjunt de variables - "atributs". Amb l'ajut d'atributs, podeu determinar tots els aspectes de la visualització d'una imatge en una pàgina d'hipertext, incloses les seves dimensions. Tanmateix, aquesta no és l'única manera de resoldre el problema: també podeu reduir la mida de la imatge utilitzant Fulls d'estil en cascada (CSS).
Instruccions
Pas 1
Col·loqueu els atributs d’alçada i amplada a l’etiqueta responsable de mostrar la imatge desitjada. Establiu el primer a la mida vertical de la imatge i el segon horitzontalment. Establiu els dos números en píxels, però no cal indicar unitats - px - aquí. En calcular els valors necessaris per a aquests atributs, presteu atenció a l’observança de les proporcions de la reducció de la imatge, en cas contrari es mostrarà de forma distorsionada. Per exemple, per posar en una pàgina una imatge a la meitat d'un fitxer anomenat SomePic.jpg, les dimensions inicials del qual són de 500 per 300 píxels, l'etiqueta es pot fer amb l'ordre següent:
Pas 2
Podeu definir la reducció proporcional de les dimensions de la imatge original en percentatge. Per fer-ho, utilitzeu només l'atribut d'alçada sense especificar l'amplada i afegiu un signe de percentatge després d'especificar el nombre que defineix la mida. Per exemple, podeu obtenir el mateix efecte que a l'exemple del pas anterior amb una etiqueta escrita en aquest formulari:
Pas 3
Si voleu especificar la mida de la imatge mitjançant la descripció dels estils, utilitzeu el mateix nom de l'etiqueta - img - i els atributs - amplada i alçada. En aquest cas, sempre s’han d’especificar les unitats de mesura (px, pt o%). Per establir la reducció a la meitat de la mida de totes les imatges de la pàgina, col·loqueu l'entrada següent al bloc de descripció de l'estil: img {height: 50%;} a la seva etiqueta i assigneu-ne una única per a les imatges d'aquest valor de la pàgina; per exemple, PicOne: afegiu el mateix valor al registre d'estil, separant-lo amb un "hash" # del nom de l'etiqueta. La descripció completa de l'estil en aquest cas pot tenir aquest aspecte: img # OnePic {height: 50%;}
