Разместим в дневнике большое количество небольших по размеру рисунков. Для примера я взял 6 анимированных смыйликов
Для того что бы рисунки располагались горизонтально необходимо убрать галочку с "Сохранять переводы строк в тексте.".
Я специально взял смайлы разного размера. Попробуем теперь сделать вывод рисунков более логичным.
Большие смайлы в одной колонке, маленькие - в другой
Для этого построим таблицу из двух колонок и трех строк ( по количеству смайлов одного размера )
Коды рисунков смайлов ( видны при редактировании черновика или поста )
Что бы не гадать где какой рисунок я в кодах рисунков, в alt подписал рисунки. alt - это альтернативный текст который виден в том случае если рисунок по какой то причине не может быть показан
Все что теперь осталось это разместить рисунки каждый в своей ячейке таблицы
|
|
|
|
|
|
|
|
|
Ширина первой и второй колонки не одинаковые что не всегда красиво. Добавим в нашу таблицу еще одну строку Эта строка задаст ширину колонок в 200 пикселей ( можно указать ширину в процентах от общей ширины таблицы )
Что бы не загромождать код я в дальнейшем буду показывать только часть кода где делаем изменения
|
|
|
|
|
|
|
|
|
Осталась самая малость. Разместить рисунки по центру ячеек. Для этого в добавим valign="middle" и align="center"
|
|
|
|
|
|
|
|
|
Подпишем колонки. Для этого добавим вначале еще одну строку в которой вместо пропишем
| Большие смалы | Маленькие смайлы |
|---|---|
|
|
|
|
|
|
|
|
|
Добавим к каждому смайлу название.
Вид таблицы мягко говоря не очень :)
| Большие смалы | Маленькие смайлы |
|---|---|
|
Большой1
|
Маленький1
|
|
Большой2
|
Маленький2
|
|
Большой3
|
Маленький3
|
Исправим это добавив еще 2 колонки для названий смайлов
Обратите внимание на то что добавилось еще две строки с и . Даже если в ячейках ничего не выводится количество ячеек в каждой строке должно быть одинаковым!!!!!
Название колонок "Большие смайлы и маленькие смайлы" не совсем правильно расположены
| Большие смалы | Маденькие смайлы | ||
|---|---|---|---|
|
|
Большой1 |
|
Маленький1 |
|
|
Большой2 |
|
Маленький2 |
|
|
Большой3 |
|
Маленький3 |
Объеденим попарно ячейки с названием колонок.
| Большие смалы | Маденькие смайлы | ||
|---|---|---|---|
|
|
Большой1 |
|
Маленький1 |
|
|
Большой2 |
|
Маленький2 |
|
|
Большой3 |
|
Маленький3 |
Не нравится мне грозный красный смайл :)). Я его выделю каким то фоном что бы он бросался в глаза :). Добавлю в ячеку с этим смайлом фоновый цвет
Заодно и строку с названием колонок выделю фоном
| Большие смалы | Маденькие смайлы | ||
|---|---|---|---|
|
|
Большой1 |
|
Маленький1 |
|
|
Большой2 |
|
Маленький2 |
|
|
Большой3 |
|
Маленький3 |
Сделаем этот грозный смайл не таким грозным. Разместим его на этом фоновом рисунке :))
Для этого добавим в ячейку с этим смайлом параметр background
| Большие смалы | Маденькие смайлы | ||
|---|---|---|---|
|
|
Большой1 |
|
Маленький1 |
|
|
Большой2 |
|
Маленький2 |
|
|
Большой3 |
|
Маленький3 |
Что еще творить с таблицей зависит только от вашей фантазии :)) Можно каждую строку выделить своим цветом добавиви в параметр background. Можно для каждой ячейки или строки задать фоновый рисунок прописав background. Вместо текста в ячейках можно прописать ссылки.
ps: Добавьте в код рисунка title="текст" и при наведении мышки на рисунок будет выскакивать подсказка с текстом
[300x297]
Исходное сообщение Великовозрастное_дитя Разместим в дневнике большое количество небольших по размеру рисунков. Для примера я взял 6 анимированных смыйликов Для того что бы рисунки располагались горизонтально необходимо убрать галочку с "Сохранять переводы строк в тексте.". Я специально взял смайлы разного размера. Попробуем теперь сделать вывод рисунков более логичным. Большие смайлы в одной колонке, маленькие - в другой Для этого построим таблицу из двух колонок и трех строк ( по количеству смайлов одного размера ) Коды рисунков смайлов ( видны при редактировании черновика или поста ) Что бы не гадать где какой рисунок я в кодах рисунков, в alt подписал рисунки. alt - это альтернативный текст который виден в том случае если рисунок по какой то причине не может быть показан Все что теперь осталось это разместить рисунки каждый в своей ячейке таблицы Ширина первой и второй колонки не одинаковые что не всегда красиво. Добавим в нашу таблицу еще одну строку " disabled="disabled" size="55" /> Эта строка задаст ширину колонок в 200 пикселей ( можно указать ширину в процентах от общей ширины таблицы ) Что бы не загромождать код я в дальнейшем буду показывать только часть кода где делаем изменения ............. ............. Осталась самая малость. Разместить рисунки по центру ячеек. Для этого в " disabled="disabled" size="7" /> добавим valign="middle" и align="center" .......... ........... Подпишем колонки. Для этого добавим вначале еще одну строку в которой вместо " disabled="disabled" size="5" /> пропишем " disabled="disabled" size="5" /> Большие смайлы Маленькие смайлы .......... ........... Большие смалы Маленькие смайлы Добавим к каждому смайлу название. Большие смалы Маленькие смайлы Большой1 Маленький1 Большой2 Маленький2 Большой3 Маленький3 Вид таблицы мягко говоря не очень :) Большие смалы Маленькие смайлы Большой1 Маленький1 Большой2 Маленький2 Большой3 Маленький3 Исправим это добавив еще 2 колонки для названий смайлов Обратите внимание на то что добавилось еще две строки с " disabled="disabled" size="5" /> и " disabled="disabled" size="5" />. Даже если в ячейках ничего не выводится количество ячеек в каждой строке должно быть одинаковым!!!!! Большие смалы Маленькие смайлы Большой1 Маленький1 Большой2 Маленький2 Большой3 Маленький3 Название колонок "Большие смайлы и маленькие смайлы" не совсем правильно расположены Большие смалы Маденькие смайлы Большой1 Маленький1 Большой2 Маленький2 Большой3 Маленький3 Объеденим попарно ячейки с названием колонок. Большие смалы Маленькие смайлы ................... ................... Большие смалы Маденькие смайлы Большой1 Маленький1 Большой2 Маленький2 Большой3 Маленький3 Не нравится мне грозный красный смайл :)). Я его выделю каким то фоном что бы он бросался в глаза :). Добавлю в ячеку с этим смайлом фоновый цвет Заодно и строку с названием колонок выделю фоном Большие смалы Маденькие смайлы ..... ..... Большой2 ....... ....... Большие смалы Маденькие смайлы Большой1 Маленький1 Большой2 Маленький2 Большой3 Маленький3 Сделаем этот грозный смайл не таким грозным. Разместим его на этом фоновом рисунке :)) Для этого добавим в ячейку с этим смайлом параметр background Большие смалы Маденькие смайлы ..... ..... Большой2 ....... ....... Большие смалы Маденькие смайлы Большой1 Маленький1 Большой2 Маленький2 Большой3 Маленький3 Что еще творить с таблицей зависит только от вашей фантазии :)) Можно каждую строку выделить своим цветом добавиви в " disabled="disabled" size="5" /> параметр background. Можно для каждой ячейки или строки задать фоновый рисунок прописав background. Вместо текста в ячейках можно прописать ссылки. ps: Добавьте в код рисунка title="текст" и при наведении мышки на рисунок будет выскакивать подсказка с текстом
очень полезная ссылка))
| Большие смалы | Маденькие смайлы |
|
Большой2 | ....... ....... |
|---|