为了账号安全,请及时绑定邮箱和手机立即绑定

:after,:before的绝对定位问题

:after,:before的绝对定位问题

m慕光 2016-11-08 22:54:06
<!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 回答

?
李晓健

TA贡献1036条经验 获得超461个赞

你的效果不是正常的嘛,有什么问题?

查看完整回答
反对 回复 2016-11-09
  • 3 回答
  • 1 关注
  • 2830 浏览
慕课专栏
更多

添加回答

举报

0/150
提交
取消
意见反馈 帮助中心 APP下载
官方微信