Просто форум...

Объявление

Форум переходит в этап реконструкции. Но продолжает работать как и раньше, все вопросы задавайте в свои темы =)

Информация о пользователе

Привет, Гость! Войдите или зарегистрируйтесь.


Вы здесь » Просто форум... » Справочная по форумам. » FAQ: Оформление Таблиц


FAQ: Оформление Таблиц

Сообщений 1 страница 6 из 6

1

Автор: Saishoni.
Перепечатка материалов разрешена только с согласия автора.

0

2

Внутреннее оформление таблицы

Картинка.

Код:
<img src="адрес картинки">

Ссылка.

Код:
<a href="ссылка">Текст</a>

e-mail
(tut@pochta.ru - меняем на своё)

Код:
<a href="mailto:tut@pochta.ru">tut@pochta.ru</a>

Размер текста 1 - 100. Чаще используется 3 и 4.

Код:
<font size="?">Размер текста</font>

Цвет текста. Обычный - red; Веб - #FF0000.

Код:
<font color="?">Цвет текста</font>

Шрифт. Например: Comic Sans Ms.

Код:
<font face="?">Шрифт</font>

Три предыдущих параметра вместе.

Код:
<font color="?" size="?" face="?">Текст</font>

Текст по центру.

Код:
<center>Текст по центру</center>
Код:
<center />

Жирный текст

Код:
<b>Жирный текст</b>

Курсив текст

Код:
<i>Курсив текст</i>

Подчеркнутый текст

Код:
<u>Подчеркнутый текст</u>

Зачеркнутый текст

Код:
<s>Зачеркнутый текст</s>

Абзац или с новой строки.

Код:
<br>

Линия.

Код:
<hr>

Ширина линии. Может быть и в %

Код:
<hr width="500px">

Высота линии. Может быть и в %

Код:
<hr height="10px">

Цвет линии. Обычный - red; Веб - #FF0000.
(Работает только в ИЕ)

Код:
<hr color="?">

Мини Контейнер.
http://i021.radikal.ru/0906/9d/f00a05ab3415.png

Код:
<textarea readonly rows="3" cols="10">Мини Контейнер, например для баннера...</textarea>

Мини Контейнер 2.
http://s61.radikal.ru/i171/0906/db/93ed0652eca8.png

Код:
<div style="OVERFLOW: auto; WIDTH: 100px; HEIGHT: 100px;">
Тут обычно находится текст.
Не забывайте переносить,
иначе форма просто растянется =)
<br><br></div>

WIDTH: 100px; - Ширина
HEIGHT: 100px; - Высота
Регулируйте под себя.

0

3

CSS в объявлении =)

Убрать слово Объявление

Код:
<style type="text/css">
#pun-announcement h2 {display: none}
#pun-announcement .container {padding-top: 1em}
</style>

Сделать объявление прозрачным.
(например будет виден внутренний фон, если у Вас нет внутреннего, значит задний)

Код:
<style type="text/css">
#pun-announcement .container {background-color: transparent;}
</style>

Сменить фон.

Код:
<style type="text/css">
#pun-announcement .container {background-image: url("Ссылка на картинку");}
</style>

Закрасить цветом.

Код:
<style type="text/css">
#pun-announcement .container {background-color: #000000;}
</style>

Курсив во всей таблице.

Код:
<style type="text/css">
#pun-announcement .container {font-style: italic;}
</style>

Сменить шрифт.

Код:
<style type="text/css">
#pun-announcement .container {font-family: Comic Sans Ms;}
</style>

Размер шрифта.
(размеры: xx-small, x-small, small, medium, large, x-large, xx-large)

Код:
<style type="text/css">
#pun-announcement .container {font-size: medium;}
</style>

Подчеркнутый текст.
(overline - верхнее подчеркивание)

Код:
<style type="text/css">
#pun-announcement .container {text-decoration: underline;}
</style>

Цвет шрифта.

Код:
<style type="text/css">
#pun-announcement .container {color: #FF0000;}
</style>

Примечание: Если Вы не понимаете как нужно совместить кода, а Вам нужно например цвет + шрифт, обращайтесь в тему по созданию таблиц, не забыв скопировать необходимые коды =)
Обычно 2 таких кода вместе не работают.
(Кроме первого)

0

4

Самостоятельно собираем код.

