Как да намалим изображението в Html

Съдържание:

Как да намалим изображението в Html
Как да намалим изображението в Html

Видео: Как да намалим изображението в Html

Видео: Как да намалим изображението в Html
Видео: HTML5 уроки для начинающих | #10 - Отображение изображений в HTML 2024, Март
Anonim

В езика за маркиране на хипертекст (HTML) се използва специална команда “tag” за показване на изображение на страница. Този маркер се нарича img и съдържа набор от променливи - "атрибути". С помощта на атрибути можете да определите всички аспекти на показването на изображение в хипертекстова страница, включително неговите размери. Това обаче не е единственият начин за решаване на проблема - можете също да намалите размера на изображението, като използвате Cascading Style Sheets (CSS).

Как да намалим изображението в html
Как да намалим изображението в html

Инструкции

Етап 1

Поставете атрибутите височина и ширина в маркера, отговорен за показване на желаното изображение. Задайте първия на вертикалния размер на картината, а втория хоризонтално. Задайте и двете числа в пиксели, но няма нужда да посочвате мерни единици - px - тук. Когато изчислявате необходимите стойности за тези атрибути, обърнете внимание на спазването на пропорциите на намаляването на картината, в противен случай тя ще се покаже в изкривена форма. Например, за да поставите на страница наполовина картина от файл, наречен SomePic.jpg, чиито начални размери са 500 на 300 пиксела, тагът може да бъде направен със следната команда:

Стъпка 2

Можете да зададете пропорционално намаляване на оригиналните размери на изображението в проценти. За да направите това, използвайте само атрибута височина, без да указвате ширина, и добавете знак за процент, след като посочите номера, определящ размера. Например можете да постигнете същия ефект като в примера от предишната стъпка с таг, написан в тази форма:

Стъпка 3

Ако искате да посочите размера на изображението, като използвате описанието на стиловете, използвайте едно и също име на маркера - img - и атрибутите - ширина и височина. В този случай винаги трябва да се посочват мерните единици - px, pt или%. За да зададете наполовина размера на абсолютно всички изображения на страницата, поставете следния запис в блока за описание на стила: img {височина: 50%;} Ако трябва да намалите размера само на едно изображение, добавете допълнителен атрибут id към неговия таг и му присвоете един уникален за изображенията на тази стойност на страницата - например PicOne: Добавете същата стойност към записа на стила, като я разделите с "хеш" # от името на маркера. Пълното описание на стила в този случай може да изглежда така: img # OnePic {височина: 50%;}

Препоръчано: