③HTML(1)_通过删除注释来让页面上的h1元素是可见的.-CSDN博客

本文链接：https://blog.csdn.net/jh_5935/article/details/80302538

- - 1. HTML概念
  - 2. HTML简介

1. HTML概念

超文本标记语言（英语：HyperText Markup Language，简称：HTML）是一种用于创建网页的标准标记语言。可以使用 HTML 来建立自己的 WEB 站点，HTML 运行在浏览器上，由浏览器来解析。
w3c组织：万维网联盟。w3c制定了一些列的web相关规范（css,js,xml）。其中包括html。
注意：
(1) 对于中文网页需要使用声明编码，否则会出现乱码。有些浏览器会设置 GBK 为默认编码，则你需要设置为。
(2)HTML中不支持空格、回车、制表符，它们都会被解析成一个空白字符。
(3)不区分大小写(尽量小写)

html文档的后缀名
- .htm
- .html
  
  文本： txt中的内容？没有任何格式的普通的文字信息。普通的字符串。
  超文本：在html中，通过标记（标签）把文本进行标记，它所展现出来的内容，不在仅仅是文本。可以有，图片，音频，超链接。
  标记：标签。<标签名> ——标签名是w3c组织定义好的。而我们学习html，就是学习w3c已经定义好的标签。html就是由一系列的标签做组成的。浏览器会把不同的标签（标签名不同的）显示出不同的效果。

HTML文档的编写方法：

- 手工直接编写记事本等，存成.htm .html格式
- 使用可视化HTML编辑器Frontpage、Dreamweaver等-
- 由Web 服务器（或称HTTP 服务器）一方实时动态地生成。

HTML 提示 - 如何查看源代码
你是否看过一些网页然后惊叹它是如何实现的的。
如果您想找到其中的奥秘，只需要单击右键，然后选择”查看源文件”（IE）或”查看页面源代码”（Firefox），其他浏览器的做法也是类似的。这么做会打开一个包含页面 HTML 代码的窗口。

2. HTML简介

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>小霍霍的JavaWeb学习之旅</title>
</head>

<body>
<h1>我的第一个标题</h1>
<p>我的第一个段落。</p>

</body>
</html>
<!--
<!DOCTYPE html> 声明为 HTML文档
<html> 元素是 HTML 页面的根元素
<head> 元素包含了文档的元（meta）数据,不作为浏览器显示的内容
<title> 元素描述了文档的标题
<body> 元素包含了可见的页面内容
<h1> 元素定义一个大标题
<p> 元素定义一个段落
-->

2.1 HTML 标题

HTML 标题（Heading）是通过<h1> - <h6> 标签来定义的.
<h1>这是一个标题</h1>
<h2>这是一个标题</h2>
<h3>这是一个标题</h3>

2.2 HTML 段落

--HTML 段落是通过标签 <p> 来定义的.
<p>这是一个段落。</p>
<p>这是另外一个段落。</p>

2.3 HTML 链接

--HTML 链接是通过标签 <a> 来定义的.
<a href="http://www.runoob.com">这是一个链接</a>
- -target 属性可以定义被链接的文档在何处显示。
<a href="https://blog.csdn.net/jh_5935/" target="_blank">访问小霍霍的博客!</a>
-- id 属性可用于创建在一个HTML文档书签标记。
<a id="tips">有用的提示部分</a>
--在HTML文档中创建一个链接到"有用的提示部分(id="tips"）"：
<a href="#tips">访问有用的提示部分</a>

2.4 HTML 图像

--HTML 图像是通过标签 <img> 来定义的.
--<img> 是空标签，意思是说，它只包含属性，并且没有闭合标签。
<img src="/images/logo.png" width="258" height="39" />
--Alt属性，alt 属性用来为图像定义一串预备的可替换的文本。
<img src="boat.gif" alt="Big Boat">
--在浏览器无法载入图像时，替换文本属性告诉读者她们失去的信息。此时，浏览器将显示这个替代性的文本而不是图像。
--为页面上的图像都加上替换文本属性是个好习惯，这样有助于更好的显示信息，并且对于那些使用纯文本浏览器的人来说是非常有用的。

–创建图像映射

