纯CSS实现tooltip提示框,CSS箭头及形状之续篇--给整个tooltip提示框加个边框
Posted stono
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了纯CSS实现tooltip提示框,CSS箭头及形状之续篇--给整个tooltip提示框加个边框相关的知识,希望对你有一定的参考价值。
纯CSS实现tooltip提示框,CSS箭头及形状之续篇--给整个tooltip提示框加个边框
学习了:https://blog.csdn.net/u012688910/article/details/41856895
源码膜拜:
<body> <div class="demo"></div> </body>
.demo{ background-color: gray; height: 100px; position: relative; width: 100px; border:2.75px solid red; } .demo:after,.demo:before{ content:‘‘; position:absolute; } .demo:after{ //height:20px; //width:20px; //background:yellow; //border:10px solid lightgreen; border:10px solid transparent; border-top-color:gray; top:100px; left:20px; } .demo:before{ //height:30px; //width:30px; //background:green; //border:15px solid red; border:15px solid transparent; border-top-color:red; top:100px; left:15px; }
以上是关于纯CSS实现tooltip提示框,CSS箭头及形状之续篇--给整个tooltip提示框加个边框的主要内容,如果未能解决你的问题,请参考以下文章