css三角形和文字代码

/* CSS 三角形 */ .triangle { width: 0; height: 0; border-top: 50px solid transparent; /* 上半个三角形 */ border-right: 100px solid yellow; /* 矩形右边相邻的边 */ border-bottom: 50px solid transparent; /* 下半个三角形 */ } /* 文字代码 */ .code { font-family: Consolas, monospace; background-color: #f2f2f2; padding: 10px; border: 1px solid #ddd; border-radius: 4px; }

在 CSS 中，我们可以使用 border 属性来制作三角形：

代码如下：

.triangle {
  width: 0;
  height: 0;
  border-top: 50px solid transparent;
  border-right: 100px solid yellow;
  border-bottom: 50px solid transparent;
} 

而如果我们想在网页中显示代码，可以使用 pre 标签来保留空格和换行：

<style>
  .triangle {
    width: 0;
    height: 0;
    border-top: 50px solid transparent;
    border-right: 100px solid yellow;
    border-bottom: 50px solid transparent;
  }
</style>
<div class="triangle"></div> 

这样就可以显示出 HTML 和 CSS 代码了。