Еще раз напоминаю, что если Вы хотите сделать фон к вашему сообщению, отличный от фона днева, то следует сделать следующее:
1. Вариант с картинкой-фоном |
ВАЖНО! Поскольку фон-картинка бывает темная или светлая, а настройки дизайна предполагают светлые или темные буквы, чтобы при цитировании в другом дневнике не получилось "белое на белом" или "черное на черном", рекомендуется ВАШ ТЕКСТ заключать в тег с указанием цвета букв, например:
<font color="#000000">ВАШ ТЕКСТ<font> - буквы будут черные всегда
<font color="#ffffff">ВАШ ТЕКСТ<font> буквы будут белые всегда
(ну или какой цвет вы укажете по таблице - голубой, желтый и любой другой)
2 Вариант с цветом-фоном (например такой серый будет код #eeeeee) |
3 Особенность такого оформления - фон выходит только сверху на буквах, а НЕ растягивается на всю ширину текста. Сравните с предыдушим случаем.
4 Похожий случай - но уже с картинкой. Обратите внимание как вставляется картинка и как заканчивается строка по сравнению с примерами ранее
5 Для фонового цвета используем код
Как видите, в отличие от верхнего примера,
он располагается на ВСЮ ширину поста,
а не только до окончания ширины текста,
и не имеет полей справа-слева
(если специально не прописать)
6 Для фоновой картинки, которая также не имеет полей справа-слева, используем код ниже. Обратите внимание, что поля прописать можно, и даже очень большие, для этого нужно вставить специальные значения padding (см. ниже)
7 Обратите внимание, что поля прописать можно, и даже очень большие, для этого нужно вставить специальные значения. Пример: padding:10px 3px 0px 50px;
Первое число - отступ сверху, второе число - отсутуп справа, третье число - отступ снизу (здесь мы поставили ноль для примера) и четвертое число - отступ слева (как видите, он здесь самый большой)
8.
Текст с цветной основой под фон, возможной рамкой border, цветом букв и т.д.:
Сначала все поле тега заливается цветом, например, #000 - черным. Вместо этого числа можно подставить любой другой цвет из таблицы цветов (например получится background-color:#fff где #fff белый цвет как у меня сейчас в виде рамочки). На самом деле фоновым я сделала зеленый, но его видно будет только в 2 случаях: либо если не загрузится фоновая картинка, либо если фоновые гифки будут с прозрачной частью.
border: 0px ширина рамки. Если бы я захотела вообще без рамки, то поставила бы 0 (ноль). В данном случае это 30 (тридцать). У прозрачных фоновых гиф-картинок прозрачный фон сменится на цвет, который вы залили в основу.
padding:0px 60px; означает что текст начинается отступив от краев картинки: первое число-сверху второе число-сбоку.
Минус такой формы тега: картинка множится и на экран выходит не одна, а подряд много-много (как в данном случае). Одновременно такая форма тега (как и для случая 2.2) очень удобна, если вы хотите сделать из одного цветочка весь экран в цветочек.
Есть другая форма тега - не через div (где поля надо указывать дополнительно), а через table (там небольшие отступы полей уже по умолчанию, сравните с примерами 1-2:
9 А такая рамочка накладывается как увеличенный аналог фона и хороша под картинку, например:
Место куда вставлять адрес фона при желании оставлено ниже в коде background-image: url('АДРЕС ФОНА')
10 Для подписания картинки, которая выходит на экран ОДИН РАЗ. WIDTH: ширина картинки например 700px; HEIGHT: высота картинки например 150px. Рассмотрим более подробно тот же принцип с нижеследующей картинкой:
Сюда можно
написать
что-то умное
Ka82 |
---|
Вот, ниже код этой "говорящей" гифки:
А вот код в который можно вставить не обязательно эту гифку, но и указать свои параметры, ширину:
valign="bottom" означает, что текст подписывается внизу. При желании подписать сверху пишите valign="top"
Тут можно регулировать без проблем высоту и ширину картинки, Courier new" - это пример шрифта, выбираемый вами для текста. Здесь и вообще WIDTH - ширина, HEIGHT высота. Рекомендую сохранять эти параметры как в оригинале если не хотите, чтобы ваша картинка расползлась, вытяналась или ужалась, а также расплылась.
11. В некоторых браузерах это отображается по-разному, но есть фильтры затуманивания, указание ширины и высоты не в пикселях а процентре занимаемого места от экрана. У меня, например, Опера и Эксплоэр видят это несколько по-разному |
По фильтрам рекомендую посмотреть отдельный пост. Ссылка на него у меня в шпаргалке наверху страницы.
table width="75% в данном теге - часть занимаемого экрана картинкой в ширину. Просто если картинка узкая и занимает в ширину только 45% экрана, а вы поставите значение 99%, то картинка размножится по ширине пространства в ширину.
width:45% в данном случае - ширина занимаемого текста опираясь на размеры картинки. То есть если ваша картинка в ширину занимает 80%, а для текста вы установите 50%, то от общего экрана он займет лишь 80х0,5=40%.
Напоминаю, что возможности со шрифтом описаны отдельно, например, в посте
http://www.liveinternet.ru/users/ka82/post85922639/