大家知道CSS三角形箭头代码吗?下面我们就给大家详细介绍一下吧!我们积累了一些经验，在此拿出来与大家分享下，请大家互相指正。

CSS代码

复制代码

代码如下:

/* create an arrow that points up */

div.arrow-up {

width: 0;

height: 0;

border-left: 5px solid transparent; /* left arrow slant */

border-right: 5px solid transparent; /* right arrow slant */

border-bottom: 5px solid #2f2f2f; /* bottom, add background color here */

font-size: 0;

line-height: 0;

}

/* create an arrow that points down */

div.arrow-down {

width: 0;

height: 0;

border-left: 5px solid transparent;

border-right: 5px solid transparent;

border-top: 5px solid #2f2f2f;

font-size: 0;

line-height: 0;

}

/* create an arrow that points left */

div.arrow-left {

width: 0;

height: 0;

border-bottom: 5px solid transparent; /* left arrow slant */

border-top: 5px solid transparent; /* right arrow slant */

border-right: 5px solid #2f2f2f; /* bottom, add background color here */

font-size: 0;

line-height: 0;

}

/* create an arrow that points right */

div.arrow-right {

width: 0;

height: 0;

border-bottom: 5px solid transparent; /* left arrow slant */

border-top: 5px solid transparent; /* right arrow slant */

border-left: 5px solid #2f2f2f; /* bottom, add background color here */

font-size: 0;

line-height: 0;

}

相信大家已经学会CSS三角形箭头代码了吧!感谢大家对我们网站的支持!

相关推荐：

divcssVB中Byval和byref的区别介绍