Web秀
首页
专栏
文章
问答
热点
导航
实例
首页
登录
首页
前端
JavaScript
Vue.js
CSS
Uni-App
专栏
问答
工具
全网热点
导航
前端
设计
实例
登录
#三角形#
共找到
三角形
相关内容
5
条
优先问答
优先文章
Javan
Lv6
专注于前端知识分享
0
关注
0
关注者
关注
Javan
6年前
CSS绘制三角形和箭头,不用再用图片了
前言还在用图片制作箭头,三角形,那就太lou了。css可以轻松搞定这一切,而且颜色大小想怎么变就怎么变,还不用担心失真等问题。先来看看这段代码:/**css*/.d1{width:0;height:0;border:100pxsolid#339933;}/**html*/<divclass="d1"></div>/**css*/.d2{width:0;height:0;border-width:100px;border-style:solid;border-color:#FFCCC
562528
3781
0
Javan
Lv6
专注于前端知识分享
0
关注
0
关注者
关注
Javan
4年前
CSS3D世界,纯CSS如何绘制三棱锥
非常抱歉,断更了半年,原因也是有很多,疫情期间在老家也是没有电脑,上班后非常的忙,种种原因吧。让小伙伴们久等了,非常抱歉!后续还是保持正常更新,不辜负小伙伴们的信任。下面还是回归今天的主题:CSS如何制作三棱锥?结构三棱锥,大家看图,应该能看到它共有4个面,分别是3个侧面,1个底面。我们将其细分为,前面、左面、右面和底面。用html表示如下:<ulclass="cones-inner"><liclass="front"></li><liclass="right"&
548550
3350
0
Javan
Lv6
专注于前端知识分享
0
关注
0
关注者
关注
Javan
4年前
CSS简笔画:纯CSS绘制一辆婴儿车
专栏也更新了一小半了,不知道大家都学到了吗?CSS学习其实不难,难的是动手实践,当你看到一个效果是,觉得这个实现起来很难、很难,但是你一旦动手,一步一步分解实现,会发现也没有想象中的那么难。下面我们动手写一个纯CSS婴儿车,你将学习到下列知识:你能get到1、CSSFlex水平垂直居中2、CSS变量(前面小节已经讲过)3、CSS伪类的灵活使用4、CSS相对定位和绝对定位5、CSS绘制半圆形扇形三角形6、CSStransform变形看图解构婴儿车结构很简单,从下至上,车轮、婴儿床、扶手、斗篷,复杂点的就是斗
547678
3253
0
chokcoco
Lv0
iCSS前端趣闻
0
关注
0
关注者
关注
chokcoco
2年前
CSS 奇思妙想 | 巧妙的实现带圆角的三角形
之前在这篇文章中--《老生常谈之CSS实现三角形》,介绍了6种使用CSS实现三角形的方式。但是其中漏掉了一个非常重要的场景,如何使用纯CSS实现带圆角的三角形呢?,像是这样:本文将介绍几种实现带圆角的三角形的实现方式。法一.全兼容的SVG大法想要生成一个带圆角的三角形,代码量最少、最好的方式是使用SVG生成。使用SVG的多边形标签<polygon>生成一个三边形,使用SVG的stroke-linejoin="round"生成连接处的圆角。代码量非常少,核心代码如下:<svgwidth="
545853
3241
0
chokcoco
Lv0
iCSS前端趣闻
0
关注
0
关注者
关注
chokcoco
2年前
【面试技巧】老生常谈之 n 种使用 CSS 实现三角形的技巧
在一些面经中,经常能看到有关CSS的题目都会有一道如何使用CSS绘制三角形,而常见的回答通常也只有使用border进行绘制一种方法。而CSS发展到今天,其实有很多有意思的仅仅使用CSS就能绘制出来的三角形的方式,本文将具体罗列讲讲。通过本文,你能了解到6种使用CSS绘制三角形的方式,并且它们都非常好掌握。当然本文仅是抛砖引玉,CSS日新月异,可能还有一些有意思的方法本文遗漏了,欢迎大家在留言区补充~使用border绘制三角形使用border实现三角形应该是大部分人都掌握的,也是各种面经中经常出现的,利用了
545721
3287
0
下拉加载更多