2018年7月10日笔记

什么是HTML

HTML 是用来描述网页的一种语言。

HTML 指的是超文本标记语言 (Hyper Text Markup Language)
HTML 不是一种编程语言，而是一种标记语言 (markup language)
标记语言是一套标记标签 (markup tag)
HTML 使用标记标签来描述网页

HTML标签

HTML 标记标签通常被称为 HTML 标签 (HTML tag)。

HTML 标签是由尖括号包围的关键词，比如 <html>
HTML 标签通常是成对出现的，比如 <b> 和 </b>
标签对中的第一个标签是开始标签，第二个标签是结束标签
开始和结束标签也被称为开放标签和闭合标签

HTML文档 = 网页

HTML 文档描述网页
HTML 文档包含 HTML 标签和纯文本
HTML 文档也被称为网页

Web 浏览器的作用是读取 HTML 文档，并以网页的形式显示出它们。浏览器不会显示 HTML 标签，而是使用标签来解释页面的内容

例1:

1 <html>
2 <body>
3 
4 <h1>我的第一个标题</h1>
5 
6 <p>我的第一个段落。</p>
7 
8 </body>
9 </html>

<html> 与 </html> 之间的文本描述网页
<body> 与 </body> 之间的文本是可见的页面内容
<h1> 与 </h1> 之间的文本被显示为标题
<p> 与 </p> 之间的文本被显示为段落

HTML基础

1）HTML 标题（Heading）是通过 <h1> - <h6> 等标签进行定义的

<h1>This is a heading</h1>
<h2>This is a heading</h2>
<h3>This is a heading</h3>

2）HTML 段落是通过 <p> 标签进行定义的

<p>This is a paragraph.</p>
<p>This is another paragraph.</p>

3）HTML 链接是通过 <a> 标签进行定义的

<a href="http://www.w3school.com.cn">This is a link</a>

4）HTML 图像是通过 <img> 标签进行定义的

<img src="w3school.jpg" width="104" height="142" />

HTML元素

HTML 元素指的是从开始标签（start tag）到结束标签（end tag）的所有代码

注释：开始标签常被称为开放标签（opening tag），结束标签常称为闭合标签（closing tag）

元素语法：

HTML 元素以开始标签起始
HTML 元素以结束标签终止
元素的内容是开始标签与结束标签之间的内容
某些 HTML 元素具有空内容（empty content）
空元素在开始标签中进行关闭（以开始标签的结束而结束）
大多数 HTML 元素可拥有属性

空的HTML元素

没有内容的 HTML 元素被称为空元素。空元素是在开始标签中关闭的。

<br> 就是没有关闭标签的空元素（<br> 标签定义换行）。

在 XHTML、XML 以及未来版本的 HTML 中，所有元素都必须被关闭。

在开始标签中添加斜杠，比如 <br />，是关闭空元素的正确方法，HTML、XHTML 和 XML 都接受这种方式。

即使 <br> 在所有浏览器中都是有效的，但使用 <br /> 其实是更长远的保障。

HTML提示：使用小写标签

HTML 标签对大小写不敏感：<P> 等同于 <p>。许多网站都使用大写的 HTML 标签。

W3School 使用的是小写标签，因为万维网联盟（W3C）在 HTML 4 中推荐使用小写，而在未来 (X)HTML 版本中强制使用小写。

HTML属性

HTML 标签可以拥有属性。属性提供了有关 HTML 元素的更多的信息。

属性总是以名称/值对的形式出现，比如：name="value"。

属性总是在 HTML 元素的开始标签中规定。

属性例子 1:

<h1> 定义标题的开始。

<h1 align="center"> 拥有关于对齐方式的附加信息。

属性例子 2:

<body> 定义 HTML 文档的主体。

<body bgcolor="yellow"> 拥有关于背景颜色的附加信息。

属性例子 3:

<table> 定义 HTML 表格。（您将在稍后的章节学习到更多有关 HTML 表格的内容）

<table border="1"> 拥有关于表格边框的附加信息。

始终为属性值加引号

属性值应该始终被包括在引号内。双引号是最常用的，不过使用单引号也没有问题。

在某些个别的情况下，比如属性值本身就含有双引号，那么您必须使用单引号，例如：

name='Bill "HelloWorld" Gates'

标签	描述
<html>	定义 HTML 文档。
<body>	定义文档的主体。
<h1> to <h6>	定义 HTML 标题
<hr>	定义水平线。
<!-->	定义注释。

<p>	定义段落。
<br />	插入单个折行（换行）。

文本格式化标签

标签	描述
<b>	定义粗体文本。
<big>	定义大号字。
<em>	定义着重文字。
<i>	定义斜体字。
<small>	定义小号字。
<strong>	定义加重语气。
<sub>	定义下标字。
<sup>	定义上标字。
<ins>	定义插入字。
<del>	定义删除字。
<s>	不赞成使用。使用 <del> 代替。
<strike>	不赞成使用。使用 <del> 代替。
<u>	不赞成使用。使用样式（style）代替。

“计算机输出”标签

