<style type="text/css"> #box { margin-left:80px; margin-top:20px; padding-left:20px; height: 60px; background: #2aa1c8; position: relative; border-radius:10px; border:1px solid #1c82a3;}#box:before{ content:""; position: absolute; right: 100%; top: 16px; width: 0; height: 0; border-top: 12px solid transparent; border-right: 12px solid #1c82a3; border-bottom: 12px solid transparent;}#box:after { content:""; position: absolute; right: 100%; top: 18px; width: 0; height: 0; border-top: 10px solid transparent; border-right: 10px solid #2aa1c8; border-bottom: 10px solid transparent;} </style> <body class=""> <div style="width:60px;height:60px;background:#ccc;float:left;"></div> <div id="box">对话框</div></body>//before伪类作为三角的边框//此对话框是自适应屏幕大小的登入後複製
