zoukankan      html  css  js  c++  java
  • markdown 常用语法总结

    这里并不是要总结所有的 markdown 语法,只是总结笔者自己撰写博客时常用的一些 markdown 语法。


    1 图片设置

    1.1 设置图片位置

    利用markdown在编写文档时插入图片是默认靠左,有些时候将图片设置为居中时可以更加的美观,这时就需要在图片的信息前边添加如下程序(注意: <div align=xx> 前要有至少一个空格,否则图片不会显示出来):

     <div align=center>![这里写图片描述](http:...)</div>
    
    ![](https://img2018.cnblogs.com/blog/1075214/201812/1075214-20181214153131030-1792088028.png)

    如果想将图片位于右侧,只需要将center改为right :

     <div align=right>![这里写图片描述](http:...)</div>
    
    ![](https://img2018.cnblogs.com/blog/1075214/201812/1075214-20181214153131030-1792088028.png)

    1.2 设置图片大小

    在图片的最后添加 width = “100” height = “100”,就可以设置图片的大小。也可以在后边输入百分比为多少,如 width = 20% height = 20%

     <img src="http:..."   width = "100" height = "100" /></div>
    

    也可以在后边输入百分比为多少,如 width = 50% height = 50%

    <img src="http:..." width = 50% height = 50% /></div>
    

    1.3 添加图片题注

    如果想对图片添加题注,那么代码更改如下:

     <div align=center>![这里写图片描述](http:...)
    题注内容 </div>
    
    ![](https://img2018.cnblogs.com/blog/1075214/201812/1075214-20181214153131030-1792088028.png) 1-1 图片题注

    2 文字设置

    2.1 设置文字居中

    (1)示例如下:

    <p align="center">你的名字</p>
    

    (2)效果如下:

    你的名字


    2.2 设置文字颜色

    (1)示例如下:

    <span style="color:#0000FF">蓝色文字</span>
    

    (2)效果如下:

          蓝色文字

    颜色代码采用的是RGB格式, 这里有个对照 ,可以选择你想要的颜色对应的RGB值。

    size为1

    2.3 设置文字大小

    (1)示例如下:

    <span style="font-size:15px;">size为15px</span>
    <span style="font-size:25px;">size为25px</span>
    <span style="font-size:35px;">size为35px</span>
    

    (2)效果如下:

    size为15px
    size为25px
    size为35px

    2.4 设置文字字体

    (1)示例如下:

    <font face="黑体">我是黑体字</font>
    <font face="宋体">我是宋体字</font>
    <font face="微软雅黑">我是微软雅黑字</font>
    <font face="fantasy">我是fantasy字</font>
    
    

    (2)效果如下:

    我是黑体字
    我是宋体字
    我是微软雅黑字
    我是fantasy字


    2.5 设置文字背景色

    (1)示例如下:

    <table><td bgcolor=#c2c2c2>
    背景色的设置是按照十六进制颜色值:#FF83FA<br />
    这是第二行
    </td></table>
    
    

    (2)效果如下:

    背景色的设置是按照十六进制颜色值:#FF83FA
    这是第二行

    (3)解读如下:

    • <td>标签的bgcolor属性用于设置单元格的背景颜色。
    • 虽然<td>标签的bgcolor属性已被弃用,但所有主流浏览器仍然支持它。

    3 换行、缩进

    3.1 换行

    方法1: 连续两个以上空格+回车

    方法2:使用HTML语言换行标签:

    3.2 缩进

    首行缩进两个字符:(每个表示一个空格,连续使用两个即可)

    &ensp; 半角的空格
    &emsp; 全角的空格


    4 折叠语法

    主要使用的是 html5details标签。

    (1)示例如下:

    <details>
      <summary>折叠文本</summary>
      此处可书写文本
      嗯,是可以书写文本的
    </details>
    
    
    <details>
      <summary>折叠代码块</summary>
      <pre><code> 
         System.out.println("虽然可以折叠代码块");
         System.out.println("但是代码无法高亮");
      </code></pre>
    </details>
    
    <details>
      <summary>折叠代码块</summary>
      <pre><blockcode> 
         System.out.println("虽然可以折叠代码块");
         System.out.println("但是代码无法高亮");
      </blockcode></pre>
    </details>
    
    

    (2)效果如下:

    折叠文本 此处可书写文本 嗯,是可以书写文本的
    折叠代码块
     
         System.out.println("虽然可以折叠代码块");
         System.out.println("但是代码无法高亮");
      
    折叠代码块
     
         System.out.println("虽然可以折叠代码块");
         System.out.println("但是代码无法高亮");
      

    (3)解读如下:

    • details:折叠语法标签
    • summary:折叠语法展示的摘要
    • pre:以原有格式显示元素内的文字是已经格式化的文本
    • code:指定代码块
    • blockcode:指定代码块

    参考**

    1. 【MarkDown】使用Html样式和折叠语法
    2. 让你的md文档可折叠化展示 #155
  • 相关阅读:
    菜根谭#39
    菜根谭#38
    菜根谭#37
    菜根谭#36
    菜根谭#35
    菜根谭#34
    菜根谭#33
    菜根谭#32
    mysqli的使用
    mysql常用修改创建语句
  • 原文地址:https://www.cnblogs.com/linuxAndMcu/p/10119632.html
Copyright © 2011-2022 走看看