主页 / 问题 / 1577182
Accepted
midnightelf18
Asked:2024-04-22 00:01:05 +0000 UTC2024-04-22 00:01:05 +0000 UTC

怎样制作这样的弧形框架呢？

  • 772

如何为块制作这样的框架？ 在此输入图像描述

在此输入图像描述

html

1 个回答

  1. Best Answer

    1.07 尝试垂直拉伸背景以补偿旋转。看起来应该是可以计算的，不过也可以简单调整到需要的参数。也许需要添加translateY...

    nav {
  position: relative;
  z-index: 0;
  margin: 1em 10%;
  line-height: 3em;
  text-align: center;
}

nav::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: silver;
  transform: scaleY(1.07) perspective(10em) rotateX(-14deg);
  border-radius: .5em;
}
    <nav>
  Тут будут ссылки
</nav>

    • 2

相关问题