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 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 | /*謝林趴趴回應數*/ .cboxAnchor[data-type="plurk"]>table{ position: relative; } .cboxAnchor[data-type="plurk"]>table::before{ content:""; color:red; position: absolute; width:70px; height:46px; right: 30px; top:-40px; background-image:url(https://images.plurk.com/5uGkvMHwH1WqofuyDWEpea.png); /*可替換圖片*/ z-index:100; background-size:contain; background-repeat: no-repeat; } /*排版+氣泡框*/ .timeline-cnt{ position:relative; margin-top: 30px; } .cboxAnchor[data-type="plurk"] .plurk_cnt { padding: 5px 30px 5px 5px; border-radius: 13px; } .cboxAnchor[data-type="plurk"] .plurk_cnt .tr_cnt{ margin:20px; display:inline; } .td_img{ position:absolute; left:0px; margin:5px; z-index:100; } .p_img img{ border-radius: 100%; } .response_count{ position: relative; top:-52px; left:-20px; border:5px solid transparent; border-radius:30px; background-color:#b1e02f; font-size: 10px; text-align:center; z-index:100; width:100%; height:100%; min-width:25px; max-height:20px; color:#8f8f8f; line-height:8px; font-family:微軟正黑體 !important; } .new .response_count{ border:5px solid transparent; } .response_count::after { content:""; position:absolute; left:4px; top:10px; border-color:#b1e02f transparent transparent #b1e02f; border-style: solid solid solid solid; border-width: 5px 5px; height: 0px; width: 0px; } .new .response_count::after { border-color: #fb0047 transparent transparent #fb0047; } Direct link: https://paste.plurk.com/show/rTtyr9XiDmURx9CcHcWp |
Direct link: https://paste.plurk.com/show/eIbhokVNnaPbrNTKbJ0V