css 画三角形

css 画三角形1、斜边在左边三角形<style>.triangle{border-top:50pxsolidtransparent;border-bottom:50pxsolidtransparent;border-left:50pxsolid#000;…

大家好,又见面了,我是你们的朋友全栈君。

1、斜边在左边三角形

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

2、斜边在上面的三角形

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

3、斜边在下边的三角形

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

4、斜边在右边的三角形

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

5、等边三角形(等边三角形的底边的高是底边的1/sqrt(2)倍)

 <style> .triangle { border-left: 40px solid transparent; border-right: 40px solid transparent; border-bottom: 28px solid #000; width:0; height:0; } </style>
 <div class="triangle"></div>
版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/148063.html原文链接:https://javaforall.net

赞 (0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • Camera 之水波纹和banding现象[通俗易懂]

    Camera 之水波纹和banding现象[通俗易懂]预览画面中出现了一条明一条暗相间隔的竖条纹,这种现象叫做“水波纹”,并对原因进行了讲解,现记录如下。其实这些“水波纹”产生是因为手机的快门频率与灯光的频率不匹配导致的。首先,我们都知道手机拍照的时候都是有一定曝光时间的,例如假设手机的快门频率为50Hz,则其拍照时的曝光时间就是20ms。同理,屏幕或者日光灯不是一直在发光的,而是更隔一段时间就会刷新一次,我们生活中的日光灯为50Hz,国外的是60Hz。例如那个50Hz,就代表每秒刷新50次,因为刷…

    2022年10月13日
  • python open函数参数_python中open函数的使用

    python open函数参数_python中open函数的使用一、open()的函数原型open(file,mode=‘r’,buffering=-1,encoding=None,errors=None,newline=None,closefd=True)从官方文档中我们可以看到open函数有很多的参数,我们常用的是file,mode和encoding,对于其它的几个参数,平时不常用,也简单介绍一下。buffering的可取值有0,1,>1三个…

    2022年5月9日
  • 图解Golang的GC算法「建议收藏」

    图解Golang的GC算法「建议收藏」虽然Golang的GC自打一开始,就被人所诟病,但是经过这么多年的发展,Golang的GC已经改善了非常多,变得非常优秀了。以下是GolangGC算法的里程碑:v1.1STWv1.3MarkSTW,Sweep并行v1.5三色标记法v1.8hybridwritebarrier经典的GC算法有三种:引用计数(referencecounting)、标记-清扫(mar…

    2022年6月22日
  • java标识符是什么_Java 标识符「建议收藏」

    java标识符是什么_Java 标识符「建议收藏」什么是标识符标识符就是程序员在编写Java程序时,自定义的一些名字。例如第一个Java程序里关键字class后跟的HelloWorld,就是我们自定义的类名。类名就属于标识符的一种。标识符除了应用在类名上,还可以用在接口、变量、方法名、包名上。(要求同学们先记住,以后会详细见到这些)。标识符命名规则标识符由字母、下划线、美元符或数字组成标识符不能以数字开头,不能是关键字标识符严格区分大…

    2022年7月9日
  • 简单LMDB用法_法语简单过去时用法

    简单LMDB用法_法语简单过去时用法装载请注明出处

    2022年9月29日
  • AMD FreeSync正式发布:更流畅 更便宜

    AMD FreeSync正式发布:更流畅 更便宜2013年10月份,NVIDIA推出了一项革命性的垂直同步技术G-Sync,通过新控制模块的加入配合GeForceGPU控制显示器刷新率,彻底解决垂直同步、刷新率限制带来的游戏画面撕裂、卡顿、延迟等问题,保证最好的流畅度。该技术的效果非常明显,但缺点也同样明显,那就是需要显示器增加新的模块,成本较高,而且照例是NVIDIA的封闭技术。随后,AMD也提出了自己的解决方案,称之为Fr

    2022年6月3日

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号