css 倒三角形 CSS 打造(此处有更多内容)的倒三角显示效果
导读：收集整理的这篇文章主要介绍了css 倒三角形 CSS 打造(此处有更多内容 的倒三角显示效果，觉得挺不错的，现在分享给大家，也给大家做个参考。 复制代码@H_406_7@代码如下: <style> .b{ posITi...
收集整理的这篇文章主要介绍了css 倒三角形 CSS 打造(此处有更多内容)的倒三角显示效果，觉得挺不错的，现在分享给大家，也给大家做个参考。 复制代码@H_406_7@代码如下:
style>
.b{
posITion: absolute;
z-index: 2;
width: 0;
height: 0;
line-height: 0;
font-Size: 0;
border-width: 5px; /*如果想改变倒三角形的大小,就改变这里的像素值*/
border-style: solid;
border-color: #666 #fff #fff #fff; /*如果倒三角形的父元素背景不是白色,就把后面三个#fff改为对应的背景色*/
top: 13px;
left: 40px; /*如果倒三角形前面的字多于两个,就设置这里的像素值大些*/
}
.demo{
position: relative;
display: inline-block; /*这一句不可少*/
vertical-align: middle;
z-index: 0;
height: 32px;
line-height: 32px; /*这一句不可少*/
cursor: pointer;
}
/style>
span class='demo'>
南京
b class='b'> /b>
/span>
声明：本文内容由网友自发贡献，本站不承担相应法律责任。对本内容有异议或投诉，请联系2913721942#qq.com核实处理，我们将尽快回复您，谢谢合作！
若转载请注明出处： css 倒三角形 CSS 打造(此处有更多内容)的倒三角显示效果
本文地址： https://pptw.com/jishu/584833.html