Как вставить две картинки рядом по горизонтали html код

Категория: html Автор: lelic Опубликовано: 10-10-2012

Метки:

 

Сегодня столкнулся с проблемой размещения картинок.

Такая проблема надо разместить две картинки рядом по горизонтали.

способ первый самый легкий: Заключить эти картинки в таблицу.

<table>
<tr>
<td><a href="https://ваша_ссылка "_blank"><img title="Описание" src="ссылка картинки" alt=""width="150" height="100"/></a> </td>
<td><a href="https://ваша_ссылка "_blank"><img title="Описание" src="ссылка картинки" alt=""width="150" height="100"/></a></td>
</tr>
</table>

пример использования

Второй сложнее. С помощью <div> этот способ использую я

<div align="center">

<div style="float:left">
<a href="https://ваша_ссылка "_blank"><img title="Описание" src="ссылка картинки" alt=""width="150" height="100"/></a>
</div>
<div style="float:right">
<a href="https://ваша_ссылка "_blank"><img title="Описание" src="ссылка картинки" alt=""width="150" height="100"/></a>
</div>

Третий способ с использование CSS стиля. (мне кажется лишнее если вы раз прописываете картинку писать для нее стиль)

Пояснения:

float:left - обтекание с левой стороны

float:right - обтекание с правой стороны

_blank - открывает страницу в новом окне

alt="" - описание картинки пустым оставлять не желательно

width="150" height="100" ширина высота

Очень плохоПлохоХорошоОчень хорошоОтлично (3голосов, в среднем: 3,00 из 5)
Загрузка...

Комментарии:

Оставить комментарий!

/a>
Наверх