.test_triangle_border { position:relative; margin:100px auto; width:200px; text-align:center; } .test_triangle_border a { color:#333; font-weight:bold; text-decoration:none; } .test_triangle_border .popup { display:none; position:absolute; top:30px; left:30px; padding:10px 20px; width:100px; background:#B8E8D2; color:#333; border-radius:4px; border:1px solid #333; text-align:left; } .test_triangle_border .popup span { display:block; position:absolute; top:-10px; left:50%; /* 三角形居中显示 */margin-left:-10px; /* 三角形居中显示 */ width:0; height:0; border-width:0 10px 10px; border-style:solid; border-color:transparent transparent #333; } .test_triangle_border .popup em { display:block; width:0; height:0; border-width:0 10px 10px; border-style:solid; border-color:transparent transparent #B8E8D2; position:absolute; top:1px; left:-10px; }