---
layout:     post
title:     Github博文格式
subtitle:   博客书写格式参考本文
date:       2019-09-15
author:     Duter2016
header-img: img/post-bg-ios9-web.jpg
catalog: true
music-id: 
music-idfull: 
tags:
    - Blog
---

## 1、页头

每一篇文章文件命名采用的是2017-02-04-Hello-2017.md时间+标题的形式，空格用-替换连接。

文件的格式是 .md 的 MarkDown 文件。

我们的博客文章格式采用是 MarkDown+ YAML 的方式。

YAML 就是我们配置 _config文件用的语言。

MarkDown 是一种轻量级的「标记语言」，很简单。花半个小时看一下就能熟练使用了

大概就是这么一个结构。

```
---
layout:     post   				    # 使用的布局（不需要改）
title:      这是文章正标题 				# 标题 
subtitle:      这是副标题                  #副标题
date:       2019-10-01 				# 时间
author:     Duter2016 						# 作者
header-img: img/post-bg-dutbs.jpg 	#这篇文章标题背景图片
header-mask: "0.1"                    # 博文页面上端的背景图片的亮度，数值越大越黑暗
catalog: true 						# 开启catalog，将在博文侧边展示博文的结构
istop: false            # 设为true可把文章设置为置顶文章
music-id: 1359xxxxxx        # 网易云音乐单曲嵌入
music-idfull: 293xxxxxxx        # 网易云音乐歌单嵌入
apserver: netease    # 音乐平台netease/tencent/kugou/xiami/baidu
aptype: playlist    # 音乐类型song/playlist/album/search/artist
apsongid:         # 音乐song/playlist/album id
tags:								#标签
    - Python
---

## Hey
这是博客内容。
进入你的博客主页，新的文章将会出现在你的主页上.
```


##  2、页头图片
页头可使用的自制图片，DUT类：
```
1.header-img: img/post-bg-dutbc.jpg	
2. header-img: img/post-bg-dutbs.jpg	
3.header-img: img/post-bg-dutbsyj.jpg	
4.header-img: img/post-bg-dutljl.jpg	
5.header-img: img/post-bg-dutlx.jpg	
6.header-img: img/post-bg-dutme.jpg	
7.header-img: img/post-bg-dutnm.jpg	
8.header-img: img/post-bg-dutyjl.jpg	
9.header-img: img/post-bg-dutzl.jpg
10.header-img: img/home-bg-coffee.jpg
11.header-img: img/home-bg-desk.jpg
12.header-img: img/post-bg-dutchq.jpg
13.header-img: img/post-bg-dutdhl.jpg
14.header-img: img/post-bg-dutkjy.jpg
15.header-img: img/post-bg-dutlx2.jpg
16.header-img: img/post-bg-dutlx3.jpg
17.header-img: img/post-bg-dutlx4.jpg
18.header-img: img/post-bg-dutlx5.jpg
19.header-img: img/post-bg-duttk.jpg
20.header-img: img/post-bg-dutyjl2.jpg
21.header-img: img/post-bg-dutyjl3.jpg
```

