Форум программистов
 

Восстановите пароль или Зарегистрируйтесь на форуме, о проблемах и с заказом рекламы пишите сюда - alarforum@yandex.ru, проверяйте папку спам!

Вернуться   Форум программистов > Web программирование > HTML и CSS
Регистрация

Восстановить пароль
Повторная активизация e-mail

Купить рекламу на форуме - 42 тыс руб за месяц

Ответ
 
Опции темы Поиск в этой теме
Старый 17.04.2012, 19:27   #1
hopeman
 
Регистрация: 17.04.2012
Сообщений: 4
По умолчанию CSS Как сделать двусторонний градиент-фон

Привет. Есть вопрос. Не могу понять, как написать вот такой бэкграунд посредством css.
http://s019.radikal.ru/i627/1204/4c/776883106b51.jpg
То, что белое, это контейнер шириной 950 пикселей.
Как сделать фон-градиент, такой же, как на рисунке?

Вот пример, извиняюсь за как бы рекламу:
http://www.gametrailers.com/
Хочу такой же для своего сайта, с помощью css, чтобы края не обрезало и градиент был полностью виден и на 16-9 и на 16-10 и на экзотике.

Последний раз редактировалось hopeman; 18.04.2012 в 01:06.
hopeman вне форума Ответить с цитированием
Старый 18.04.2012, 08:27   #2
Kotofff
Участник клуба
 
Аватар для Kotofff
 
Регистрация: 11.01.2009
Сообщений: 1,917
По умолчанию

В Вашем примере все тривиальнее чем кажется.
PHP код:
body {
margin0;
text-aligncenter;
background#C2C4C6 url(/images/gt6background.gif) repeat-y scroll center;

Границы слева и справа у картинки gt6background.gif имеют цвет совпадающий с заданным в параметре background`а #C2C4C6.
Все. Границ не видно. Эффект достигнут.
Вложения
Тип файла: zip Сама_картинка_для_рассмотрения.zip (2.4 Кб, 13 просмотров)
"Заряженному танку в дуло не смотрят" @Dekmer in WoT
Kotofff вне форума Ответить с цитированием
Старый 19.04.2012, 13:03   #3
Виталий Желтяков
Старожил
 
Аватар для Виталий Желтяков
 
Регистрация: 19.04.2010
Сообщений: 2,702
По умолчанию

Сейчас это делается при помощи box-shadow
Виталий Желтяков вне форума Ответить с цитированием
Старый 19.04.2012, 22:20   #4
hopeman
 
Регистрация: 17.04.2012
Сообщений: 4
По умолчанию

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

Только что на мониторах 18:9, 16:9 и 16:10 картинка по-разному выглядеть будет. Сделаю под 16:9, это самый популярный формат на сегодняшний день.

Последний раз редактировалось hopeman; 19.04.2012 в 22:25.
hopeman вне форума Ответить с цитированием
Старый 19.04.2012, 22:44   #5
Naive
Раздолбайских Дел
Старожил
 
Аватар для Naive
 
Регистрация: 22.05.2009
Сообщений: 3,828
По умолчанию

Цитата:
Сообщение от hopeman Посмотреть сообщение
Только что на мониторах 18:9, 16:9 и 16:10 картинка по-разному выглядеть будет. Сделаю под 16:9, это самый популярный формат на сегодняшний день.
фак мой моск
Alar, верни репу!
Naive вне форума Ответить с цитированием
Старый 20.04.2012, 02:21   #6
hopeman
 
Регистрация: 17.04.2012
Сообщений: 4
По умолчанию

Naive
Ты тем что я описал, занимался?
hopeman вне форума Ответить с цитированием
Старый 25.04.2012, 10:48   #7
akutinrom
Пользователь
 
Регистрация: 11.02.2012
Сообщений: 22
По умолчанию

http://htmlbook.ru/css3-na-primerakh/lineinyi-gradient Линейный градиет
akutinrom вне форума Ответить с цитированием
Ответ


Купить рекламу на форуме - 42 тыс руб за месяц



Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Как сделать такой фон Igll HTML и CSS 2 12.04.2012 12:30
Как сделать фон спрайта прозрачным? Sylvos Visual C++ 6 24.03.2012 01:17
Градиент на CSS bulat786 HTML и CSS 2 13.11.2011 19:56
Как расятнуть фон на стрнице? (css) Сергей1317 HTML и CSS 2 18.09.2010 18:43
Фон: ГРАДИЕНТ PAVEL315 HTML и CSS 2 13.03.2007 17:58