Вот разметка SVG для Круг выше (ОК, не самый чистый способ кодировать круг, но содержание может быть чем угодно): < /p>
Код: Выделить всё
.st0 {
fill: #6887b5;
}
.st1 {
fill: #b2b2b2;
}
< /code>
И вот SVG радиального градиента: < /p>
.st0 {
fill: url(#radial-gradient);
}
Вы можете сказать: «Просто сделайте внутреннюю внутреннюю часть кругов прозрачными и добавьте полноэкранный градиент в качестве другого фона, сложенного за кругом фона». И это было бы хорошо в некоторых случаях. Но если вы заметили, фон круга уже имеет прозрачность - вокруг кругов.
Я подозреваю, что ответ будет: это можно сделать с помощью css, но не внешний css. Но, пожалуйста ... заполните меня. Этот метод не будет жизнеспособным решением, по крайней мере, не в его нынешнем состоянии. Я включу код, который я использовал. Но вот HTML: < /p>
SVG - Tile + Full Screen Gradient Test
body.svg-bg {
background-image: url(tile-and-full-02.svg);
background-position: center;
background-repeat: repeat;
}
< /code>
А вот Svg: < /p>
< /code>
Вот снимок экрана результата, чтобы сэкономить время для всех: < /p>
Они визуализируют как кластеры плитки, в других Слова плитки сгруппированных плиток.
возможна ли плитка и подключение/маскировка? Кажется, все расчеты обрезки выполняются до расчета плитки. Это заставляет меня думать, что могут потребоваться несколько слоистых DOV. Может быть, обрезка с CSS - это маршрут для изучения? (Здесь тоже не уверен, возможна ли плитка и обрезка.) Я также экспериментировал с фетилем, но пока не повезло.
Подробнее здесь: https://stackoverflow.com/questions/793 ... hat-doesnt
