标签：40px 绘制 height width dashed position 提示框 border css

1.div结构

<div class="level_prompt position-absolute">
																			    
    <div class="arrow" >
																				 
        <span></span>
																			 
    </div>
																		</div>    

2.css样式

.level_prompt{
    margin-top: 100px; 
    width:280px; 
    height:80px; 
    position:relative;
    background-color:rgba(1,162,241,0.9); 
    border-radius: 7px; 
}
.arrow{ 
    position:absolute; 
    width:40px; 
    height:40px; 
    bottom:-40px; 
    left:5px; 
}
.arrow *{ 
    display:block;     
    border-width:20px 20px; 
    position:absolute; 
    border-style:solid dashed dashed dashed; 
    font-size:0; 
    line-height:0; 
}
.arrow span{
    border-color:rgba(1,162,241,0.9)  transparent  transparent;
    top:0px; 
    left: 50px;
}

3.图片样式

标签：40px,绘制,height,width,dashed,position,提示框,border,css
来源： https://www.cnblogs.com/menxiaojin/p/11919011.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。