Question about a specific gradient with css3

2019-09-14 13:19发布

I am not sure how to exactly phrase this question so maybe that's why I can't find help with this.

I am coding a webpage and the designer has made a background for a part of it. It's sort of a two way gradient: both horizontal and vertical at the same time. I am attaching the image here because I'm not sure how to explain it.

I'm sorry if it's very obvious but I can't find anything resembling this anywhere. Thank you! Here's the image: two-way gradient

EDIT: The question is, can I make this background using just CSS3? Thanks!

1条回答
趁早两清
2楼-- · 2019-09-14 13:53

Are you able to limit browser support to browsers that support multiple backgrounds?

If so, you can create two gradients, along with a border, to simulate that.

Here's a version that only works in Firefox: http://pastehtml.com/view/b295elnso.html

You can modify the webkit and other lines to get it working in other browsers. I used the Ultimate CSS Gradient Generator to build the lower gradient.

Here's a good listing of multiple background support.

(Edit: I meant only works in Firefox, not IE. Doh!) *(Edit2: Added multiple background support listing)*

查看更多
登录 后发表回答