布局技巧——css三角巧妙运用

最新推荐文章于 2022-03-01 11:13:18 发布

芒果水蜜桃

最新推荐文章于 2022-03-01 11:13:18 发布

阅读量197

点赞数

分类专栏：前端学习笔记文章标签： css javascript css3

本文链接：https://blog.csdn.net/Meng19986082304/article/details/121083380

版权

本文深入探讨了如何利用CSS创建各种三角形的技巧，包括边框颜色透明度的运用，以及不同边框宽度和颜色如何影响三角形状的形成。通过实例解析，展示了纯CSS实现三角形的灵活性和实用性。

摘要由CSDN通过智能技术生成

在这里插入图片描述

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>布局技巧——css三角巧妙运用</title>
  <style>
    .box1 {
   
      /* width: 0;
      height: 0;
      border-top: 100px solid transparent;
      border-right: 50px solid skyblue;
      border-bottom: 0px solid green;
      border-left: 0px solid #000; */
      width: 0;
      height: 0