目录
- HTML简介及语法规范
- 最基本标签及基本格式
- 常用标签
- 实体(转义字符)
1.HTML简介及语法规范
- HTML代表超文本标记语言,用于创建网页的结构和内容。
- HTML中不区分大小写,但是我们一般都是用小写。
- HTML中的注释不能嵌套。
- 大多数 HTML 标签包含开始和结束标记,它们之间带有原始文本或其他 HTML 标记。
- HTML 元素可以嵌套在其他元素中,但是不能交叉嵌套。封闭元素是封闭父元素的子元素。
- HTML标签中的属性必须有值,且值必须加引号(双引号单引号都可以)。
2.最基本标签及基本格式
(*点击超链接可查看详情)
<html></html>— <html> 元素。该元素包含整个页面的内容,也称作根元素。<head></head>— <head> 元素。该元素的内容对用户不可见,其中包含例如面向搜索引擎的 搜索关键字(keywords)、页面描述、CSS 样式表和字符编码声明等。<meta>—<meta>文档级元数据元素主要作用:1.设置字符集 2.设置网页关键字 3.对网页进行重定向 4.设置对网页的描述性文字<meta charset="utf-8"> <!-- Redirect page after 3 seconds --> <meta http-equiv="refresh" content="3;url=https://www.mozilla.org"> <meta name="keywords" content="HTML"><meta charset="utf-8">— 该元素指定文档使用 UTF-8 字符编码 ,UTF-8 包括绝大多数人类已知语言的字符。基本上 UTF-8 可以处理任何文本内容,还可以避免以后出现某些问题,没有理由再选用其他编码。解决乱码问题!<title></title>— <title> 元素。该元素设置页面的标题,显示在浏览器标签页上,也作为收藏网页的描述文字。<body></body>— <body> 元素。该元素包含期望让用户在访问页面时看到的内容,包括文本、图像、视频、游戏、可播放的音轨或其他内容。即任何可见的内容都应该放在开始和结束<body>标签内。<a></a>—<a> a 是 "anchor" (锚),可用于添加超链接(外部网站、内部页面)。用法示例如下,href代表超文本引用( hypertext reference)<a href="https://www.mozilla.org/zh-CN/about/manifesto/">Mozilla 宣言</a>target属性:指定超链接打开的位置。可选值:1 _self 默认值,在当前页面打开 2 _blank 在新标签页打开<a href="<a> - HTML(超文本标记语言) | MDN (mozilla.org)" target="_black"></a>
href="#id"(唯一id)跳转到id内容处
href="javascript:;" 不过点击后什么也不会发生
基本格式
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>测试页面</title>
</head>
<body>
<img src="images/firefox-icon.png" alt="测试图片">
</body>
</html>
3.常用标签
<h1></h1>到<h6></h6>标题和子标题,用于为内容部分提供标题。<p></p><span></span>和<div></div>标签指定文本或块。- 和
<em></em>标签<strong></strong>用于强调文本。 <br>创建换行符。<ul></ul>—无序列表(Unordered List)<ol></ol>—有序列表(Ordered List)-
<li></li>—列表的每个项目用一个列表项目(List Item)元素 <li> 包围 - 图像 (
<img>) 视频 ( <video>)音频(<audio>)可以通过链接到现有源来添加。
表格入门
<table>元素创建一个表格。- 表格可以分为三个主要部分:标题、正文和页脚。
<thead>创建表头,<tbody>创建表格的主体,<tfoot>创建表格的页脚。 <tr>将行添加到表中。<td>将数据添加到行中。- 表标题阐明了数据的含义。标题与
<th>元素一起添加。 colspan表数据可以使用该属性跨越列。rowspan表数据可以使用该属性跨越行。
表单入门
<form>允许用户输入信息并发送。-
<form> saction属性决定了表单信息的去向,method属性决定了信息的发送和处理方式。 - 要为用户添加字段以输入信息,我们使用
<input>元素并将type属性设置为我们选择的字段:- 设置
type为"text"为文本输入创建单行字段。 - 设置
type为"password"创建审查文本输入的单行字段。 - 设置
type为"number"为数字输入创建单行字段。 - 设置
type为"range"创建一个滑块以从一系列数字中进行选择。 - 设置
type为"checkbox"创建一个可以与其他复选框配对的复选框。 - 设置
type为"radio"创建一个可以与其他单选按钮配对的单选按钮。 - 如果两者相同,则设置
type为"list"将<input>与<datalist>元素配对。id - 设置
type为"submit"创建提交按钮。
- 设置
<select>元素填充有元素<option>并呈现下拉列表选择。- 元素由
<datalist>元素填充<option>并与 an 一起使用<input>以搜索选项。 <textarea>元素是具有可自定义区域的文本输入字段。- 提交
<form>时,接受输入的字段的名称和这些字段的值将作为 name=value 对发送
内联框架(<iframe>)
<iframe></iframe>
用于向当前页面引入一个其他页面 src指定要引入的网页路径 frameborder指定内联框架边框
4.实体
语法 :&实体的名字 ;
- 空格
- 大于号 >
- 小于号 <
- 版权符号 ©
更多
ps:学习资源【尚硅谷】Web前端零基础入门HTML5+CSS3基础教程 MDN Web Docs










