1.效果
2.源码
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head><style type="text/css">#confirm{position: absolute;z-index: 1;display: inline-block;border: 1px solid black;background-color: gray;width: 50px;height:40px;border-radius: 10px;-webkit-box-shadow: 3px 3px 3px #adadad;-moz-box-shadow: 3px 3px 3px #adadad;box-shadow: 3px 3px 3px #adadad;text-align: center;line-height: 40px;color: red;}#triangle{position: absolute;z-index: 2;top: 44px;left: 26px;display: inline-block;border-bottom:1px solid black;border-right:1px solid black;background-color: gray;width: 10px;height:10px;-webkit-transform: rotateZ(45deg);-moz-transform: rotateZ(45deg);-ms-transform: rotateZ(45deg);-o-transform: rotateZ(45deg);transform: rotateZ(45deg);-webkit-box-shadow: 3px 3px 3px #adadad;-moz-box-shadow: 3px 3px 3px #adadad;box-shadow: 3px 3px 3px #adadad;}</style>
</head>
<body>
<div id="confirm">提示</div>
<div id="triangle"></div>
</body>
</html>
