【问题标题】:CSS border corner round backwards [duplicate]CSS边框角向后圆[重复]
【发布时间】:2012-10-01 18:33:27
【问题描述】:

可能重复:
CSS3 Inverted Rounded Corner

有没有办法让 CSS 边框的角朝相反的方向变圆?我不是在说倒置。

假设您有两个垂直堆叠的 div,关于两个相交的顶部 div 的底部边框,我希望角向底部 div 的方向弯曲,但属于顶部 div。

编辑:基本上,看起来像这样:

Pumbaa80 是对的,它是 CSS3 Inverted Rounded Corner 的副本。我不完全了解它是如何工作的,但我能够重新创建它,现在我只是调整它的位置。

【问题讨论】:

  • 只是作弊。创建一个圆形 div 并绝对定位在该 div 的顶部,具有更高的 z-index :)
  • 我不能,我希望另一边的角在法线方向上弯曲,并且那个未弯曲角的边缘会显示在顶部的后面。
  • 也许可以提供一个快速的模型图像来说明您的意思?我不完全理解您想要实现的目标,并且还认为@PhD 所说的分层 div 方法会起作用。
  • 你或许能从这篇文章中得到一些东西css-tricks.com/better-tabs-with-round-out-borders

标签: html border rounded-corners css


【解决方案1】:

这将创建您已说明的行:

http://jsfiddle.net/hF8w5/

可以包含在绝对定位的 div 中并定位在您想要的位置。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2021-11-13
    • 2016-02-29
    • 2020-11-08
    • 1970-01-01
    • 1970-01-01
    • 2012-07-17
    • 1970-01-01
    相关资源
    最近更新 更多