Подтвердить что ты не робот

Горизонтальные градиенты CSS?

Я хочу иметь градиент в качестве фона моей веб-страницы. Я понял, как сделать вертикальный градиент, но я хочу, чтобы он был горизонтальным.

background-image: -webkit-gradient(linear, 0% 25%, 0% 0%, from(rgb(176, 196, 222)), to(rgb(255, 255, 255)));
background-image: -moz-linear-gradient(center bottom, rgb(153, 255, 51) 25%, rgb(255, 102, 51) 80%);
4b9b3361

Ответ 1

Для -webkit-gradient вы определяете направление, используя две точки (2-й и 3-й аргументы в вашем случае), а для -moz-linear-gradient определяется только начальной точкой (первый аргумент). Чтобы превратить эти градиенты в горизонтальные, выполните следующие действия:

background-image: -webkit-gradient(linear, 25% 0%, 0% 0%, from(rgb(176, 196, 222)), to(rgb(255, 255, 255)));
background-image: -moz-linear-gradient(center right, rgb(153, 255, 51) 25%, rgb(255, 102, 51) 80%);

(Возможно, вам придется настроить свои значения цвета, потому что вы определяете точки по-разному для каждого браузера. Это может быть проще, если вы установите точки на center right, center left для Webkit, а также для соответствия Mozilla.)