Например нам нужно поменять в объявлении не только цвет шрифта, но и сам шрифт сделать курсивом, а само объявление прозрачным Оо"
Как энто сделать??
Начинаем с самого главного..
1.

Код:
<style type="text/css">
.....тут содержимое.....
</style>

2. И пустую внутренность:

Код:
#pun-announcement .container {...}

3. Теперь нам нужен код цвета шрифта:

Код:
color: #FF0000;

4. Дальше код курсива:

Код:
font-style: italic;

5. И последнее прозрачность:

Код:
background-color: transparent;

Всё собрано =) Теперь нужно это как то соеденить.. ;)
Делаем всё по очереди, проще говоря вставляем всё в нутрь..
2 в 1, 3, 4 и 5 в 2 =)
Получаем:

Код:
<style type="text/css">
#pun-announcement .container {color: #FF0000; font-style: italic; background-color: transparent;}
</style>

Содержимое ставим в хтмл-верх.

П.С: По такому же принципу оформляются и остальные кода, так что не стесняйтесь эксперементировать))

0

5

Бегущая строка

Часть 1.

Бегущая строка и её составляющие
Можно ставить везде где поддерживается хтмл, а именно начиная с хтмл низ/верх, описания раздела, объявления и правил, и быстрого ответа.

Для того чтобы отобразить некий текст, баннеры и другие элементы в форме бегущей строки, помещаем свой текст (или html элементы) в теги:

Код:
<marquee>...</marquee>

(обычная бегущая строка)

Для этого тега можно опциально задать следующие атрибуты, или свойства бегущей строки:
Aling   - выравнивание текста.

Возможные значения:
LEFT - по левому краю
RIGHT - по правому
MIDDLE - по центру
BOTTOM - по нижнему


Behavior  - поведение текста (Способ движения).

Возможные значения:
SCROLL - движется в одном направлении, постепенно исчезая из поля зрения.
SLIDE - доезжает до края и останавливается.
ALTERNATE - ездит от края к краю.


Scrolldelay - задержка смещения (интервал в миллисекундах между показами текста на разных позициях, создающими эффект анимации).

Возможные значения: любое числовое.

Loop  - число проигрываний.

Возможные значения:
Число.
INFINITE - бесконечное проигрывание.

Widht  - ширина поля.
Height  - высота поля.


Direction  - направление движения.

Возможные значения:
LEFT
RIGHT
UP

Bgcolor - фон поля бегущей строки.
Vspace - отступ сверху и снизу поля.
Hspace - отступ слева и справа.

Пример горизонтальной бегущей строки:

Код:
<marquee behavior="scroll" direction="left" bgcolor="#FF0000" width="200" height="25" scrolldelay="10" loop="infinite">Ваш текст </marquee>

Пример вертикальной бегущей строки:

Код:
<marquee behavior="scroll" direction="up" bgcolor="#FFFF00" width="400" height="400" scrolldelay="100" loop="20">Ваш текст</marquee>

Чтобы строка останавливала движение при наведении мыши в тег надо добавить:

Код:
onMouseOver="this.stop()" 
onMouseOut="this.start()"

Пример:

Код:
<marquee onMouseOver="this.stop()"  onMouseOut="this.start()"> Ваш текст </marquee>

0

6

Бегущая строка.

Часть 2.
Чаще всего используются...
Обычная, горизонтальная бегущая строка.
Направление: <--

Код:
<marquee>Ваш текст </marquee>

Или:

Код:
<marquee direction="left">Ваш текст</marquee>

Обычная, горизонтальная бегущая строка.
Направление: -->

Код:
<marquee direction="right">Ваш текст</marquee>

Обычная, вертикальная бегущая строка.
Направление: вверх;

Код:
<marquee direction="up">Ваш текст</marquee>

Обычная, вертикальная бегущая строка.
Направление: в низ;

Код:
<marquee direction="down">Ваш текст</marquee>

Обычная, горизонтальная бегущая строка.
Направление: С права налево и обратно;

Код:
<marquee behavior="alternate">Ваш текст</marquee>

Обычная, вертикальная бегущая строка.
Направление: С верху в низ и обратно;

Код:
<marquee behavior="alternate" direction="down">Ваш текст</marquee>

0


Вы здесь » Просто форум... » Справочная по форумам. » FAQ: Оформление Таблиц


Рейтинг форумов | Создать форум бесплатно