#webkit #css #linear-gradients
#webkit #css #линейные градиенты
Вопрос:
Я создал этот фон в firefox, но я не могу воспроизвести его в webkit / chrome (я пробовал несколько альтернатив, но ничего):
background: -moz-repeating-linear-gradient(0deg, gray, transparent 1px, transparent 5px) repeat scroll 0 0 white;
Каким был бы правильный перевод? Возможно ли добиться того же шаблона? (или, по крайней мере, очень близкий к нему).
Спасибо!
Ответ №1:
О! Это было в документации! :
http://www.webkit.org/blog/175/introducing-css-gradients/
Если вы хотите добиться таких эффектов, как разбиение вертикального градиента на плитки с использованием узкой полосы, вам следует указать background-size, чтобы придать плитке градиента явный размер.
Итак, было исправлено добавление:
background-size: 10px;
Gecko и Webkit действуют в этом вопросе по-разному: в то время как Gecko автоматически отрегулирует размер фона, если вы укажете шаги градиента в «px», webkit (возможно) вычислит% на основе заданного вами показателя «px».
Я не уверен, что мой английский правильный, но идея в этом…
Ответ №2:
-webkit-repeating-greadient(...) 🙂
Поддерживается Chrome и Webkit nightlies.
Комментарии:
1.
left top 0degнеправильный угол, он был удален из спецификации (я думаю, для упрощения синтаксического анализа). Вам нужно выбрать одно из двух, либоleft top, либо0deg. Я предполагаю, что вы действительно хотитеtopили0deg(они эквивалентны).2. ДА… По какой-то причине я закончил тем, что смешал его… Я исправлю это. Спасибо, что указали на это и попытались помочь в первую очередь.