<!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 關注
- 2948 瀏覽
添加回答
舉報
0/150
提交
取消