1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 | .cboxAnchor[data-type="plurk"]>table::before{ content:""; position: absolute; width:70px;/*寬*/ height:46px;/*高*/ right: 50px; top:-42px; z-index:100; background-size:contain; background-repeat: no-repeat; } /* 特定帳號_改uid數字就好_有幾個就複製幾個_這裡以兩個帳號為例 */ .cboxAnchor[data-uid="特定帳號1"]>table::before{ background-image:url(圖片網址); /* 可替換圖片 */ } .cboxAnchor[data-uid="特定帳號2"]>table::before{ background-image:url(圖片網址); /* 可替換圖片 */ } /* 氣泡框 */ .cboxAnchor[data-uid="特定帳號1"] .response_count, .cboxAnchor[data-uid="特定帳號2"] .response_count { position: relative; top:-52px; left:-40px; border:5px solid transparent; border-radius:30px;/*圓角*/ background-color:#000000;/*底色*/ color:#ffffff !important;/*字色*/ font-size: 10px; text-align:center;/*水平置中*/ z-index:100; width:100%; height:100%; min-width:25px; max-height:20px; line-height:8px; font-family:微軟正黑體 !important; } /* 新回應氣泡框 */ .new.cboxAnchor[data-uid="特定帳號1"] .response_count, .new.cboxAnchor[data-uid="特定帳號2"] .response_count{ border:5px solid transparent; background-color:#ff0000;/*底色*/ color:#ffffff !important;/*字色*/ } /* 氣泡框尾巴 */ .cboxAnchor[data-uid="特定帳號1"] .response_count::after, .cboxAnchor[data-uid="特定帳號2"] .response_count::after { content:""; position:absolute; left:4px; top:10px; border-color: #000000 transparent transparent #000000; border-style: solid solid solid solid; border-width: 5px 5px; height: 0px; width: 0px; } /* 新回應氣泡框尾巴 */ .new.cboxAnchor[data-uid="特定帳號1"] .response_count::after, .new.cboxAnchor[data-uid="特定帳號2"] .response_count::after{ border-color: #ff0000 transparent transparent #ff0000; } |
Direct link: https://paste.plurk.com/show/MITp9x9tfURXFVWVW1v4