有没有通过div绘制对角线的简单方法?这条线应该从左上角到右下角.

.container {
  width: 100%;
  height: 100%;
}
<div class="container">
  <div class="line"></div>
</div>

enter image description here

推荐答案

使用渐变

.container {
  width: 200px;
  height: 100px;
  background: linear-gradient(to bottom left,#0000 49%,red ,#0000 51%);
  border: 1px solid;
}
<div class="container">
</div>

Html相关问答推荐

CSS/添加margin—top到嵌入式facebook帖子

输入表单在奇怪的地方舍入的标签

使用CSS Flexbox时,我的图像未对齐

carousel 的垂直滚动按钮居中

SVG的动态CSS

根据Tailwind CSS中的子计数而非子宽度进行对齐,并水平对齐

如果最后一行的卡数少于其他行,则在使用flex grow使卡在调整大小时拉伸后,flex卡的宽度将被拉伸

如何在 Bootstrap 5 中将两个导航栏元素放在末尾?

我的 *ngFor 中的 array.reverse() 在生产中不起作用

四开将一个 qmd 文档中的单词链接到另一个 qmd 文档中的单词

如何使Bootstrap 5卡可点击

为什么即使我点击其他地方,我的 contenteditable="true" 也会被激活?

在选项标签中如何添加Django模板的条件

样式化单选按钮 背景 colored颜色

如何在 blazor 中单击单个按钮调用 2 个等待任务

让 Iframe 覆盖整个页面

在 html 邮箱的左侧和右侧制作多个元素很热门吗?

Css 左属性问题

两个按钮范围滑块的 CSS

是否可以使用纯 css 创建具有斜角效果的锯齿形边缘?