| Версия для печати темы
Нажмите сюда для просмотра этой темы в оригинальном формате |
| Форум программистов > Вёрстка веб-сайтов > Радиальный градиент как фон |
| Автор: XAKEPEHOK 13.12.2009, 02:21 | ||
| Доброго времени суток! Мне необходимо реализовать фон страницы в виде радиального градиента. Если на фон ставить маленькую картинку и просто растягивать ее, то пикселезация становится хоть и не сильно, но заметной. Делал по средствам svg, пример брал здесь http://dimonblog.ru/verstka/sozdanie-gradienta-s-pomoshhyu-svg/ Напрягает то, что только Opera позволяет вставлять SVG-графику c помощью тега IMG Можно вставлять при помощи
(свой svg прикладываю) Но как таким образом тогда сделать фон страницы? Или есть другие варианты реализации радиального градиента? |
| Автор: comcon1 13.12.2009, 14:23 |
| ну как, помещаешь все тело документа в один див, делаешь ему {position: absolute; top: 0;}, а свг на другой, ему делаешь {position: fixed; top: 0; left: 0; width: 100%; height: 100%;}. Кладешь один под другой и ок. Поскольку див с фоном нужно поставить fixed (иначе я не знаю как радиальный градиент повторять), то для осла нужно скачать эмулятор fixed. Только смотри - многие эмуляции fixed дают "рваный" эффект при скроллинге. |
| Автор: XAKEPEHOK 13.12.2009, 14:30 |
| В общем как я понял универсального кроссбраузерного решения с svg нет. Спасибо. |
| Автор: blah 13.12.2009, 15:56 |
| Кроссбраузерного решения для svg не может может существовать в принципе, т.к. для ie все придется реализовывать на vml. И position:fixed; здесь уже не есть проблемой. |
| Автор: bazel 11.2.2010, 12:28 |
| Статья на эту тему - http://w3pro.ru/article/ispolzovanie-svg-dlya-sozdaniya-krasivogo-masshtabiruemogo-fona-chast-1. По поводу браузеров и вообще доступности и кроссбраузерности такого подхода. |