                        课程
                    
                        /前端开发
                        
                            /Bootstrap
                        
                        /玩转Bootstrap（基础）

这个三角具体是怎么通过只设置span的border实现出来的？

.caret {
display: inline-block;
width: 0;
height: 0;
margin-left: 2px;
vertical-align: middle;
border-top: 4px solid;
border-right: 4px solid transparent;
border-left: 4px solid transparent;
}
.btn .caret {
margin-left: 0;
}
.btn-lg .caret {
border-width: 5px 5px 0;
border-bottom-width: 0;
}
.dropup .btn-lg .caret {
border-width: 0 5px 5px;
}

proudrain

2014-12-13

源自：玩转Bootstrap（基础） 5-13

关注问题我要回答

2490

操作

收起

1 回答

iltie165
2015-12-21

span{

position: relative;

top: 8px;

left: 50%;

width: 0px;

height:0px;

border-width:0 10px 10px 10px;

border-style: solid;

border-color: transparent transparent rgba(127,255,212,1) transparent;

}

0 回复有任何疑惑可以回复我~

举报

0/150

提交

取消

玩转Bootstrap（基础）

参与学习 314547 人
解答问题 2275 个

告诉你使用Bootstrap，并且能够独立定制出适合自己的Bootstrap

本课相似问答

2 回答bootstrap是怎么通过字体来造图标的，这么厉害

2 回答尖角怎么做出来的

3 回答具体如何设置图片的大小？

2 回答H1标题自适应是通过什么实现的？

5 回答为什么<a>这样的标签元素则是通过添加类名“.active”来实现。

搜索更多本课相关问答

这个三角具体是怎么通过只设置span的border实现出来的？

我要回答关注问题

意见反馈帮助中心 APP下载