Описание тега repeating-linear-gradient
4
ответа
Подберите градиенты двух делителей, если они имеют разную ширину
У меня есть 10 встроенных div, которые имеют один и тот же тип градиента - линии 45 градусов, но градиенты имеют разные цвета, а div имеют разную ширину. Можно ли подобрать градиент? (Надеюсь, что фото ниже объясняют это) Мой CSS для градиента. Толь…
07 янв '19 в 17:54
1
ответ
CSS3: "строки заметки" прыгают, когда текст длинный
Я хочу подражать "линии заметки", используя repeating-linear-gradient (или просто строка background-image, не важный): .box { width: 500px; line-height: 25px; } .box--gradient { background-image: repeating-linear-gradient(transparent, transparent 25…
15 янв '19 в 14:11
2
ответа
Манипулирование повторным линейным градиентом
Я хочу воссоздать шаблон линий, аналогичный веб-сайту бренда Uber: https://brand.uber.com/ в частности повторяющиеся линии, которые вы можете видеть на заднем плане: http://prntscr.com/etius6 чтобы сделать это, я подумал об использовании повторяющег…
07 апр '17 в 10:23
2
ответа
Исправление для зеркального диагонального фона
Я создал решение для зеркального диагонального фонового рисунка, но ошибка существует только в Firefox, где при определенной ширине экрана появляется вертикальная линия между левым и правым позиционируемыми элементами. У кого-нибудь есть решение или…
23 дек '18 в 21:15
1
ответ
Параметр цветовой остановки в линейном градиенте
У меня есть этот повторяющийся линейный градиент CSS дизайн. #div1{ background: repeating-linear-gradient(red, yellow 10%, green 20%); } Я знаю, что подразумевается под параметрами цвета, но процент сразу после цвета кажется расплывчатым. Для чего э…
29 июн '16 в 09:42
6
ответов
Как создать сплошную радугу с CSS?
Как создать следующий эффект радуги с помощью CSS? т. е. верхняя закругленная граница с остановками сплошного цвета радуги (без вставки HTML). Цвета: #c4e17f. #f7fdca, #fad071, #f0766b, #db9dbe, #c49cdf, #6599e2, #61c2e4, Что я уже пробовал: .contai…
27 фев '18 в 19:03
1
ответ
Как сохранить ширину линии на диагональной границе, используя повторяющийся линейный градиент?
Я пытаюсь использовать повторяющийся линейный градиент на границе, которая имеет 1px широкая линия с 6px расстояния между каждой строкой. Может кто-нибудь сказать мне, что я делаю не так, чтобы линии не были одинаковой ширины, когда они повторяются?…
22 май '16 в 19:26
1
ответ
Css background: смещение для повторяющегося линейного градиента
Я нарисовал сетку в качестве повторяющегося фона <div> следующим образом в SASS: background-image: repeating-linear-gradient(0deg, $major-grid-color, $major-grid-color $major-grid-weight, transparent $major-grid-weight, transparent $major-grid…
04 янв '18 в 17:57
0
ответов
CSS повторяющийся линейный градиент сломан в Safari 11?
Я только что обновил OSX до High Sierra и Safari до 11.01, и мой повторяющийся линейный градиент совершенно не в порядке. Это известная проблема с последней версией Safari? background: repeating-linear-gradient(-64deg, transparent, transparent 5px, …
08 фев '18 в 17:58
2
ответа
CSS квадратный фон - изображение
Я пытался создать квадратный фон, используя только CSS, но я получил только фон линии без опции горизонтальных линий. Это мой пример кода: CSS .container{ background-color:red; width: 400px; height:200px; margin:0 auto; background-image: linear-grad…
22 ноя '18 в 07:28
1
ответ
Анимированный CSS фоновый узор, скользящий бесконечно
Я пытаюсь создать анимированный повторяющийся узор (диагональные полосы скользят горизонтально) в качестве заполнителя для блока загрузки (li в этом случае). Как я могу сделать анимацию плавной / непрерывной, создавая иллюзию бесконечного скольжения…
27 фев '19 в 15:46
2
ответа
FontAwesome Полосатая звезда
Я пытаюсь создать полосатую звезду, используя font-awesome fa-star-o значок как показано ниже. Я использовал background-Gradient для создания этого эффекта, но вместо того, чтобы просто покрывать значок звезды, он покрывает все квадратное пространст…
09 июл '18 в 07:21
1
ответ
Почему Firefox не рендерит этот линейный градиент, когда значения размера фона превышают 255 пикселей?
Я пытаюсь создать наложение сетки, используя абсолютно позиционируемый невзаимодействующий элемент div. Я пытаюсь сделать это с помощью атрибута повторяющегося линейного градиента, как я видел в другом месте для этого решения. Реализация этой функци…
03 май '17 в 20:58
1
ответ
Можно ли установить изображение границы и фон с помощью свойства повторяющегося линейного градиента?
Я пытаюсь установить border-image а также background свойства как с repeating-linear-gradient вариант, но с разными значениями для одного и того же <div>элемент. Я не знаю, как это сделать, потому что с моей попытки кажется, что параметры град…
06 мар '20 в 14:12
2
ответа
Анимация фона в индикаторе выполнения (HTML5) Shadow DOM
Я пытаюсь оживить индикатор выполнения (HTML5 <progess>тег). Мне удалось стилизовать элементы Shadow DOM, но я не могу анимировать фон (повторяющийся линейный градиент). Он работает в Firefox, но не в Chrome и Edge. <ins>Под не работает,…
29 июл '20 в 15:16
0
ответов
как работает размер фона при работе с линейными градиентами?
body {margin: 0;background-size: 33.3% 33.3vw; background: repeating-linear-gradient( to right, #fd4e1e 0px, transparent 2px 33.3vw ), repeating-linear-gradient( to bottom, #fd4e1e 0px, transparent 2px 33.3vw );display: grid;grid-template-columns: r…
26 ноя '20 в 13:50
2
ответа
Как остановить повторяющийся линейный градиент в CSS?
Чтобы добавить в CSS, это можно сделать с помощью следующего кода. Это создаст красивый div-элемент с горизонтальными полосами. Однако проблема состоит в том, чтобы этот повторяющийся градиент останавливался / заканчивался на полпути через элемент. …
04 апр '21 в 17:48
1
ответ
Как сделать локальные прикрепленные повторяющиеся линейные градиенты
Недавно я пытался создать текстовую область, которая использует повторяющийся линейный градиент для разделения строк, однако градиент не прикрепляется к текстовому полю, когда я прокручиваю. Я делаю что-то неправильно? Кстати, вот код: Кроме того, в…
20 апр '21 в 10:38
0
ответов
CSS с повторяющимся линейным градиентом не показывает линии меньше 4 пикселей
Столкнувшись с этой странной проблемой в firefox / safari. Полосы линейного градиента менее 4 пикселей не видны. См. Снимок экрана и код: Вот код: background-image: -moz-repeating-linear-gradient( transparent 0, transparent calc(48.5 * 16px), /* Whi…
04 июл '21 в 12:24
1
ответ
Как использовать повторяющийся градиент вместо linear-gradient
У меня здесь есть код линейного градиента. https://jsfiddle.net/0qfy3ks2/ Как бы я мог использовать повторяющийся градиент вместо этого? Итак, изображение то же самое, только вместо этого используется повторяющийся градиент. background-image: repeat…
04 дек '21 в 03:58