当前位置: 首页 > news >正文

css-画一个三角形

<span class="triangle"></span>
.triangle {display: inline-block; /* 使 span 能够接受宽高 */width: 0; /* 宽度为 0 */height: 0; /* 高度为 0 */border-left: 50px solid transparent; /* 左边边框 */border-right: 50px solid transparent; /* 右边边框 */border-bottom: 100px solid blue; /* 底边边框的颜色(可更改为需要的颜色) */
}

1.必须时一个块级元素

2.宽高都为0;

3.左右边框 :

 border-left: 50px solid transparent; /* 左边边框 */
  border-right: 50px solid transparent; /* 右边边框 */

4.下边框: 
    border-bottom: 100px solid blue; /* 底边边框的颜色(可更改为需要的颜色) */

 


http://www.mrgr.cn/news/59795.html

相关文章:

  • 基于neo4j的旅游知识图谱维护与问答系统
  • esp32学习:语音识别教程esp-skainet库的使用
  • C# 企业微信机器人推送消息 windows服务应用程序的使用
  • 第十八届联合国世界旅游组织/亚太旅游协会旅游趋势与展望大会在广西桂林开幕
  • Unity引擎:游戏开发的核心力量
  • Python数据分析基础
  • JavaFx -- chapter05(多用户服务器)
  • 基于Python的B站视频数据分析与可视化
  • 什么是环境变量?如何安装JAVA环境变量,实现命令行(cmd)执行java命令?win11、win10、win7一篇文章带你全部解决!包教包会!
  • 【论文笔记】Perceiver: General Perception with Iterative Attention
  • 【次小生成树】
  • 十八、【智能体】数据库:未来科技的大脑
  • word使用小技巧
  • 【MySQL】实战篇—应用开发:使用MySQL与编程语言(如Python、Java、PHP等)进行交互
  • 企业数字化转型和智能制造体系
  • 利用编程思维做题之判断回文字符串
  • 第13次CCF CSP认证真题解
  • 【设计模式系列】迭代器模式
  • XXE进阶
  • 前缀和算法 | 计算分矩阵的和
  • 【Chapter 11】中断时间序列分析:政策变化的因果推断
  • 【Chapter 5】因果推断中的倾向得分和双重稳健估计
  • Sampling采样与Virtual Columns虚拟列
  • 2024年最新Java毕业设计选题题目参考,2000+ Java毕业设计题目,值得收藏
  • 使用Python进行办公楼电能消耗数据的机器学习分析与预测
  • 【Qt】系统相关——多线程、Qt多线程介绍、常用函数、线程安全、网络、UDP Socket、TCP Socket