Как применить несколько радиальных градиентов CSS к одному элементу
У меня есть следующий стиль, примененный к моемуdiv
элемент:
background-image: -moz-radial-gradient(50% -10%, ellipse closest-corner, rgba(5, 5, 5, 0.7), rgba(0, 0, 0, 0) 100%);
Это имеет желаемый эффект (будучи внутренней тенью только на вершинеdiv
). Я хотел бы применить тот же эффект в нижней частиdiv
, Следующая строка делает это хорошо, но кажется, что она перекрывает первую, поэтому я могу получить только одну или другую.
background-image: -moz-radial-gradient(50% 110%, ellipse closest-corner, rgba(5, 5, 5, 0.7), rgba(0, 0, 0, 0) 100%);
Может кто-нибудь показать мне, как я могу иметь несколько фонов с радиальным градиентом на элемент? Я заметил, что webkit может сделать это легко, но я ищу кросс-браузерную реализацию / альтернативу.
Спасибо