##  其他可用页头图片
页头可使用的图片，混合类：
```
header-img: img/home-bg.jpg    #杂志墙
header-img: img/home-bg-art.jpg    #艺术墙
header-img: img/home-bg-geek.jpg    #手机和鼠标
header-img: img/home-bg-o.jpg    #MAC笔记本
header-img: img/post-bg-2015.jpg    #高速铁道
header-img: img/post-bg-alibaba.jpg    #阿里巴巴咖啡
header-img: img/post-bg-android.jpg    #安卓手机
header-img: img/post-bg-BJJ.jpg    #柔术
header-img: img/post-bg-coffee.jpeg    #书桌和咖啡
header-img: img/post-bg-cook.jpg    #库克
header-img: img/post-bg-debug.png    #代码Debug
header-img: img/post-bg-desk.jpg    #古老打字机
header-img: img/post-bg-digital-native.jpg    #小孩拿手机
header-img: img/post-bg-e2e-ux.jpg    #多媒体教育
header-img: img/post-bg-github-cup.jpg    #Github茶杯
header-img: img/post-bg-hacker.jpg    #黑客加密病毒
header-img: img/post-bg-ios9-web.jpg    #ios9系统手机
header-img: img/post-bg-ios10.jpg    #ios10系统手机
header-img: img/post-bg-ioses.jpg    #Apple家族大集合
header-img: img/post-bg-iWatch.jpg    #iwatch手表
header-img: img/post-bg-js-version.jpg    #JS图标
header-img: img/post-bg-keybord.jpg    #键盘
header-img: img/post-bg-kuaidi.jpg    #快递
header-img: img/post-bg-map.jpg    #建筑工程图纸
header-img: img/post-bg-miui6.jpg    #MIUI6桌面壁纸
header-img: img/post-bg-miui-ux.jpg    #MIUI系统
header-img: img/post-bg-mma-0.png    #拳击
header-img: img/post-bg-mma-1.jpg    #拳击
header-img: img/post-bg-mma-2.jpg    #拳击
header-img: img/post-bg-mma-3.jpg    #拳击
header-img: img/post-bg-mma-4.jpg    #拳击
header-img: img/post-bg-mma-5.jpg    #拳击
header-img: img/post-bg-mma-6.jpg    #拳击
header-img: img/post-bg-os-metro.jpg    #地球网络连接图
header-img: img/post-bg-re-vs-ng2.jpg    #冰与火之歌
header-img: img/post-bg-rwd.jpg    #ipad和MAC
header-img: img/post-bg-swift.jpg    #美女
header-img: img/post-bg-swift2.jpg    #美女
header-img: img/post-bg-universe.jpg    #宇宙黑洞
header-img: img/post-bg-unix-linux.jpg    #Linux
header-img: img/post-bg-YesOrNo.jpg    #支持和反对
header-img: img/post-sample-image.jpg    #宇航员For Sale
header-img: img/tag-bg.jpg    #模块化手机
header-img: img/tag-bg-o.jpg    #模块背景
```

## 3、插入代码和高亮
### 普通代码高亮  
如果你想要 Jekyll 提供更好的高亮效果，使用连续3个重音符并指明语言的环境来完成高亮。下面用尖号代替重音符作示意：

```
^^^python
a = 2 ** 3
print(a)
^^^
```

效果如下：  

```python
a = 2 ** 3
print(a)
```

### 带 Jekyll 语法的 HTML 代码
本来 Markdown 用来插入 HTML 代码是没有问题的，但是 Jekyll 语法内容直接在文中的任何地方都会被转换，所以也只能借助 Jekyll 语法来解决这一问题。比如，原本的变量：

```
{% raw %}
{{ post.date }}
{% endraw %}
```
实质上在其左侧插入了{ % raw % }，在其右侧插入了{ % endraw % }。**注意，使用时花括号与百分号之间无空格，该段中为不使其转换，添加了空格**。如果你有大段代码需要应用，只需要把它们分别加到整个块的两端即可。

## 4、插入视频  

**注：**不要用`<embed>`，因其需flash支持！  

### 插入优酷视频

```
{% raw %}
<iframe width="650" height="400" src="//player.youku.com/embed/XNDM4MDQ4Nzc0OA==" frameborder="0" allowfullscreen></iframe>
{% endraw %}
```
在优酷视频页面，点击“分享”—>“复制通用代码”（复制得到的代码直接使用无效），把上面的`src=""`替换一下即可，其他不变。

### 插入爱奇异视频

```
{% raw %}
<iframe src="//open.iqiyi.com/developer/player_js/coopPlayerIndex.html?vid=61bf0954c478bf5c9bb227f2d5570f66&tvId=7793487800&accessToken=2.f22860a2479ad60d8da7697274de9346&appKey=3955c3425820435e86d0f4cdfe56f5e7&appId=1368&height=100%&width=100%" frameborder="0" allowfullscreen="true" width="650" height="400"></iframe>
{% endraw %}
```
在爱奇异视频页面，点击“分享”—>复制“通用代码”，把最后的`width="100%" height="100%"`修改为`“width="650" height="400"`，其他不变。