<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>Document</title> <style> .reply { position: relative; width: 200px; height: 80px; border: 1px solid rgba(243, 237, 127, 0.68); border-radius: 5px; background-color: rgba(243, 237, 127, 0.35); } .reply:after { content: ''; width: 0px; height: 0px; border-color: transparent transparent rgba(243, 237, 127, 0.35) transparent; border-style: solid; border-width: 6px; position: absolute; top: -11px; border-radius: 3px; left: 18px; right: auto; } .reply:before { content: ''; width: 0px; height: 0px; border-color: transparent transparent rgba(243, 237, 127, 0.68) transparent; border-style: solid; border-width: 7px; position: absolute; top: -14px; border-radius: 3px; left: 17px; right: auto; } </style></head><body> <div class="reply"></div></body></html>实现简单的聊天气泡(如下图),我的问题是两个伪类中top和left的值应该如何设置呢?
- 3 回答
- 1 关注
- 2887 浏览
添加回答
举报
0/150
提交
取消