CSS3弯曲的背景CSS或背景图片(无响应的网站)? [英] CSS3 Curved backgrounds css or background image for non responsive website?

问题描述

有人要求我从设计中使用css/html创建页面.

I have been asked to create a page with css / html from a design.

主要背景是弯曲的，有2种颜色.

The main background is curved and has 2 colors.

我不知道执行此设计的最佳/最快方法是...使用背景图片或使用CSS3弯曲图片.

I don't know what the best / fastest way to go around this design is...background image or curved the image with css3.

这是设计bg图片...进行此设计的最佳方法是什么?

Here is the design bg image ... what's the best way to go around this design?

推荐答案

带有容器演示中内容的简单纯CSS圆形背景:

Simple pure CSS rounded background with content in a container demo:

http://codepen.io/serkai/pen/JdaYjX

此处已编译CSS的示例:

Example compiled CSS here:

.bg-border-radius {
  margin: -400px auto 0;
  width: 1000px;
  height: 800px;
  overflow: hidden;
  border-radius: 0 0 70% 70%;
  background-color: #0080C1;
}

这篇关于CSS3弯曲的背景CSS或背景图片(无响应的网站)?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！