码迷,mamicode.com
首页 > 其他好文 > 详细

带箭头的圆角框

时间:2015-07-29 12:07:51      阅读:105      评论:0      收藏:0      [点我收藏+]

标签:

技术分享
 1 <!doctype html>
 2 <html>
 3 <head>
 4      <meta charset="UTF-8">
 5      <title>韬睿科技</title>
 6      <style>
 7           .div1{
 8                width: 375px;
 9                height: 230px;
10                border: 1px solid red;
11                padding:15px;
12                border-radius:8px;
13                position:absolute;
14                left:5px;
15                top:8px;
16 
17                }
18           .div2{
19                transform:rotate(45deg);
20                background:none repeat  0 0 white;
21                border-top:1px solid red;
22                border-left:1px solid red;
23                width:10px;
24                height:10px;
25                left:33px;
26                top:-6px;
27                position:absolute;
28                 }
29      </style>
30 </head>
31 <body>
32      <div class="div1">
33           <div class="div2">
34           </div>
35      </div>
36 </body>
37 </html>
View Code

 

带箭头的圆角框

标签:

原文地址:http://www.cnblogs.com/xiaomume/p/4685410.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!