html - 如何在 HTML 中制作三 Angular 形？

Question

我想使用基本的 CSS 在 HTML 页面中制作三 Angular 形。我正在使用加载时间较长的三 Angular 形图片，因此，我想减少页面的加载时间。

Answer 1

HTML 不行，CSS 不行。示例:

<div class="triangle></div>

.triangle {
    width: 0;
    height: 0;
    border: solid 30px;
    border-color: transparent transparent black transparent;
}

现场演示:jsFiddle

border 属性中的
• 30px 定义了大小:宽度和高度。如果您想要更小或更大的三 Angular 形，您可以更改它。
• 如果要旋转三 Angular 形，请在border-color 属性中切换black 和transparent 的位置。参见 jsFiddle