Blogger Information

Blog 13

fans 1

comment 0

visits 9870

Special Recommendation

More>

Related recommendations

插件安装

Markdown语法学习

1、使用 # 标记1-6级标题 = - 可以表示一级和二级标题

一个# 是一级标题

一级标题

我展示一级标题

我展示二级标题

2、Markdown段落

Markdown段落：换行是使用两个以上空格加上回车
baidu.com
google.com

字体

*斜体文本*
_斜体文本_
**粗体文本**
__粗体文本__
***粗斜体文本***
___粗斜体文本___

展示效果：
斜体文本
斜体文本
粗体文本
粗体文本
粗斜体文本
粗斜体文本

分割线

***
* * *
*****
- - -
--------

展示效果：

- - -

删除线~ 在要删除的文字两端加两个~~

~~baidu.com~~

下划线

通过HTML的<u>标签来实现：
<u>带下划线文本</u>

Markdown列表

无序列表使用型号（*）、加号（+）、减号（-）作为列表标记标记后面要加个空格

* 第一项
* 第二项
* 第三项
+ 第一项
+ 第二项
+ 第三项
- 第一项
- 第二项
- 第三项

第一项
第二项
第三项

第一项
第二项
第三项

第一项
第二项
第三项

有序列表使用数字并加上 . 号来表示，如：

第一项
第二项
第三项

列表嵌套

列表嵌套只需在子列表中的选项前面添加四个空格

1.第一项：
    - 第一项嵌套的第一个元素
    - 第一项嵌套的第二个元素
2.第二项：
    - 第二项嵌套的第一个元素
    - 第二项嵌套的第二个元素

反引号`包裹代码
`````` 三个反引号包裹代码块

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body></body>
</html>

链接使用：

链接名称
<链接地址>

表格

|  表头   | 表头  |
|  ----  | ----  |
| 单元格  | 单元格 |
| 单元格  | 单元格 |

表头	表头
单元格	单元格
单元格	单元格

设置对齐方式：

-: 设置内容和标题栏居右对齐。
:- 设置内容和标题栏居左对齐。
:-: 设置内容和标题栏居中对齐。

实现：
| 左对齐 | 右对齐 | 居中对齐 |
| :——-| ——: | :——: |
| 单元格 | 单元格 | 单元格 |
| 单元格 | 单元格 | 单元格 |

Emmet学习

Emmet是一款插件，只要能安装他的编辑器都能使用，大部分编辑器都可以使用该语法规则,我们平时开发的Sublime Text、Eclipse、Notepad++、VS code、Atom、Dreamweaver等等编辑器都可以使用。

1、html初始结构

!+tab键

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body></body>
</html>

html:5

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body></body>
</html>

2、id(#),class(.)

id指令:# ; class指令:.

div#test
<div id="test"></div>
div.test
<div class="test"></div>

3、子节点（>）,兄弟节点（+），上级节点（^）

div>ul>li>p

<div>
      <ul>
          <li>
              <p></p>
          </li>
      </ul>
  </div>

div+ul+p
```
<div></div>
<ul></ul>
<p></p>
```

div>ul>li^div

<div>
      <ul>
          <li></li>
      </ul>
      <div></div>
  </div>

重复（*）

div5(号后面添加数字表示重复的元素个数)

  <div></div>
  <div></div>
  <div></div>
  <div></div>
  <div></div>

分组(())

div>(ul>li>a)+div>p

<div>
      <ul>
          <li><a href=""></a></li>
      </ul>
      <div>
          <p></p>
      </div>
  </div>

属性（[attr]） —-id class的属性

a[href=’###’ name=’xiaoA’]
<a href="###" name="xiaoA"></a>
编号（$）
ul>li.test$3 ($代表一位数，后面跟上数字就代表从1递增到填写的数字)
```
<ul>
      <li class="test1"></li>
      <li class="test2"></li>
      <li class="test3"></li>
  </ul>
```
隐式标签
例如.test
<div class="test"></div>

ul>.test$*3

<ul>
      <li class="test1"></li>
      <li class="test2"></li>
      <li class="test3"></li>
  </ul>

隐私标签有如下几个：

li：用于 ul 和 ol 中
tr：用于 table、tbody、thead 和 tfoot 中
td：用于 tr 中
option：用于 select 和 optgroup 中

Statement of this Website

The copyright of this blog article belongs to the blogger. Please specify the address when reprinting! If there is any infringement or violation of the law, please contact admin@php.cn Report processing!

All comments Speak rationally on civilized internet, please comply with News Comment Service Agreement

0 comments

Author's latest blog post

第一节课作业

2021-03-19 14:29:12