直接粘贴走，打开页面看即可！！！
<!doctype html>
<html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <style> .test1 { width: 0; height: 0; line-height: 0px; font-size: 0px; border-width: 20px 10px; border-style: solid; border-color: #ff3300 #ffffff; border-color: #ff3300 #ff3300 #ffffff #ffffff; } .test{width:10px; height:10px; border:10px solid; border-color:#ff3300 #fff #fff #fff;} .box{width:500px;} .top{border-bottom:3px solid; border-bottom-color:#cc0000; border-left:3px dotted transparent; border-right:3px dotted transparent;} .center{padding:10px 20px; color:white; font-size:14px; background:#cc0000;} .bot{border-top:3px solid; border-top-color:#cc0000; border-bottom-color:#cccccc; border-left:3px dotted transparent; border-right:3px dotted transparent;} .org_box { height: 50px; line-height: 50px; width: 500px; background-color: pink; padding-left: 2em; position: relative; } .org_bot_cor { height: 0; width: 0; line-height: 0; font-size: 0px; border-width:20px 15px ; border-style: solid; border-color: pink transparent transparent transparent; position: absolute; bottom:-40px; left:50px; } .org_box1{ height:80px; line-height:80px; margin-bottom:30px; padding-left:2em; background:#F3961C; position:relative; } .org_bot_cor_2{ height: 0; width: 0; line-height: 0; font-size: 0px; border:20px solid ; border-color: #F3961C transparent transparent transparent; position: absolute; bottom:-40px; left:50px; left:60px; bottom:-40px; } </style></head><body> <div class="test1"></div> <div class="test"></div> <div class="test2"></div> <div class="test3"></div> <br><br><br> <div class="box"> <div class="top"></div> <div class="center">我是一只小小鸟、小小鸟！</div> <div class="bot"></div> </div> <br><br><br> <div class="org_box"> <span class="org_bot_cor"></span> 边框法实现底部90度尖角对话框 </div> <br><br><br><div class="org_box1"> <span class="org_bot_cor_2"></span> 字符法实现底部90度尖角对话框</div><!-- 汽泡法 --><br><br><br><br><br><br><style>.org_box3{width:300px; padding:30px 20px; margin-left:60px; background:#beceeb; position:relative;}.org_box3 span{width:0; height:0; font-size:0; overflow:hidden; position:absolute;}.org_box3 span.org_bot_cor_3{ border-width:20px; border-style:solid; border-color:#ffffff #beceeb #beceeb #ffffff; left:-40px; top:40px;}.org_box3 span.org_top_cor_3{ border-width:10px 20px; border-style:dashed solid solid dashed; border-color:transparent #ffffff #ffffff transparent; left:-40px; top:60px;}</style><div class="org_box3"> <span class="org_bot_cor_3"></span> <span class="org_top_cor_3"></span> CSS “边框法”实现气泡对话框效果一</div><br><br><br><br><br><br><style>.org_box4{width:300px; padding:30px 20px; border:5px solid #beceeb; position:relative;}.org_box4 span{width:0; height:0; font-size:0; overflow:hidden; position:absolute;}.org_box4 span.org_bot_cor_4{ border-width:20px; border-style:solid dashed dashed; border-color:#beceeb transparent transparent; left:80px; bottom:-40px;}.org_box4 span.org_top_cor_4{ border-width:20px; border-style:solid dashed dashed; border-color:#ffffff transparent transparent; left:80px; bottom:-33px;} </style><div class="org_box4"> <span class="org_bot_cor_4"></span> <span class="org_top_cor_4"></span> CSS “边框法”实现气泡对话框效果二</div></body></html>