作业中的三角形怎么做

JJJustin 2019-07-05

源自：HTML5属性变化 2-10 input新增类型（range_search_color）

10

收起

1回答

好帮手慕星星回答被采纳获得+3积分 2019-07-05 14:38:16

你好，可以使用border边框完成，给你举一个例子：

效果：

如果想要其中一边的三角形，可以将其他边颜色设置为透明即可（transparent）。

自己试着写一写，祝学习愉快！

JJJustin 提问者 #1

老师能解释一下这段代码吗

2019-07-05 14:56:31
好帮手慕星星回复提问者 JJJustin #2

元素不设置宽高，是为了中间没有空白，否则中间就会有个矩形，这样就不是三角形了。然后添加上下左右四个边框，设置边框宽度，样式以及颜色，显示出来的效果就是四个三角形拼起来的。自己可以测试理解下。

2019-07-05 15:13:07
JJJustin 提问者回复好帮手慕星星 #3

宽高设为0 让div自动撑 border四个方向设置同一数值互相覆盖系统会自动显示每个方向三角形这个方法是谁想的太流弊了????

2019-07-05 16:03:03

点开查看后面1条评论

相似问题

作业中div上的三角怎么实现的？

通过三角形拼成五角星，具体尺寸是怎么计算的

作业About区三角的问题

老师，我写的出来2个三角形

想问一下老师，这种圆形的警告图怎么实现

登录后可查看更多问答，登录/注册

1.前端零基础入门

参与学习人
提交作业 8403 份
解答问题 40143 个

本阶段为你揭开日常所见网页的神秘面纱，炫酷的动效并不难得，带你从基础知识到静态网页布局，再到用JS实现动态网页开发，轻松迈入前端开发的大门。

本课精华内容

问答作业

关于浏览器兼容性代码疑问

16 1

请老师检查

65 3

没有明白，为什么height是90，padding-top为60。它就居中了？

26 3

关于三种常用的清除浮动方法的优劣对比，请老师简单讲一讲

18 1

进击的小白们加油。分享一下我做最后这个项目作业的感受

188 1

查看更多本课问答

请稍等 ...

意见反馈帮助中心 APP下载