On-line: гостей 0. Всего: 0 [подробнее..]
АвторСообщение
"Любовь как война - легко начать, трудно закончить и невозможно забыть" (с)




Сообщение: 6
Зарегистрирован: 03.05.10
Откуда: Russia
Репутация: 0
ссылка на сообщение  Отправлено: 03.05.10 20:03. Заголовок: Фон


Итак практика.


Берем стандартный дизайн Борды (синий)



За фон там отвечают только вот эти тэги.

<BODY bgcolor=#f0f0f0>

Плюс там есть еще фон таблицы и подложка для форума. Это вот тут:

<TABLE bgColor=#98aab1 cellSpacing=1 cellPadding=10 width=100% height=100% border=0>
<TR bgColor=#ffffff><TD valign=top>

Для того чтоб начать менять фон надо удалить фон таблицы bgColor=#98aab1 . Если вы еще и подложку хотите удалить, то получаем вот такой код.

<TABLE cellSpacing=1 cellPadding=10 width=100% height=100% border=0>
<TR><TD valign=top>


Чтобы просто изменить цвет фона мы меняем код цвета вот тут: <BODY bgcolor=#f0f0f0
Соответственно чтоб изменить цвет подложки , то меняем цвет в ее коде: <TR bgColor=#ffffff>


Это все просто и понятно. Но как поставить вместо фона какую либо размножающуюся картинку или обои?
Ответ ниже.

Как поставить картинку фона.


Для этого :

Ставим в HTML-верх , сразу после <STYLE> следующий код:

body{background-image:url(ссылка картинки);}

Вот и все. Мы получили картинку, которая размножилась сплошным фоном. Она прокручивается вместе с форумом.


Как сделать так чтоб картинка НЕ прокручивалась.


Для этого добавляем специальный код:

body{background-image:url(ссылка картинки);background-attachment: fixed;}


Если же выставите какие либо обои или вам не надо чтоб они размножались по вертикали или горизонтали, то необходимо поставить следующее:

body{background-image:url(ссылка картинки);background-repeat: no-repeat;}



Если же вам нужно чтоб фон не повторялся именно в каком то одном направлении, по горизонтали или по вертикали, то меняем код background-repeat: no-repeat; на вот такие:

background-repeat: repeat-x; -фон повторяется только по горизонтали.
background-repeat: repeat-y; -фон повторяется только по вертикали.




Еще несколько полезных кодов которые можно добавить в код фона:

background-position: top ; -указывает на положение картинки фона. В данном случае по центру сверху. Тэг top можно менять на left-влево, right- вправо и center- по центру экрана.



Коды можно (И нужно) совмещать

Пример:

body{background-image:url(ссылка картинки);background-attachment: fixed;background-repeat: no-repeat;background-position:center;}


Поставив такой код вы получите картинку висящую строго по центру, не повторяющуюся и не прокручивающуюся с таблицей.
Взято:http://generationx.forum24.ru/?1-4-0-00000009-000-0-0-1270836966

::[Life]:: Спасибо: 0 
ПрофильЦитата Ответить
Ответов - 10 [только новые]





Сообщение: 2
Зарегистрирован: 05.05.10
Репутация: 0
ссылка на сообщение  Отправлено: 05.05.10 20:15. Заголовок: У меня не получилось..


