html - CSS div 椭圆形

标签 html css

oval shape example image

谁能帮我从div中剪出这样的一个?

找到了可能的解决方案,但不了解 SVG。也许有人可以帮助我。

HTML:

 <svg viewBox="0 0 400 150">
 <path opacity="0.6" fill="red" d="M0,10 Q0,0 10,0 Q195,40 390,0 Q400,0 400,10 Q390,75 400,140 Q400,150 390,150 Q195,100 10,150 Q0,150 0,140 Q10,75       0,10" />
 </svg>

CSS:

svg {
  position: relative;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

最佳答案

body {
    overflow-x: hidden
}

svg {
    left: 47%;
    position: relative;
    top: -24%;
    transform: translate(-50%, -50%);
    width: 2000px;
}

关于html - CSS div 椭圆形,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41053044/

相关文章:

css - 手机上的文字比笔记本电脑上的小

javascript - 了解 Angular Material gridList

css - 从 Outlook 发送电子邮件模板时如何删除 Gmail 中的超链接下划线

javascript - 将 onclick 事件添加到 jquery 中的单选按钮

javascript - 为什么没有获取字符串的值?

html - 给 iframe 一个边框半径

html - 在 IE7 中导航没有正确显示

html - Twitter Bootstrap 生成空白空间

html - 垂直滚动条不滚动

javascript - 如何使图标网页运行