Css 如何在html元素上实现水平和垂直渐变

有人能告诉我如何使用css中的任何mozilla渐变属性实现html div元素的顶部、底部和右侧的渐变吗？

---

如果我使用-moz linear gradient属性进行垂直渐变，我将错过要应用于div元素右侧的渐变。

我不能100%确定这是您想要的，但您可以在目标div元素中嵌套一个div元素，在其中一个元素中设置水平渐变，在另一个元素中设置垂直渐变。然后，将嵌套div元素的不透明度更改为50%

---

编辑：边缘有点粗糙，但这在Firefox中有效。请注意，不能将子元素的不透明度更改为高于父元素不透明度的值。儿童混浊是相对的，而不是绝对的

多亏了CSS3，这是可能的。只需将垂直和水平渐变放在同一行上，用逗号分隔

例如，要创建这个漂亮的背景 我正在使用以下代码：

background: linear-gradient(to bottom, #80d0b9 0%,#80d0b9 30px,#e7f3f3 30px,#e7f3f3 100%) no-repeat top left,
            linear-gradient(to right,  #c2ebec 0%,#c2ebec 30px,#e7f3f3 30px,#e7f3f3 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
background-size: 30px 100%;

---

你想要在一个分区中使用两个渐变吗？+1：我不在乎这是否是OP想要的，效果很好：）