Приветствую Вас Прохожий | RSS Понедельник, 28.09.2020, 05:10
(Cайты из ТОП 100 | сайт: http://infoter.ru InfoTer - все для ucoz. дле, фотошопа, и куча софт...) [ Новые сообщения · Участники · Общие Правила форума · Поиск · RSS ]
  • Страница 1 из 1
  • 1
Форум » Поддержка по uCoz » Веб-мастеру информация, скрипты » Как сменить или изменить фон сайта на ucoz ? (полная инструкция)
Как сменить или изменить фон сайта на ucoz ?
mdbaner Дата: Четверг, 04.06.2009, 20:15 | Сообщение # 1

Президент
Министр
Академик
Доктор
Кандидат
Аспирант
Магистр
Бакалавр
Абитуриент
Школьник
Звание: Министр
Группа: V.I.P персона
Сообщений: 4723
Награды: 309
Репутация: 3747
Замечания: 0%
На форуме одним из популярных вопросов, который мне задают, это вопрос о том, как поменять фон на сайте. Это первое, что часто хотят сделать при создании сайта новички. Именно для Вас, новичков, я и предлагаю это статью. Постараюсь рассмотреть все возможные случаи и рассказать о них на понятном языке.
Итак, давайте по порядку. Первое, о чем Вам нужно задуматься, если Вы решили поменять фон, это то, как он должен себя вести при разных расширениях монитора. Большинство новичков об этом совершенно забывают. А ведь мониторы у всех разные, поэтому это обязательно надо иметь в виду. Давайте разберемся, какие варианты возможны:
1. Вы задаете фон просто цветом. Этот вариант легко реализовать. Он не будет долго грузиться и будет одинаково выглядеть абсолютно на всех мониторах и браузерах. Но многим хочется красоты. Поэтому идем дальше
2. Можно задать фон из картинки, которая может повторяться по вертикали или по горизонтали, или по обоим направлениям. Как пример, вот картинка фона шапки на этом сайте

Хотите поставить картинку, например, какой-то пейзаж. То тут возможны 3 варианта
3.1. Можно сделать картинку под самый маленький монитор (обычно это 1024px) и разместить этот фон по центру , плюс задать цвет фона, который будет заполнять свободное место там, где не будет картинки при более больших размерах монитора.
3.2. Можно сделать картинку автоматически масштабируемую под размеры монитора, но это работает не во всех браузерах, например, не работает в Internet Explorer. Поэтому такой вариант подойдет очень немногим.
3.3. Последний вариант - это скорее дополнительный момент к 2 предыдущим: фон может заполнять все пространство страницы, а может совпадать с размером монитора и при прокручивании страницы оставаться неподвижным.
Вот, в общем-то, и все варианты. Если определились, давайте начнем.
Фон страницы обычно задается в теге
Code
<body>

с помощью свойства
Code
background.

Возможны два варианта:
1. свойство может быть задано прямо в шаблоне страницы
2. свойство может быть прописано в таблице CSS
Причем, если свойство прописано и там, и там, то сработает то, что написано в шаблоне.
Если свойство прописано в шаблоне, то выглядит оно примерно так:
Code
<body style="background: #FcFcFc;">

свойств внутри может быть гораздо больше, они перечисляются через запятую, но нас интересует только свойство background
если оно прописано в таблице css, то в шаблоне будет просто
Code
<body>

а в таблице css примерно так:
Code
body {background: #FcFcFc;}

В чем тут принципиальное отличие? В том, что если у Вас первый вариант , изменения придется производить во всех используемых шаблонах: шаблоне каталога статей, шаблоне модуля новостей и так далее. Тут Вам будет полезна функция Быстрая замена участков кода. Вам необходимо будет сначала настроить код в шаблоне страницы сайта. А потом зайти в Меню - Дизайн -Быстрая замена участков шаблона - Что заменить - вставляете код
Code
<body .......>

, какой он остался в изначальных шаблонах , На что заменить: - новый код . Тогда замена будет проведена во всех шаблонах. Другой вариант. Сразу заменить изначальный код на просто
Code
<body>

, и тогда уже все изменения надо будет делать только в таблице css (вариант 2)
Итак, с основными моментами разобрались. А теперь разберем и все свойства. Я буду приводить примеры кода, которые соответственно Вы сможете внедрить следующим образом:
- в шаблоне страницы
Code
<body style="пример кода">
- в таблице CSS
body {пример кода}

1. Задаем фон прост цветом
Code
background: #FcFcFc;

цвета очень хорошо можно подобрать здесь : Подбор цвета
2. Задаем фон картинкой
Code
background: url('адрес картинки');

задаем фон картинкой, которая не будет повторяться
Code
background: url('адрес картинки') no-repeat;

3. Задаем фон картинкой, которая будет повторяться по горизонтали
Code
background: url('адрес картинки') repeat-x;

4. Задаем фон картинкой, которая будет повторяться по вертикали
Code
background: url('адрес картинки') repeat-y;

5. Задаем фон картинкой, которая будет повторяться и по горизонтали, и по вертикали
Code
background: url('адрес картинки') repeat;

6. Задаем фон картинкой, которая будет по центру горизонтали и по верху по вертикали
Code
background: url('адрес картинки') 50% 0%;

7. Задаем фон картинкой, которая будет по центру горизонтали и по верху по вертикали , плюс цвет, там, где картинки не будет
Code
background:#fcfcfc url('адрес картинки') 50% 0%;

8. Задаем фон картинкой, которая не будет прокручиваться при прокручивании страницы
Code
background:#fcfcfc url('адрес картинки') 50% 0%;background-attachment: fixed;

9. Задаем фон картинкой, которая будет масштабироваться
Code
background: url('адрес картинки');background-size:100%;


Подпись пользователя mdbaner1 Права групп и возможности пользователей
2 Общие правила форума которые нужно знать всем
3 Пожаловаться на Администратора или Модератора тут
4 Задать вопрос в Support сайта Ucozon
5 Ответы на постоянные вопросы в модуле FAQ
6 Цены и виды моих услуг по дизайну и настройке


Больше всего меня вырубает когда пользователь просит меня что либо найти, указывая на то что не умеет пользоваться поиском
 
Форум » Поддержка по uCoz » Веб-мастеру информация, скрипты » Как сменить или изменить фон сайта на ucoz ? (полная инструкция)
  • Страница 1 из 1
  • 1
Поиск:

Статистика Форума
Новые пользователи Последние темы Лучшие пользователи

1 terpsider (DV)

UA11:15 - 13.09.2020

2 Wlam (Мар'ян)

UA09:07 - 04.09.2020

3 darankos4 (darankos4)

KZ09:12 - 29.08.2020

4 welaso (Welaso)

US01:23 - 27.08.2020

5 aveti5 (Alex)

RU13:42 - 15.08.2020

6 suzongann (Анна)

UA17:35 - 21.07.2020

7 RuslaNNN (Руслан)

UA20:39 - 14.07.2020

8 black1701 (Юрий)

RU20:42 - 12.07.2020

9 batya-m (Батильд)

RU18:45 - 12.07.2020

10 t565465 (ewrwerew)

FR16:17 - 10.07.2020

11 vlad325 (vlad325)

RU11:53 - 08.07.2020

12 derca (Vjatseslav)

EE03:25 - 07.07.2020

13 lunicka (Любовь)

RU12:25 - 06.07.2020

14 259588919 (Александр)

BY13:04 - 05.07.2020

15 serjoshta (Дмитрий)

RU13:14 - 26.06.2020

16 ppavel (Павел)

RU10:53 - 18.06.2020

17 aom1ne (aomine666)

EE10:32 - 18.06.2020

18 flakebeat (FlakeBeatz)

RU21:21 - 16.06.2020

19 LisWKK (Дмитрий)

RU19:27 - 09.06.2020

20 fekla2020 (ольга)

NO17:32 - 29.05.2020

21 webbbsock (andrew)

RU08:27 - 28.05.2020

22 Mogila27 (Артем)

FR22:52 - 09.05.2020

23 Adil92 (Адилбек)

KZ21:19 - 04.05.2020

24 jue_fej (jue_fej)

UA23:40 - 01.05.2020

25 Televik (Alexandr)

RU10:09 - 26.04.2020

26 Born684 (HitFM)

MD12:25 - 20.04.2020

27 s3rg1o (Сергей)

RU12:02 - 20.04.2020

28 nooqwee (Alexander)

RU01:14 - 20.04.2020

29 Wo1teK (Oleg)

UA21:23 - 18.04.2020

30 DAV (Davit)

AM22:02 - 06.04.2020

1 Комплексный прогон сайтов ру и...

kysovue kysovue [53]

2 Ручной прогон по трастовым сай...

kalip27 kalip27 [19]

3 бот для умножения денег на фор...

forexmone forexmone [0]

4 Программировние

forexmone Playmanovich [7]

5 Пропала реклама

forexmone frolov1028 [3]

6 Может у кого есть!

forexmone Vistel [4]

7 У сайта вырос ТИЦ

Openair Vistel [8]

8 Нужны дизайнеры

Openair demons063 [2]

9 ⭐️Ручной статейный прогон⭐️

eternalli eternalli [0]

10 Работа на заводе

eternalli Vikrumas [18]

11 Как раскрутить кино сайт

eternalli JAko [6]

12 [100p] Нарисовать логотип.

XAMEJIUOH XAMEJIUOH [0]

13 Требуется человек для создания...

Vikrumas Vikrumas [0]

14 Качественный рерайт/копирайт о...

GaV GaV [161]

15 Календарь

frolov1028 Vikrumas [1]

16 Профильно-статейны прогон по с...

GaV GaV [0]

17 Файловик на сайт (копипаст) оп...

MDNdemon MDNdemon [58]

18 Изображение в CSS

xbalson GaV [2]

19 Файловый Менеджер - Высокая оп...

Freemekc Freemekc [2]

20 В каких интернет магазинах вы ...

Beowb428 GaV [9]

21 Скрипт и инструкция добавления...

DianaLebe мир [3]

22 Трафик на сайт по низким ценам...

brig2 vir4us [4]

23 Продам билеты в московский кин...

brig2 MDNdemon [1]

24 Создать лого на сайт

korel korel [0]

25 Раздача подарков и стикеров в ...

MDNdemon MDNdemon [0]

26 25 жирных ссылок. Яндекс Катал...

NikeNikol NikeNikol [0]

27 выровнять вид материалов

GaV frolov1028 [1]

28 Продам муз сайт

GaV mixmix [2]

29 прошу вас помогите

ilyaclash geomario [1]

30 Продам базу трастовых сайтов с...

NikeNikol NikeNikol [0]

1 frolov1028

UAРепа: 4431 Файлов: 29 Форум: 1317

2 Кирилл

RUРепа: 4292 Файлов: 15 Форум: 3818

3 мир

MDРепа: 4084 Файлов: 878 Форум: 1019

4 WinDiZ

Репа: 3943 Файлов: 2 Форум: 1252

5 mdbaner

MDРепа: 3747 Файлов: 713 Форум: 4723

6 GaV

RUРепа: 3621 Файлов: 0 Форум: 1262

7 Kapusha

RUРепа: 3341 Файлов: 35 Форум: 1177

8 PrADeN

FRРепа: 3318 Файлов: 84 Форум: 2076

9 martinis

RUРепа: 3247 Файлов: 46 Форум: 444

10 German

RUРепа: 2738 Файлов: 18 Форум: 258

11 STAFF

USРепа: 2720 Файлов: 72 Форум: 757

12 ALINA

RUРепа: 2677 Файлов: 277 Форум: 9

13 StraJ

UAРепа: 2243 Файлов: 12 Форум: 545

14 smart4on

BYРепа: 2232 Файлов: 4 Форум: 661

15 makcim19997

RUРепа: 2204 Файлов: 171 Форум: 1067

16 GaMeRgame

RUРепа: 2082 Файлов: 4 Форум: 722

17 TRANE73

RUРепа: 2015 Файлов: 34 Форум: 165

18 ivanfom

RUРепа: 1887 Файлов: 15 Форум: 319

19 Zhenikuls

RUРепа: 1884 Файлов: 6 Форум: 65

20 tmb

RUРепа: 1570 Файлов: 0 Форум: 214

21 xbalson

MDРепа: 1378 Файлов: 4 Форум: 561

22 Smile

RUРепа: 1311 Файлов: 23 Форум: 444

23 hjp^

RUРепа: 1248 Файлов: 14 Форум: 192

24 domovik21

UAРепа: 1237 Файлов: 16 Форум: 177

25 Prix

RUРепа: 1122 Файлов: 6 Форум: 91

26 LEO--MESSI

RUРепа: 1115 Файлов: 6 Форум: 468

27 Playmanovich

UAРепа: 1087 Файлов: 3 Форум: 981

28 WmMariupol

UAРепа: 1081 Файлов: 0 Форум: 55

29 K@rDeL

RUРепа: 1076 Файлов: 0 Форум: 382

30 LUIS75

RUРепа: 1033 Файлов: 1 Форум: 198

Избранные ссылки
5 последних закладок Описание и использование закладок
Закладки создаются при помощи "куков" которые хранятся в вашем браузере 30 дней, если жи вы почистили куки в своем браузере то закладки исчезнут.
отображаются только 5 последних закладок, предыдущие удаляются по мере обновления списка.
Вы можете любую не нужную закладку удалить нажатием X на против ссылки.
Бывает что запись кука пролетает, но это уже ошибки браузера и его записей.
Если при обновление страницы выводится ошибка 400 то что бы исправить необходимо удалить все куки браузера
Если вы заметили ошибки то сообщайте администратору.


Copyright UcozOn.ru™ © 2008-2020


Кнопка 88х31 сайта ucozon.ru