Стоит согласиться с тем, что если добавить несколько разных цветов на вашу страничку её внешний вид существенно изменится. Но все же, чего-то не хватает. Чего именно, как думаете Вы? Совершенно верно! Нашей странице недостаточно именно графического оформления, а именно html изображения. В данной статье мы поделимся с вами секретами о том, как добавить изображение html для того, чтобы внешний вид вашего ресурса стал лучше, а посещаемость увеличилась в несколько раз. Если все пройдет правильно, ваш заработок в интернете станет намного больше. В данной ситуации нашим помощником будет атрибут img src. html код расположения нашего изображения на ресурсе выгладит так:
И так, продолжим, для того чтобы показать Вам как поместить картинку html на странице, я загрузил её с Интернет ресурса. Так как мы создаем страницу про уроки html, то и картинку я подобрал соответствующей тематике. Благодаря программе для редактирования изображения Фотошоп, я отредактировал свою картинку и уменьшил её до того размера, какой мне необходим. Следующим делом необходимо закачать изображение на хостинг сайта, что я и сделал. Далее необходимо тот адрес, где расположена картинка вставить в код html.
Код html, который мы получили, вставляем на нашу страничку.
Уроки HTML для начинающих
Что же собой представляет файл html? Это сокращенная аббревиатура от Hyper Text Markup Language что на русском звучит как язык гипертекстовой разметки. Данный язык разметки используется для отображения интернет страниц. Когда вы набираете в поиске запрос и переходите на любой сайт, и страница поисковика и сайта отображается с помощью Html.
Именно с помощью элементов html который прописан на каждой конкретной странице любой браузер узнает: какой требуется указывать шрифт, какие между текстовыми строчками должны быть пробелы, какого размера должен быть тот или иной текст и т.д. Сама суть, языка разметки, кроется в его названии – размещает, тесть диктует вариант размещения информации на странице. Если Браузер это программа MS Word, то документом будет та же текстовая информация с картинками и прочим, но уже наполненная html кодом.
Если вы все же решитесь не вставлять дополнительные элементы, а просто вставить необходимые абзацы, они тоже отобразятся, однако совсем не так как это выглядит в текстовом редакторе. Не будет абзацев, картинок, жирных шрифтов и прочего. Браузер не понимает код обычного Word, он реагирует только на html разметку.
Если вам необходимо расположить определенный текст рядом с вашей картинкой html, необходимо воспользоваться атрибутом align. Этот атрибут отвечает за выравнивание изображения. В нашем случае к align необходимо подставить left (потому что картинка расположена слева). После проведения данной процедуры наш текст выровняется по левому краю относительно изображения. Если к атрибуту подставить right, то соответственно текст выровняется по правому краю относительно изображения.
Для того чтобы расположение и дизайн картинки был лучше, можно подставить несколько атрибутов для .
1. vspace=”15″ – устанавливает расстояние между вашим текстом и изображением по вертикали;
2. hspace=”25″ – устанавливает расстояние между вашим текстом и изображение по горизонтали;
3. height=”200″ – высота изображения;
4. width=”100″ – ширина изображения.
Если вам необходимо подкорректировать ширину рамки вокруг изображения, или же убрать её абсолютно, тогда поможет вам атрибут border. Если вы хотите изменить цвет рамки, тогда вам на помощь придёт атрибут bordercolor. Стоит отметить то, что изменения производятся в пикселях.
Далее оформляем в виде кода html. Вставляем на наш ресурс.
Если вы все же решитесь не вставлять дополнительные элементы, а просто вставить необходимые абзацы, они тоже отобразятся, однако совсем не так как это выглядит в текстовом редакторе. Не будет абзацев, картинок, жирных шрифтов и прочего. Браузер не понимает код обычного Word, он реагирует только на html разметку.
На этом все. Теперь вы сумеете оформить ваш сайт красивыми картинками.