标签	描述
<code>	定义计算机代码。
<kbd>	定义键盘码。
<samp>	定义计算机代码样本。
<tt>	定义打字机代码。
<var>	定义变量。
<pre>	定义预格式文本。
<listing>	不赞成使用。使用 <pre> 代替。
<plaintext>	不赞成使用。使用 <pre> 代替。
<xmp>	不赞成使用。使用 <pre> 代替。

引用和术语定义

标签	描述
<abbr>	定义缩写。
<acronym>	定义首字母缩写。
<address>	定义地址。
<bdo>	定义文字方向。
<blockquote>	定义长的引用。
<q>	定义短的引用语。
<cite>	定义引用、引证。
<dfn>	定义一个定义项目。

例2:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<h1>标题1</h1>
<h2>标题2</h2>
<h3>标题3</h3>
<h4>标题4</h4>
<h5>标题5</h5>
<h6>标题6</h6>

<p>&nbsp;&nbsp;&nbsp;&nbsp;正文了就爱了<b>圣诞节</b>发啦书店嘉峰拉<span>ss</span> <br />
    三等奖放辣椒水电费拉萨的解放路京东方阿斯顿就阿斯顿龙卷风阿斯蒂芬></p>
<strong>加粗</strong>

&gt;
&lt;
&quot;
&amp;
<br />
<font size="16pt;" color="red" face="黑体">字体</font>
</body>
</html>

例3:

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>Title</title>
 6 </head>
 7 
 8 
 9 <a href="#saltstack" target="_blank">京东</a>
10 <p>阅读数：5459
11 之前使用puppet，各种笨重、各种不爽；之后有看过chef、ansible等，一直没啥兴趣；后面发现了saltstack后，一见钟情。
12 
13 优点：
14 
15 首先，他速度快，基于消息队列+线程，跑完多台设备，都是毫秒级别的
16 其次，非常灵活，源码是python，方便理解和自定义模块（python 语言相对于其他的perl、ruby等还是很好理解的）
17 命令简单，功能强大
18 一、salt-master的安装
19 centos、redhat等系统的安装：
20 
21 现在centos下的yum源内有最新的salt-master源码包，安装的话，直接
22 yum install salt-master -y #服务端
23 yum install salt-minion -y #客户端
24 ubuntu下的安装:
25 
26 13.04的软件源收录有salt，版本比较老0.12.0版本。但是13.04以下的版本并没有收录，需要添加PPA源
27 sudo apt-get install salt-master #服务端
28 sudo apt-get install salt-minion #客户端
29 13.04以下的版本，需要手工添加ppa源，才可以用包管理器安装saltstack:
30 
31 sudo apt-get install python-software-properties
32 echo deb http://ppa.launchpad.net/saltstack/salt/ubuntu `lsb_release -sc` main | sudo tee
33 /etc/apt/sources.list.d/saltstack.list
34 wget -q -O- "http://keyserver.ubuntu.com:11371/pks/lookup?op=get&amp;search=0x4759FA960E27C0A6" |sudo apt-key add -
35 sudo apt-get update
36 sudo apt-get install salt-master
37 sudo apt-get install salt-minion
38 二、配置
39 server端的配置：vim /etc/salt/master (master的配置文件时默认在这条目录下面的)
40 
41 user: root
42 auto_accept: True #自动接收minion端的key并验证
43 /etc/init.d/salt-master restart
44 minion端的配置: vim /etc/salt/minion (minion配置文件的默认路径)
45 
46 master: salt (这里填写的是服务端的hostname，我的server名字就是salt)
47 /etc/init.d/salt-minion restart
48 salt minion和master的认证过程：
49 
50 minion在第一次启动时，会在/etc/salt/pki/minion/下自动生成minion.pem(private key), minion.pub(public key)，然后将minion.pub发送给master
51 master在接收到minion的public key后，通过salt-key命令accept minion public key，这样在master的/etc/salt/pki/master/minions下的将会存放以minion id命名的public key, 然后master就能对minion发送指令了
52 
53 来到master端:
54 
55 #salt-key -L # 验证minion的key是否接收
56 Accepted Keys:
57 sa10-007
58 Unaccepted Keys:
59 Rejected Keys:
60 可以发现，是正常接收到minion端(sa10-007)的key；这里的自动接收起源于上文提到的auto_accept: True这个参数，这个参数开启，表示只要有minion起来就会自动被salt的server端所接收
61 
62 salt-key的基本命令：
63 
64 salt-key -L #检测当前server端所有minion端key的情况，三种：接收、等待接收和拒绝
65 salt-key -a hostname #指定接收某台minion的key
66 salt-key -A #接收Unaccepted Keys下所有的minion
67 salt-key -d hostname #删除已经接收的机器中指定机器minion key (Accepted Keys:)
68 salt-key -D #删除已经接收的所有机器(Accepted Keys:)
69 验证server和minion的通信（server端进行）：
70 
71 #salt '*' test.ping
72 sa10-007:
73  True
74     可以发现，>server端和minion端是可以正常通信的，至此，saltstack的master和minion正常安装以及配置完成
75 
76   文章标签： 自动化 运维 <a name="saltstack">saltstack</a></p>
77 </body>
78 </html>

例4:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>

<img src="test.jpg" alt="妹子" width="800" height="1000">
</body>
</html>