У меня не получилось:(

Спасибо: 0 
ПрофильЦитата Ответить
"Любовь как война - легко начать, трудно закончить и невозможно забыть" (с)




Сообщение: 64
Зарегистрирован: 03.05.10
Откуда: Russia
Репутация: 0
ссылка на сообщение  Отправлено: 05.05.10 20:20. Заголовок: Как?покажи свой HTML..


Как?покажи свой HTML Верх.

::[Life]:: Спасибо: 0 
ПрофильЦитата Ответить



Сообщение: 4
Зарегистрирован: 05.05.10
Репутация: 0
ссылка на сообщение  Отправлено: 06.05.10 12:26. Заголовок: <HTML> <..


<HTML>
<HEAD>
<TITLE>Форум</TITLE>
<STYLE type=text/css>body{background-image:url( );}
BODY{margin:10px;margin-top:15px;margin-bottom:10px;}
td{font-family:Verdana;}

.font1{font-size:12px;}
.font2{font-size:11px;font-weight:400;}
.font3{font-size:11px;font-weight:700;}
.font4{font-size:15px;}
.font5{font-size:11px;font-weight:700;COLOR:#ffa450;}
.font6{font-size:11px;font-weight:700;}

a:link{color:#006699;text-decoration:none;}
a:visited{color:#5493b4;text-decoration:none;}
a:hover{color: #dd6900;text-decoration:underline;}

tr.font3 {HEIGHT: 28px;BACKGROUND-IMAGE: url(http://jpe.ru/gif/skin/fon31.gif);}
tr.font5 {HEIGHT: 30px;BACKGROUND-IMAGE: url(http://jpe.ru/gif/skin/fon41.gif);FONT-WEIGHT:700;}
tr.font6 {HEIGHT: 28px;BACKGROUND-IMAGE: url(http://jpe.ru/gif/skin/fon31.gif);}

input,select,textarea{font-size:11px;font-family:Verdana;}
textarea{width:100%;height:120;}
input.sender{background-color:#ffffff;font-weight:700;border:1 outset rgb(0,0,0);}

</STYLE>
</HEAD>
<BODY bgColor=#e5e5e5>

<TABLE cellSpacing=1 cellPadding=10 width=100% height=100% border=0>
<TR bgColor=#F8FCF5><TD valign=top>


Спасибо: 0 
ПрофильЦитата Ответить
"Любовь как война - легко начать, трудно закончить и невозможно забыть" (с)




Сообщение: 77
Зарегистрирован: 03.05.10
Откуда: Russia
Репутация: 0
ссылка на сообщение  Отправлено: 06.05.10 12:36. Заголовок: так ты код а не ссы..


[Open] так ты код а не ссылку вставила?попробуй так
:
<HTML>
<HEAD>
<TITLE>Форум</TITLE>
<STYLE type=text/css>body{background-image:url(http://jpe.ru/1/big/060510/0tiwft9o7q.jpg);}
BODY{margin:10px;margin-top:15px;margin-bottom:10px;}
td{font-family:Verdana;}

.font1{font-size:12px;}
.font2{font-size:11px;font-weight:400;}
.font3{font-size:11px;font-weight:700;}
.font4{font-size:15px;}
.font5{font-size:11px;font-weight:700;COLOR:#ffa450;}
.font6{font-size:11px;font-weight:700;}

a:link{color:#006699;text-decoration:none;}
a:visited{color:#5493b4;text-decoration:none;}
a:hover{color: #dd6900;text-decoration:underline;}

tr.font3 {HEIGHT: 28px;BACKGROUND-IMAGE: url(http://jpe.ru/gif/skin/fon31.gif);}
tr.font5 {HEIGHT: 30px;BACKGROUND-IMAGE: url(http://jpe.ru/gif/skin/fon41.gif);FONT-WEIGHT:700;}
tr.font6 {HEIGHT: 28px;BACKGROUND-IMAGE: url(http://jpe.ru/gif/skin/fon31.gif);}

input,select,textarea{font-size:11px;font-family:Verdana;}
textarea{width:100%;height:120;}
input.sender{background-color:#ffffff;font-weight:700;border:1 outset rgb(0,0,0);}

</STYLE>
</HEAD>
<BODY bgColor=#e5e5e5>

<TABLE cellSpacing=1 cellPadding=10 width=100% height=100% border=0>
<TR bgColor=#F8FCF5><TD valign=top>

::[Life]:: Спасибо: 0 
ПрофильЦитата Ответить



Сообщение: 5
Зарегистрирован: 05.05.10
Репутация: 0
ссылка на сообщение  Отправлено: 06.05.10 12:52. Заголовок: спасибо. а как сдела..


спасибо.
а как сделать таблицу?
А то у меня вот так получилось:
http://roz.forum24.ru/

Спасибо: 0 
ПрофильЦитата Ответить





Сообщение: 21
Настроение: Супер-пупер!!!!!!!!!!!))))))))))))
Зарегистрирован: 04.05.10
Откуда: Россия, Крассноярск
Репутация: 0
ссылка на сообщение  Отправлено: 06.05.10 13:02. Заголовок: хочешь помогу?..


хочешь помогу?

я милая-красивая) Спасибо: 0 
ПрофильЦитата Ответить



Сообщение: 7
Зарегистрирован: 05.05.10
Репутация: 0
ссылка на сообщение  Отправлено: 07.05.10 15:09. Заголовок: Луна нет спасибо. Ты..


Луна нет спасибо. Ты мне очень помогла вот такой теперь
Скрытый текст


Спасибо: 0 
ПрофильЦитата Ответить
"Любовь как война - легко начать, трудно закончить и невозможно забыть" (с)




Сообщение: 103
Зарегистрирован: 03.05.10
Откуда: Russia
Репутация: 0
ссылка на сообщение  Отправлено: 07.05.10 15:24. Заголовок: а кому спасибо)?..


[Open] а кому спасибо)?

::[Life]:: Спасибо: 0 
ПрофильЦитата Ответить



Сообщение: 9
Зарегистрирован: 05.05.10
Репутация: 0
ссылка на сообщение  Отправлено: 07.05.10 15:39. Заголовок: тебе...


[GoGo] тебе.

Спасибо: 0 
ПрофильЦитата Ответить
"Любовь как война - легко начать, трудно закончить и невозможно забыть" (с)




Сообщение: 106
Зарегистрирован: 03.05.10
Откуда: Russia
Репутация: 1
ссылка на сообщение  Отправлено: 07.05.10 15:41. Заголовок: Пожалуиста!Всегда п..


[Open] Пожалуиста!Всегда пожалуиста!!!

::[Life]:: Спасибо: 0 
ПрофильЦитата Ответить
Ответ:
1 2 3 4 5 6 7 8 9
большой шрифт малый шрифт надстрочный подстрочный заголовок большой заголовок видео с youtube.com картинка из интернета картинка с компьютера ссылка файл с компьютера русская клавиатура транслитератор  цитата  кавычки моноширинный шрифт моноширинный шрифт горизонтальная линия отступ точка LI бегущая строка оффтопик свернутый текст

показывать это сообщение только модераторам
не делать ссылки активными
Имя, пароль:      зарегистрироваться    
Тему читают:
- участник сейчас на форуме
- участник вне форума
Все даты в формате GMT  3 час. Хитов сегодня: 0
Права: смайлы да, картинки да, шрифты да, голосования нет
аватары да, автозамена ссылок вкл, премодерация откл, правка нет



Форум: Mohito
Солнечный форум

Дизайн кнопок © Веб-студия "К-Дизайн"