JSDM

HTML

 
1
<div class="border-box">
2
    <p>css实现科技感边框</p>
3
 <iframe id="fancybox-frame" name="fancybox-frame1521513593400" frameborder="0" scrolling="no" hspace="0" src="http://i.tianqi.com/index.php?c=code&a=getcode&id=34&h=25&w=280" style="height:100px;color:#fff;">
4
      </iframe>
5
</div>

CSS

xxxxxxxxxx
44
 
1
*{
2
            margin:0;
3
            padding:0;
4
        }
5
        html,body{
6
            width:100%;
7
            height:100%;
8
            background:#040d32;
9
        }
10
        .border-box{
11
          margin: 20px 100px;
12
            position: relative;
13
            background: rgba(1, 19, 67, 0.8);
14
            border: 2px solid #00a1ff;
15
            border-radius: 8px;
16
          
17
        }
18
        .border-box::before {
19
            position: absolute;
20
            top: -2px;
21
            bottom: -2px;
22
            left: 30px;
23
            width: calc(100% - 60px);
24
            content: "";
25
            border-top: 2px solid #016886;
26
            border-bottom: 2px solid #016886;
27
            z-index: 0;
28
        }
29
        .border-box::after {
30
            position: absolute;
31
            top: 30px;
32
            right: -2px;
33
            left: -2px;
34
            height: calc(100% - 60px);
35
            content: "";
36
            border-right: 2px solid #016886;
37
            border-left: 2px solid #016886;
38
            z-index: 0;
39
        }
40
        .border-box p{
41
            text-align: center;
42
            color:#00a1ff;
43
           padding:10px 15px;
44
        }
? ?
? ?
必须是有效的URL
+ 添加另一个资源

JS

x
 
1
必须是有效的URL
+ 添加另一个资源
Close

文件管理 点击文件查看URL

图片

  1. 暂无文件

CSS

  1. 暂无文件

JavaScript

  1. 暂无文件

其他

  1. 暂无文件
拖动文件到上面的区域或者:
加载中 ..................