Форум программистов [Powered by Invision Power Board]

Версия для печати темы
Нажмите сюда для просмотра этой темы в оригинальном формате

Форум программистов > Вёрстка веб-сайтов > Возможен ли градиент при помощи CSS без картинки?

Автор: Win MK 32 26.5.2009, 00:52

Если нет, то что лучше тоненькая повторяющаяся полоска(картика) или JS?

Автор: FortMax 26.5.2009, 03:01

возможен при использовании CSS-фильтров, можно посмотреть http://www.ruled.ru/filter-css.html
например:

Код


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<html>
<head>
    <title>Untitled</title>
    <style type="text/css">

    div{
      width:300px;
      height:300px;
      filter:progid:DXImageTransform.Microsoft.Gradient(gradientType=0,
       startColorStr=#ff0000, endColorStr=#0000ff);
   } 

    </style>
</head>

<body>
<div>
Hello World!
</div>
</body>
</html>

Автор: bars80080 26.5.2009, 09:57

Цитата(FortMax @ 26.5.2009, 03:01

)

filter:progid:DXImageTransform.Microsoft.Gradient(gradientType=0,
startColorStr=#ff0000, endColorStr=#0000ff);

уже по слову microsoft можно догадаться о работоспособности этого примера

полоска лучше: просто и сердито

Автор: Win MK 32 26.5.2009, 15:08

Тоже так подумал smile

Всем спасибо. Буду смотреть в сторону *.gif и CSS.

Автор: Soah 26.5.2009, 15:13

http://forum.vingrad.ru/index.php?showtopic=251909&view=findpost&p=1817193

?

Автор: Win MK 32 26.5.2009, 15:28

Soah, спасибо, посмотрю, в похожих темах не видел ссылку, надеюсь кросбразерно.

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

Добавлено через 1 минуту и 19 секунд
Или наоборот градиент-картинка-полоска будет настолько длинная, что все увидят только треть спектра градиента.

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

Добавлено через 2 минуты и 11 секунд
А если и жить с таким недостатками, то следовательно градиент можно использовать только для маленьких и отдельных блоков, ни в коем случае не как фон для страницы. (я не спец, просто рассуждения на тему)

Автор: Soah 26.5.2009, 15:37

Win MK 32, какие картинки?

Вы заголовок читали?
http://slayeroffice.com/code/gradient/

Автор: Win MK 32 26.5.2009, 16:24

Soah, это я не вам конкретно, а всем. Просто рассуждения.