前端怎么实现这种带尖角的图片聊天消息？
图片左边或者右边（自己发的消息）的部分隐藏，只显示尖角部分
叮当猫咪浏览 780回答 2
2回答
-
猛跑小猪
<!DOCTYPE HTML><html> <head> <meta charset="utf-8"> <title>无标题文档</title> </head> <body> <style> body{margin:0;padding:0;} .demo{width:200px;height:100px;background:#ddd;position:relative;border-radius:8px;margin:20px auto;} .demo:before{content:'';position:absolute;margin:0;padding:0;font-size:0;line-height:0;border-width:10px;border-color:#ddd;border-style:dashed;border-left-width:0;border-right-style:solid;border-top-color:transparent;border-bottom-color:transparent;display:inline-block;left:-10px;top:50%;margin-top:-10px;} </style> <div class="demo"></div> </body></html>
随时随地看视频慕课网APP
相关分类
JavaScript