<img src="planets.gif" width="145" height="126" style="float:left" alt="Planets" usemap="#planetmap">
<map name="planetmap">
  <area shape="rect" coords="0,0,82,126" alt="Sun" href="sun.htm">
  <area shape="circle" coords="90,58,3" alt="Mercury" href="mercur.htm">
  <area shape="circle" coords="124,58,8" alt="Venus" href="venus.htm">
</map>

2.5 HTML属性

--属性总是以名称/值对的形式出现，比如：name="value"
--双引号是最常用的，不过使用单引号也没有问题。
HTML 链接由 <a> 标签定义。链接的地址在 href 属性中指定：
<a href="http://www.runoob.com">这是一个链接</a>

常用属性：
这里写图片描述

2.6 HTML水平线

<hr> 标签在 HTML 页面中创建水平线。
hr 元素可用于分隔内容。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)</title>
</head>
<body>
    <p>hr 标签定义水平线：</p>
    <hr />
    <p>这是段落。</p>
    <hr />
    <p>这是段落。</p>
</body>
</html>

这里写图片描述

2.7 HTML注释

可以将注释插入 HTML 代码中，这样可以提高其可读性，使代码更易被人理解。
浏览器会忽略注释，也不会显示它们。注释写法如下:
<!-- 这是一个注释 -->

2.8 HTML折行

如果您希望在不产生一个新段落的情况下进行换行（新行），请使用 <br /> 标签：
<p>这个<br>段落<br>演示了分行的效果</p>

2.9 HTML文本格式

这里写图片描述

--HTML 使用标签 <b>("bold") 与 <i>("italic") 对输出的文本进行格式, 如：粗体 or 斜体
--通常标签 <strong> 替换加粗标签 <b> 来使用, <em> 替换 <i>标签使用。
<b>这个文本是加粗的</b>
<strong>这个文本是加粗的</strong>
<big>这个文本字体放大</big>
<em>这个文本是斜体的</em>
<i>这个文本是斜体的</i>
<small>这个文本是缩小的</small>
<var>计算机变量</var>

–地址：

<address>
Written by <a href="mailto:webmaster@example.com">Jon Doe</a>.<br> 
Visit us at:<br>
Example.com<br>
Box 564, Disneyland<br>
USA
</address>

–缩写和首字母缩写，在某些浏览器中，当您把鼠标移至缩略词语上时，title 可用于展示表达的完整版本：

<abbr title="etcetera">etc.</abbr>
<br />
<acronym title="World Wide Web">WWW</acronym>

<p><bdo dir="rtl">该段落文字从右到左显示。</bdo></p>

–此例演示如何标记删除文本和插入文本：

<p>My favorite color is <del>blue</del> <ins>red</ins>!</p>

2.10 HTML 头

--<head> 元素包含了所有的头部标签元素。在 <head>元素中你可以插入脚本（scripts）, 样式文件（CSS），及各种meta信息。

--可以添加在头部区域的元素标签为: <title>, <style>, <meta>, <link>, <script>, <noscript>, and <base>.
--<base> 标签描述了基本的链接地址/链接目标，该标签作为HTML文档中所有的链接标签的默认链接:
<base href="http://www.runoob.com/images/" target="_blank">
--<style> 标签定义了HTML文档的样式文件引用地址.
<style type="text/css">
body {background-color:yellow}
p {color:blue}
</style>

meta标签描述了一些基本的元数据。

--<meta> 元素
<meta> 标签提供了元数据.元数据也不显示在页面上，但会被浏览器解析。
META 元素通常用于指定网页的描述，关键词，文件的最后修改时间，作者，和其他元数据。
元数据可以使用于浏览器（如何显示内容或重新加载页面），搜索引擎（关键词），或其他Web服务。

- -为搜索引擎定义关键词:

<meta name="keywords" content="HTML, CSS, XML, XHTML, JavaScript">

为网页定义描述内容:

meta name="description" content="免费 Web & 编程 教程">

定义网页作者:

<meta name="author" content="Runoob">

每30秒钟刷新当前页面:

<meta http-equiv="refresh" content="30">

<script> 元素
<script>标签用于加载脚本文件，如： JavaScript。

未完，续集请见- - -(https://blog.csdn.net/jh_5935/article/details/80303335)