css3 - css小三角定位
本文介绍了css3 - css小三角定位的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
问 题
<div>文字<span class="triangle-down"></span></div>
.triangle-down {
width: 0;
height: 0;
border-left: 0.4rem solid transparent;
border-right: 0.4rem solid transparent;
border-top: 0.6rem solid darkgray;
}
怎么把小三角的位置调整到文字后面
解决方案
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
div:after {
content: "";
display: inline-block;
width: 0;
height: 0;
border-left: 0.4rem solid transparent;
border-right: 0.4rem solid transparent;
border-top: 0.6rem solid darkgray;
}
</style>
</head>
<body>
<div>文字</div>
</body>
</html>
这篇关于css3 - css小三角定位的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文