html学习笔记
Html的学习
-------关于我为啥要学html：
web方面很多东西都和html有一定的关系，在杂七杂八看了一堆东西之后，觉得还是要去打好基础，所以就决定去学习html，为以后的各种骚操作打基础
html代码检查网站https://validator.w3.org
在线学习网站http://www.w3school.com.cn
网页模板：
每个网页都包括html，head , title, meta和body元素
<!DOCTYPE html>
<html lang=”en”> lang用于指定文档书面语言的属性
<head> 页头
<title>文件的标题</title>
<meta charset=”utf-8”> meta显示网站特征，比如字符编码等
</head>
<body> 主体部分
文件的主体
</body>
</html>
2.1标题元素：
标题分为h1到h6六级,<h1>最大,<h6>最小。这个标题是放在body内的，用于所写文章的标题。
2.2段落：
<p>和</p>之间的文本形成段落
<br>表示换行（丢在哪都可以）例：<p>这个:<br>是实验</p>
<hr>表示水平标尺（其实就是画一条长直线,一般不用）例：<p></p><hr>
<blockquote>表示块引用元素（其实就是对文本进行缩进）例：<p>你好：</p><blockquote>我是<blockquote>
短语元素指定容器标记之间的文本的上下文与含义（类似于word的加粗，加下划线等功能）详细操作可以百度
有序列表和无序列表和描述列表：
- 有序列表(可以对列表的东西进行排序，但是必须用<ol>,否则就不行)
<ol>
<li>BLUE</li>
<li>red</li>
<li>WHITE</li>
</ol>
- 无序列表（不对列表的元素进行排序，但是前面可以有个小圆点）
用法和有序列表相同，但是无序列表的开头是<ul>
- 描述列表
描述列表以<dl>标记开始，以</dl>结束;每个要描述的语句以<dt>开始
以</dt>结束；每项描述的内容以<dd>标记开始，</dd>结束
例子:
<body>
<h1>Heading level 1</h1>
<dl>
<dt>TCP</dt>
<dd>TCP的内容</dd>
<dt>IP</dt>
<dd>IP的内容</dd>
</dl>
</body>
关于特殊字符
可以参考这个网站http://www.w3school.com.cn/html/html_entities.asp
2.11结构元素：
除了常规性的div元素,html5还引入了许多语义上的结构元素来配置网页区域.
分为
- Div元素
Div元素在网页中创建一个常规结构区域，块元素以<div>开始，以</div>结束
- Header元素
Header元素的作用是包含网页文档或文档区域的标题，以<header>开始，以</header>结束.header通常包含一个或多个标题元素（<h1>到<h6>）
- Nav元素
作用是建立一个导航链接区域。块显示元素，以<nav>开始,以</nav>结束
- Main元素
作用是包含网页文档的主要内容。每个网页只因有一个main，以<main>开始，以</main>结束
- Footer元素
作用是为网页或网页区域创建页脚，以<footer>开始，以</footer>结束
例子：
<!DOCTYPE html>
<html lang="en">
<head>
<title>Trillium Media Design</title>
<meta charset="utf-8">
</head>
<body>
<header>
<h1>Heading level 1</h1>
</header>
<nav> 编码nav元素来包含主导航区域的文本
<b>Home Services Contact</b> b表示加粗
</nav>
<main>
<h2>New Media and Web Design</h2>
<p>Trillium Media Design will bring your company’s Web presence to the next level. We offer a comprehensive range of services.</p>
<h2>Meeting Your Business Needs</h2>
<p>123456789</p>
<div>
<strong>Casita Sedona Bed & Breakfast</strong><br>
612 Tortuga Lane<br>
Sedona, AZ 86336<br>
</div>
</main>
<footer>
<small><i>456789</i></small> i表示斜体
</footer>
</body>
</html>
2.13锚元素：
锚元素的作用是定义超链接，它指向你想显示的一个网页或者文件。锚元素以<a>标记开始，以</a>j结束。两个标记之间是可以点击的链接文本或者图片。用href属性配置链接应用，即要访问（链接到）的文件的名称和位置。
例子：<a href=” https://www.baidu.com/”>baidu</a>(然而用www.baidu.com就不行)
Href=”绝对链接”（绝对链接：协议名称http://和域名）
但是如果要链接到自己网站内部的网页时，可以使用相对链接(这种链接的href值不以http://开头，也不含域名，只需要包含想要显示的网页文件名（或者文件夹和文件名的组合）)
例如：为了从主页index.html链接到同一文件夹下的contact.html，就可以直接<a href=”contact.html”>Contact</a>
新建文件夹保存多个网页
访问的方法
<nav>
<b>
<a href="index.html">Home</a>
<a href="services.html">Services</a>
<a href="contact.html">Contact</a>
</b>
</nav>
电子·邮件链接：
锚标记也可以用于创建电子邮件链接，和外部链接相似但是有两点不同：
- 它使用mailto:,而不是http://
- 它打开浏览器配置的默认邮件程序，将E-mail地址作为收件人
例如，要创建指向help@webdevbasics.net的电子邮件链接，要按如下方法
<a href=”mailto:help@webdevbasics.net”>help@webdevbasics.net</a>
<li>E-mail:
<a href="mailto:contact@trilliummediadesign.com">contact@trilliummediadesign.com</a>
</li>
HTML 参考手册- (HTML5 标准)
关于标签列表
1.按字母顺序排序 https://www.runoob.com/tags/html-reference.html
2.按功能顺序排序https://www.runoob.com/tags/ref-byfunc.html
HTML的基础学习到此结束
