HTML5基础

2023-10-03 17:29:16

HTML实例

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>我的第一个HTML</title>
</head>
<body>
    <h1>我的第一个标题</h1>
    <p>我的第一个段落。</p>
</body>
</html>

<!DOCTYPE html> 声明为 HTML5 文档
<html> 元素是 HTML 页面的根元素
<head> 元素包含了文档的元（meta）数据，如定义网页编码格式为 utf-8。
<title> 元素描述了文档的标题
<body> 元素包含了可见的页面内容
<h1> 元素定义一个大标题
<p> 元素定义一个段落
  空格

HTML 常用元素

<p>这是第一个段落。</p> 建立一个段落
<a href="http://www.baidu.com">这是一个链接</a> 建立一个超链接
<h1>这是一个标题。</h1> 标题（Heading）是通过 <h1> - <h6> 标签进行定义的。<h1> 定义最大的标题。 <h6> 定义最小的标题。
<hr> 标签在 HTML 页面中创建水平线。
 HTML中的注释
<br> 换行
<pre> 定义预格式文本，也是段落的一种，但可以直接在此标签内进行空格和换行。

HTML文本格式化标签

标签	描述
<b>	加粗字体实例
<em>	定义着重文字实例
<i>	斜体字实例
<small>	定义小号字实例
<strong>	定义加重语气实例
<sub>	定义下标字 _实例
<sup>	定义上标字 ^实例
<ins>	定义插入字
<del>	删除线实例

HTML “计算机输出” 标签

标签	描述
<code>	定义计算机代码

HTML链接

实例

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>test</title> 
</head>
<body>

<a href="https://www.baidu.com/">这是一个链接</a>
<br>
<a href="https://www.baidu.com/" target="_blank" rel="noopener noreferrer">这是通过新建页面打开链接</a>

</body>
</html>

其中 target="_blank" 是新建页面的语法，后面的rel可加可不加（安全起见还是加上比较好）

HTML头部（head）

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

可以添加在头部区域的元素标签为: <title>, <style>, <meta>, <link>, <script>, <noscript> 和 <base>。

码农公寓