携程面试题更新 2026-08-05

如何利用元素的 border 属性和 border-radius 绘制一个向下 45 度的扇形?

携程前端/移动开发消费品/零售编码实现技术原理CSS

考察说明

考察 CSS 盒模型、border 和 border-radius 对形状绘制的理解

回答思路

  1. 说明扇形由 border 和 border-radius 组合实现的原理
  2. 解释 45 度扇形的角度如何通过 border 宽度或宽高比例控制
  3. 描述具体实现步骤:设置元素宽高为 0、用 border 构建三角、再通过 border-radius 切出圆弧
  4. 能说明不同角度和方向的调整方法,如旋转或调整各边 border 值