| Kosten | Четверг, 13 Февраля 2020 | Сообщение 1 |
| В этом материале представлена статья, на тему установки изображение на сайте, где вы научитесь вставлять картинку в HTML. Ведь для добавления картинки или самого изображение в документ, то здесь задействуем тег img, а также атрибут src - который по умолчанию определяет путь к нашему графическому файлу, или просто изображению. И здесь нужно изначально знать, что работаем только с форматом GIF, также PNG или JPEG, которые считаются самыми распространенными.
Но и также в самом теге img незабываем прописать атрибут alt, который отвечает за ключевые слова, что привязаны той или иной картинке, которую размещаем на интернет сайте или блоге. Или просто называемый альтернативный текст, который учитывается пиковыми системами, а это значит при запросе в поиске с аналогичным тегом появится ваша картинка, где большая возможность, что по ней перейдут, если соответствует поисковой запрос.
В HTML4, HTML5
Код <img src="Ссылка на изображение" alt="Текст в 2 или 3 словах по картинке">
Далее:
В XHTML
Код <img src="Ссылка на изображение" alt="Описание картинки в 2 или 3 словах" />
Далее:
Когда задействован XHTML или более строгий HTML4, то тег img по возможности можем разместить только внутри блочных элементов, например это p или div.
Также существуют атрибуты атрибуты, где мы задаем размер картинки при установки.
width — ширина изображение может идти, как px или процентах;
height — высота изображение может идти, как px или процентах.
Если мы задаем в пикселях ширину или высоту, то в независимости на каком приборе просматриваем, то здесь не изменяется не чего. Если прописываем проценты, то это уже картинка идет адаптивной, которая изменяется по форме и подстраивается под монитор или экран.
Например:
Код <img src="Здесь ссылка на картинку" width="65" height="35">
В процентах так будет:
Код <img src="Здесь ссылка на картинку" width="25%" height="10%">
Далее:
При помощи атрибута align, то здесь мы самостоятельно выравниваем соответствие картинки, как нам нужно, где задействуем 2 элемента.
По сути у самого атрибута align больше значений, но мы рассмотрим самые нужные.
left — картинка выставлена по левому края страницы, а текст обтекает картинку справа;
right — картинка выставлена по правому края страницы, а текст и другие элементы обтекают картинку слева.
Примеры:
Код <img src="Ссылка на изображение в левую сторону" align="left">
и
Код <img src="Ссылка на изображение в правую сторону" align="right">
Далее:
Если мы устанавливаем изображение на странице к описанию, то думаю многие замечали, что картинка плотно подходит к значениям, что не очень красиво смотрится.
Но при помощи следующих атрибутов тега IMG все можно исправить.
vspace — выставляем верхний и нижний отступы;
hspace — здесь создаем боковой отступ (слева и справа).
Например:
Код <img src="Ссылка на картинку" align="left" vspace="8" hspace="15">
Далее:
Также вокруг картинки можно выставить рамку, где ширина идет в пикселях.
Код < img src="Ссылка на картинку" border="3">
Здесь поставили 3 пикселя вокруг картинки, что получилась рамка. Это небольшие мануалы, что при начала совершенство пригодятся любому новичку.
| | Страна: (RU) |
| |
