Html 有没有可能设置div的边框宽度相对于其父宽度和高度'

#rectangle {
  width: 100vw;
  height: 50vw;
  background-color: black;
}

#triangle {
  width: 0;
  height: 0;
  border-top: 25vw solid transparent;
  border-bottom: 25vw solid transparent;
  border-left: 33.33vw solid blue;
}

<div id="rectangle">
  <div id="triangle"></div>
</div>

<div id="rectangle">
  <div id="triangle"></div>
</div>

#rectangle {
  width: 100vw;
  height: 50vw;
  background-color: black;
}

#triangle {
  width: 0;
  height: 0;
  border-top: 25vw solid transparent;
  border-bottom: 25vw solid transparent;
  border-left: 33.33vw solid blue;
}

#rectangle {
  width: 80vw;
  height: 50vw;
  background-color: black;
  container-type: size;
  margin-inline: 10vw;
}

#triangle {
  width: 0;
  height: 0;
  border-top: 50cqh solid transparent;
  border-bottom: 50cqh solid transparent;
  border-left: 33.33cqw solid blue;
}

<div id="rectangle">
  <div id="triangle"></div>
</div>

Html相关问答推荐

我需要两个HTML标签，以便当另一个隐藏时，一个可见，反之亦然

如何正确使用counter()、counter—increment()和counter—reset()嵌套标题？

如何使div按钮链接到另一个网页

为什么我得不到有错误的字段？迈克尔·哈特尔教程.7.3.3

将精选选项的价格合并为一个价格HTML、PHP和JQuery

十进制数字不适用于格网项目的格网布局线放置中使用的SPAN关键字

使用bash从html表格中提取表格

在R中从网页上的特定iframe中提取图形数据

水平行中按钮的垂直偏移

仅 Select 悬停的级别，而不 Select 其父级或子级

在移动屏幕上显示时分支树视图的响应能力问题

当底部进入视图时从底部粘性定位

标题在实时网站上闪烁

如何在悬停时使矩形按钮上的边框变圆

如何使用CSS Select 同级元素的：：before伪元素？

显示填充正方形的图形的简单页面的 HTML 代码

在带有换行文本的工具提示中显示溢出文本

在shiny 的应用程序中使用图标功能时出错

font awesome 的 CDN/CSS 如何工作？

我怎么能有 ：not(.class)：nth-of-type(even)？