• Авторизация


Как разместить рядом несколько картинок? 29-10-2012 04:27 к комментариям - к полной версии - понравилось!


 Источник:http://dushechki.blogspot.ru/2012/10/blog-post_12.html

 Автор :Гришина Елена

 

Как разместить рядом несколько картинок?

 

Иногда бывает очень надо)), чтобы картинки в посте были размещены в один ряд.

Можно сделать коллаж, конечно. Я почему-то не очень люблю коллажи, особенно их делать)) видимо наелась ими в свое время.

Можно сделать с помощью выравнивания, но это ТАК криво работает в блоггере, что проще вообще не делать) 

Расскажу, как вставляю картинки в пост я.


Сразу скажу, есть и другие способы. Но я привыкла именно к такому способу, потому что этот блог - не первый мой веб-проект, до этого я сама делала сайт, а точнее интернет-магазин детских вещей, делала его на платформе wordpress и перелопатив много инфо по вставке картинок, остановилась на этом способе.

Заранее ответив на ваш вопрос, напишу, что интернет-магазин я давно продала (у меня была 1/2 часть). Сейчас я с грустью захожу на его сайт и вижу, что сайт совсем не ведется и не обновляется. Дизайн переделан...точнее изуродовано то, что создавалось с таким трудом. Но это уже не мое дело, что очень хорошо) 

И теперь, если мне нужно вставить много картинок подряд в одну строчку, или картинки и текст рядом, и чтобы все было ровненько и красиво,  я использую таблицу с прозрачными границами.

Сложно, скажете вы? Зато работает и вы не зависите от глюков визуального редактора. А раз прописав код таблицы, вы можете его просто копировать из поста в пост.

Начнем?

Например, нам нужно разместить в один ряд три картинки:






 

1. Для этого создадим сообщение и написав текст, остановимся в нужном нам месте и переключимся врежим HTML.

2. В режиме HTML вставляем код таблицы.


<table>
<tbody>
<tr>
<td>столбец 1</td>
<td>столбец2</td>
<td>столбец3</td>
</tr>
</tbody>
</table>

По коду видно, что теги 
<tr></tr> - означают начало и конец строки, а
<td></td> - начало и конец столбца.

Чтобы менять количество строк и столбцов, надо просто менять количество этих тегов и их содержимое (то, что будет внутри ;-))

Важно: теги  столбцов помещены внутри тегов строк, видите? 


3. Возвращаемся в режим Создать.

Все страшные коды исчезли, остались только три слова в один ряд:
столбец1 столбец2 столбец3

4. Вставим первую картинку. Для поставим курсор перед словом "столбец 1" и обычным способом нажмем на вставку картинки. Получится вот так:

столбец 1
столбец2 столбец3


5. Вставляем вторую картинку, для этого ставим курсор перед словом "стоблец2" и жмем на вставку картинки.

столбец 1
столбец2
 
столбец3

3. Тоже самое делаем и с третьей картинкой.

столбец 1
столбец2
столбец3


Слова "стоблбец 1", "столбец 2" и "столбец 3" можно удалить, выделив и нажав на Delete, а можно и заменить их на описание картинок.

Они также будут выравниваться в рамках столбцов таблицы.

Ляляля
Ляляляля
Ляляля

Смотрим на результат, задаем нужный размер картинок, можем сделать их ссылками ( здесь написано, как это сделать).

 
вверх^ к полной версии понравилось! в evernote


Вы сейчас не можете прокомментировать это сообщение.

Дневник Как разместить рядом несколько картинок? | Asilinca - Дневник Asilinca | Лента друзей Asilinca / Полная версия Добавить в друзья Страницы: раньше»