Test
Source
Edit
History

测试用页

Catalogue
  1. 1. 表格
  2. 2. -TOC
  3. 3. 代码块
    1. 3.1. iframe
    2. 3.2. HTML
    3. 3.3. CSS
  4. 4. 插图
    1. 4.1. 1. 文档根目录
    2. 4.2. 2. 文章资源夹
    3. 4.3. 3. 网络用图
  5. 5. 多媒体
  6. 6. 参考资料

表格

表头 表头2 表头3
1 4 7
2 5 8
3 6 9

-TOC

1
2
[TOC]
@[TOC]

代码块

iframe

1
<iframe frameborder="no" border="0" marginwidth="0" marginheight="0" width=298 height=52 src="//music.163.com/outchain/player?type=2&id=1859310&auto=0&height=32"></iframe>

HTML

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
<!Doctype html>
<html>
<head>
<meta charset="utf-8" />
<title>html5 image to base64</title>
</head>
<body>
<script type="text/javascript">
window.onload = function(){ 
// 抓取上传图片，转换代码结果，显示图片的dom
var img_upload=document.getElementById("img_upload");
var base64_code=document.getElementById("base64_code");
var img_area=document.getElementById("img_area");
// 添加功能出发监听事件
img_upload.addEventListener('change',readFile,false);}
function readFile(){
var file=this.files[0];
if(!/image\/\w+/.test(file.type)){ 
alert("请确保文件为图像类型"); 
return false; 
}
var reader=new FileReader();
reader.readAsDataURL(file);
reader.onload=function(){
base64_code.innerHTML = this.result; 
img_area.innerHTML = '<div>图片img标签展示：</div><img src="'+this.result+'" alt=""/>'; 
}
}
</script>
<input type="file" id="img_upload"/>
<textarea id="base64_code" rows="30" cols="360"></textarea>
<p id="img_area"></p>
</body>
</html>

CSS

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
# Security
encrypt:
    enable: true # 开启为true，关闭为false
    default_abstract: 这是篇受保护的文章！#默认文章描述，可选
    default_message: 请输入文章密码！#默认密码输入提示，可选
    default_template: 
                    <script src="//cdn.bootcss.com/jquery/1.11.3/jquery.min.js"></script>
                    <div id="security">
                        <div class="input-container">
                            <input type="password" class="form-control" id="pass" placeholder=" {{message}} " />
                            <label for="pass"> {{message}} </label>
                            <div class="bottom-line"></div>
                        </div>
                    </div>
                    <div id="encrypt-blog" style="display:none">
                        {{content}}
                    </div>
                    #默认的文章详情页密码输入提示框，可选

插图

1. 文档根目录

1
2
![](哔哔小子.gif)
![](./哔哔小子.gif)

2. 文章资源夹

  1. 资源夹根目录

    1
    2
    ![](测试用页/伸出圆手.jpg "测试用页/伸出圆手.jpg")
    ![](./测试用页/伸出圆手.jpg "./测试用页/伸出圆手.jpg")

  2. 资源夹子目录

    1
    2
    3
    4
    ![](测试用页/子目录/剪影.jpg "测试用页/子目录/剪影.jpg")
    ![](./测试用页/子目录/剪影.jpg "./测试用页/子目录/剪影.jpg")
    ![](测试用页/子目录/子子目录/三不.png "测试用页/子目录/子子目录/三不.png")
    ![](./测试用页/子目录/子子目录/三不.png "./测试用页/子目录/子子目录/三不.png")

3. 网络用图

1
2


多媒体

参考资料