Как сделать текстовую ссылку. Как сделать изображение ссылкой. Продолжение.
2.2. В предыдущей части статье мы ответили на вопросы: как сделать текстовую ссылку?, как сделать изображение ссылкой? Заодно коль упомянули тег <img> рассмотрим и его некоторые атрибуты, тем более на блогах некоторых новичков я наблюдаю, как картинка непристойно налазит на текст.
<img src="http://адрес_картинки" style=" title=" alt="" width="200" height="300" border="1">
style="" — это указание, что будут задействованы атрибуты стиля в самом теге. Эти атрибуты при желании можно свести в специальную таблицу стилей css и они будут охватывать много тегов, но это не для начального уровня.
style="float: left; margin-top: 5px; margin-bottom: 5px; margin-left: 10px; margin-right: 10px;"
float: left — это указание, что картинка будет слева, а текст будет ее обтекать справа.
Если float: right — то наоборот.
margin — это отступы в пикселях.
С тегом style разобрались.
title="" — заголовок картинки , отображается при наведении курсора.
alt= "" — альтернативный текст, отображается, если картинка не загрузилась.
height="" — высота картинки в пикселях.
width="" — ширина картинки в пикселях.
Т. е. картинку можно уменьшить или увеличить.
border="" толщина рамки вокруг картинки в пикселях.
Размеры картинки, отступы и стиль обтекания текстом можно изменить и в визуальном редакторе. Надеюсь, что вставлять картинку в текст Вы умеете.
2.2.1 В визуальном редакторе текста жмем на картинку — появляются две пиктограммы, нажимаем на левую и попадаем в редактор картинки. Здесь можно выбрать размер картинки, а также заполнить некоторые атрибуты тега
title="" — заголовок, при наведении курсора он появляется.
alt="" — альтернативный текст на случай, если картинка не загрузилась.
Так же Вы можете уменьшить размеры картинки, которые Вы задали когда вставляли картинку в текст.
Теперь жмем на «Дополнительно» и здесь появляются новые возможности. Интересны для новичка изменение размеров картинки и свойства картинки — возможность задать толщину рамки, вертикальный отступ и горизонтальный, все в пикселях. Вот картинка и не будет наезжать на текст.
Мы рассмотрели: как сделать текстовую ссылку?, как сделать изображение ссылкой? В продолжении первой статьи рассмотрели дополнительные атрибуты тега <img>.
На сегодня все. Это элементарные вещи. Для углубленного знания есть специальные инфо курсы на DVD (по языку разметки html и каскадным таблицам стилей) читайте мои статьи Очень качественный интернет-ресурс видео обучающих курсов. Сверхпопулярные обучающие программы Info-DVD .
Общайтесь со мной:
Related posts:
Все очень доступно и понятно написано, за что автору спасибо.
Заходите еще.
Спасибо за урок. Очень подробно и полезно рассказали о ссылках.
И мне у Вас понравилось.
Оформила подписку на ваши статьи — надеюсь, с вашей помощью освоение компьютера у меня пойдет успешнее. Спасибо!
Хорошо если так.
Элементарно это для Вас))
А для меня, какие то космические технологии))
Николай, почему у Вас нету аватарок? Можно ведь не обязательно свое фото, а образ какой нибудь, который Вас выражает! Например Брюс Уиллис))
Все правильно Оксана. Виноват. Подумаю. Может вставлю и свое изображение. А Вам хочется обязательно брутала? О эти современные женщины. Хотя, мне нравится образ Брюса Уиллиса, особенно в «Пятом элементе». Оксана, обращайтесь если что непонятно по теме, можно даже на email, всегда рад Вам помочь.
Да Николай, среди сегодняшней процветающей голубизны (прошу прощения), как то тянет на брутал))
Но Вас, я готова узреть в любом виде!
Оксана, я к сожалению не брутал, но и не голубой — мне слишком нравятся женщины, был в браке, двое взрослых сыновей.