Перейти к содержимому
Русский язык для Invision Community 5

Как сделать фон - Градиент

И снова я :) Не могу задать несколько вопросов в одной теме, вот создаю разные. У меня еще один вопрос к вам господа Знатоки ) :

Как сделать фон градиент, у меня на сайте есть фоновое изображение вверху и внизу, я хочу запихнуть под них переходящий градиент, вот пример:

post-44902-0-57805000-1303885980_thumb.jpg

вот сам сайт: www.creativestation.ru (прошу извенить, если нельзя выкладывать ссылки, если нарушаю правила - просто удалите мою ссылку)

Рекомендованные сообщения

Да все точно также, как другие.

Просто накладываете слои, этот – внизу. Если изображения сверху прозрачные, сработает.

 

Ps

Лучше сделайте полупрозрачный светлый фон под рабочей областью форума.

Иначе эти картинки только ухудшают юзабилити.

  • Автор

Ps

Лучше сделайте полупрозрачный светлый фон под рабочей областью форума.

Иначе эти картинки только ухудшают юзабилити.

А как? :) я ещё пока чайник в этом деле, учусь. По поводу градиента, если я сделаю его изображением то оно будет весить много. Мне нужно сделать так что бы оно было под двумя изображениями - небом и травой. Я знаю можно сделать что-то типа полосы - 1-2 пикселя и движек будет её дублировать по ширине.

Fisana - спасибо за советы!

Как раз градиент не будет весить много.

Делаете тонкую полоску (весом несколько байт)

Ее даже можно привязать к html

В css добавить

.html {
background: #голубой Цвет, куда градиент переходит url({style_images_url}/grad_bg.png) 0 100% repeat-x;
}

Но верхние картинки должны быть прозрачными.

  • Автор

Как раз градиент не будет весить много.

Делаете тонкую полоску (весом несколько байт)

Ее даже можно привязать к html

В css добавить

.html {
background: #голубой Цвет, куда градиент переходит url({style_images_url}/grad_bg.png) 0 100% repeat-x;
}

Но верхние картинки должны быть прозрачными.

Блин, не получается :( . Вот мои коды для фона

______________________________________________________

 

body {
background: #9bcced url({style_images_url}/body_bg.jpg) no-repeat top center;
color: #05335b;
font: normal 12.5px tahoma, arial, verdana, sans-serif;
position: relative;
}


#end_ipbwrapper {
       background:transparent url({style_images_url}/back_bottom.jpg) center bottom no-repeat;
            }


#ipbwrapper {      
margin: 0px auto 0px auto;  
text-align: left;
       padding: 0;  
width: 1003px; /* skin size choice 100% and between fixed skin*/
position: relative;


}

_______________________________________________________________

 

, можете вписать в них. Пробовал делать, то получается белый фон, то полоска не на весь экран.

 

Вот сама полоска

post-44902-0-59580900-1303947661_thumb.png

Изменено пользователем Fisana

Ну я не могу пробовать это у себя. Негде и времени нет.

 

Кроме того, у Вас в коде параметров для css3 нет, а на форуме явно используются.

Я о background-size

И параметров прозрачности тоже не вижу. Если градиент за - как он может быть виден сквозь непрозрачный jpg?

 

Не понимаю почему. Скрипт какой-то?

Если так, то он может влиять и на масштабирование градиента, добавляя параметры, вроде растягивания на весь экран, когда это не нужно.

Создайте аккаунт или войдите в него для комментирования

Аккаунт

Навигация

Поиск

Поиск

Настроить push-уведомления браузера

Chrome (Android)
  1. Нажмите на иконку замка рядом с адресной строкой.
  2. Нажмите Права доступа -> Уведомления.
  3. Измените свои настройки.
Chrome (компьютер)
  1. Нажмите на иконку замка в адресной строке.
  2. Выберите Настройки сайта.
  3. Найдите Уведомления и измените свои настройки.