0x01 HTML快速入门

最新推荐文章于 2024-10-17 15:53:46 发布

Nefu_qky

最新推荐文章于 2024-10-17 15:53:46 发布

阅读量1k

点赞数 1

分类专栏： Web开发文章标签： html 前端

本文链接：https://blog.csdn.net/Qiuker_jl/article/details/121891264

版权

Web开发专栏收录该内容

3 篇文章 0 订阅

订阅专栏

一.HTML简介

1.基本概念

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

HTML： Hyper Text Markup Language，超文本（包括文字、图片、音频、视频等等）标记语言
HTML 不是一种编程语言，而是一种标记语言，即由一套标记标签（markup tag）组成的语言。
浏览器都支持HTML语言，可以将HTML语言所编写的文档渲染成可听、可视的网站

标记语言是不涉及逻辑判断的语言，就比如markdown也是一种标记语言。因此HTML非常容易学习。

当访问网站时，实际获得的其实是一份由文本构成的HTML文档，Web浏览器可以读取HTML文档，并将其渲染成网页。例：你在浏览器的地址栏中输入了知乎的网址zhihu.com，知乎的服务器在得知了你的请求后会发送一份HTML文档给你的电脑，而你的浏览器将这份HTML文档翻译成了网页。

注：一份网页的组成其实还包括样式表文件（Css）和脚本文件（Js）

2.HTML标签

HTML标签是HTML语言中最基本的单位:

标签由尖括号<>和关键字组成，如<html>
标签的书写与字母的大小写无关，如<body>等价于<bODy>
标签通常成对出现，比如<head> 和 </head>，前者为开始（开放）标签，后者为结束（关闭）标签
少数标签没有闭合标签，如<img>

开始标签和结束标签间往往是一段文本，例：

<h1>我是标题</h1>

它的效果是在页面中出现一个一级标题

在这里插入图片描述

如果我们修改这段文本的内容，比如说：

<h1>换一个标题</h1>

在这里插入图片描述

虽然标题名字变换了，但它还是一个标题。

因此我们可以这么理解：标签用于告诉浏览器，我们需要呈现的是什么元素，而这个元素的具体内容则由标签间的文本决定。

开始标签和结束标签间也可以存放其他的标签，例：

<p>
	<h1>我是标题</h1>
	我是一段普通的文本
</p>

<h1>标签表示标题，而<p>标签表示一个段落，它的效果是这样的：

在这里插入图片描述

3.HTML骨架

一份HTML文档的基本骨架如下：

<!DOCTYPE html>    <!--位于文档最前面，向浏览器说明当前.当前文件使用的是哪种标准规范-->
<html>             <!--文档的开始点-->
<head>             <!--文档的头部-->

</head>            

<body>             <!--文档的主体-->

</body>
</html>            <!--文档的结束点-->

<!DOCTYPE html> 用于向浏览器说明，我这份文件是什么类型的文档

注：不加也没关系，因为所有浏览器都默认文档是用HTML语言写的
<html>与</html> 是最外层的标签，标签之间的文本描述网页
<head>与<head>之间的文本描述了文档的各种属性和信息，如网页的标题、样式表所在路径等等，绝大部分在加载成网页后是不可见的
<body> 与</body>之间的文本描述可见的网页内容

4.环境准备

一个好用的浏览器：如 Google Chrome，自带的开发者模式（按F12）对网页调试很有帮助
一个好用的文本编辑器：个人用的是Sublime Text，比较轻量的一个文本编辑器；因为HTML是文本标记语言，所以只需要一个文本编辑器就能学习了（甚至用windows自带的记事本也可以）

如果在网上看到别的网页，想知道是怎么实现的，只需要右键查看网页源代码即可

5.网页的创建

在编写好HTML文档后，将其加载成网页的步骤如下：

编写HTML代码，比如一句简单的Hello World！
将文件后缀名改为.html (.htm也是可以的)

在这里插入图片描述

用任意一个浏览器打开该文件
完成

观察浏览器的地址栏，发现就是html文件所在的路径：

浏览器是一个能将html文件翻译成网页的软件
当我们在地址栏中输入网址时，浏览器能帮我们去向对应的服务器请求 html 文档
当我们在地址栏中输入本地文件的路径时，浏览器能帮我们将html 文档翻译成网页

二.网页基本标签

HTML是由标签所组成的语言，所以先来熟悉一些最基本的标签

1.注释标签

注释是给自己或其他开发者看的，目的是增强代码的可读性。故注释标签的内容是不会在网页上呈现出来的

格式：

多行注释:

<!--
注释
注释
注释
-->

2.标题标签

标题是通过<h1> - <h6> 等标签进行定义的：

h即heading的缩写
<h1>表示一级标签，<h2>表示二级标签，以此类推，最多有六级标签
格式为：<h1> 标题内容 </h1>

tips：标题是很重要的，虽然本质和加粗加大的文本没区别，但搜索引擎会根据标题来为网页编制索引

<body>
	<h1>一级标题</h1>
	<h2>二级标题</h2>
	<h3>三级标题</h3>
	<h6>六级标题</h6>
</body>

效果如下：
在这里插入图片描述

3.段落标签

段落是通过 <p>标签进行定义的：

p为paragraph的缩写
段落标签实现的是文字的分段，当文字内容超过浏览器宽度后会换行
格式为：<p> 段落内容 </p>

<body>
	Hello 
	world!
	<p>a paragraph</p>
	<p>another paragraph</p>
</body>

效果如下：

在这里插入图片描述

上例中，即便在代码中Hello 和 world！在不同行，但加载成网页后还是在一行的

当显示页面时，浏览器会移除源代码中多余的空格和空行，所有连续的空格或空行都会被算作一个空格。所以需要通过标签来实现换行、分段

4.换行标签

换行是通过标签<br>来定义的：

换行标签是一个单标签（自闭合标签），作用是输出换行符
注意换行和分段的区别，分段的间隙比换行要大很多
格式：<br> 或 <br/>

<body>
	Hello<br> 
	world!<br/>
	!<br><br><br>	
	hhhh
</body>

效果如下：

在这里插入图片描述

<br>标签没有结束标签，所以是单标签

可以将标签理解为容器，在开始标签和结束标签间存放内容。而换行则不需要存放啥，所以没有闭合标签。当然也可以将其写为<br/>，后面的/相当于闭合了

5.水平线标签

水平线是通过标签<hr>来定义的：

水平线标签也是一个自闭合标签，作用是输出水平线、分隔内容
水平线的长度可以随浏览器宽度的变化而变化
格式：<hr> 或 <hr/>

<body>
	<h1>Title</h1>   <!--标题-->
	<hr>    <!--水平线-->
	<p> This is paragraph 1</p> <!--段落-->
	<hr/>   <!--水平线-->
</body>

效果如下：

在这里插入图片描述

6.粗体斜体标签

粗体通过<strong>标签定义，斜体通过<em>标签定义

粗体标签格式： <strong>文字内容 </strong>
斜体标签格式： <em> 文字内容 </em>

<body>
	<h1>字体样式演示</h1>   <!--标题-->
	<hr/>
	正常：I love you <br>
	粗体：<strong>I love you</strong><br>
	斜体：<em>I love you</em><br>
	粗体+斜体：<strong><em>I love you</em></strong>
</body>

效果如下：

在这里插入图片描述

三.基本知识

1.元素

**HTML元素：**从开始标签到对应结束标签的所有代码

开始标签	元素内容	结束标签
<p>	this is a paragraph	</p>

HTML 元素以开始标签起始
HTML 元素以结束标签终止
元素的内容是开始标签与结束标签之间的内容
某些 HTML 元素不具有内容，即空元素（empty content），所以不需要结束标签
大多数 HTML 元素拥有属性
元素内可以包含其他HTML元素（嵌套）

可以将元素想象为容器，<html></html>就是最大的容器

<br>,<hr>等就是空元素，但更好的写法是<br/> <hr />

2.标准流

HTML元素被分为块级元素、行内块元素和行内元素。

块级元素：
- 独占一行，具备宽、高属性
- 可以通过属性来设置元素的宽、高；如果不设置，将由内容决定元素的宽高
- 例：<h1>、<p>、<table> 、<ol>
行内元素：
- 可以和其他元素挤在一行，无法加载宽、高属性
- 元素的高度和宽度直接由内容决定，即便设置了宽、高属性的值也不起作用
- 例：<strong>, <a>，<em>
行内块元素：
- 可以和其他元素挤在一行，且能加载宽、高属性
- 即具备行内元素可以并排显示的特点，又具备块级元素能设置宽、高属性的特点
- 例：<img>、<input>

标准文档流：指的是元素排版布局过程中，行内元素、行内块元素元素会默认从左往右、块级元素默认从上往下的流式排列方式。前面的内容发生变化后，后面的内容位置也会随着发生变化。

HTML的布局还存在以下特点：

底边对齐：同一行（同一个块级元素中）的元素如果高度不一致，底边将对齐显示
自动换行：如果一行展示不下，元素将自动排列到下一行展示

3.属性

属性的作用是为元素提供附加信息

属性以名称/值对的形式出现，比如： name=“value”
属性在 HTML 元素的开始标签中规定。
属性和标签一样，对大小写不敏感，但推荐用小写
属性的值应该放在双引号/单引号内，但如果属性值本身包含双引号则只能放在单引号内

例1：<h1 align=“center”> 标题 </h1> align属性定义了标题的对齐方式：居中排列

例2：<body bgcolor=“yellow”> </body> bgcolor属性定义了网页的背景颜色：黄色

居中排列和背景颜色这两个功能也可以通过样式（CSS）来实现，并且更推荐后者

不同元素具有不同的属性，以下是几乎所有元素都有的属性：

class ：规定元素的类名
id ：规定元素的唯一id
style ：规定元素的行内样式（CSS中再学习）

注：HTML中用于设置样式的属性，包括颜色、文字对齐方式、长、宽等全部建议用CSS语言编写的样式表来实现

4.转义字符

在HTML中，定义转义字符的原因有两个：

一是像“<”和“>”这类符号已经用来表示HTML标签，所以不能直接当作文本中的符号来使用；
二是有些字符在ASCII字符集中没有定义，因此需要使用转义字符串来表示。

注：转义字符需要严格注重大小写的区别

" 对应双引号
& 对应&
< 对应小于符号
> 对应大于符号
  对应一个空格
© 对应版权符号©

在HTML的代码中，换行通过标签<br>实现，空格通过转义字符** **实现

可以发现，特殊符号都是以**&开头，以；**结尾

四.常用标签

注：在实际的网页开发中，因为样式表（CSS）的存在，HTML中的很多标签、属性是不会用的。比如粗体、斜体标签，完全可以用样式表来代替设置字体且更加灵活。

下面要讲的标签中都还算是经常用到的，其他了解即可，在要使用的时候去搜即可。

1.图像标签

在HTML中，插入图片通过<img>标签实现

<img>标签是没有结束标签的
格式：<img src = " " alt= " " >

属性	值	描述
src	网络路径（URL）或本地路径	图像的来源
alt	文本值（Text）	图像的替代文本
height	数值，默认单位为像素	设置图像高度
width	数值，默认单位为像素	设置图像宽度

例：

<body>
	<h1>img标签学习</h1>
	<hr>
	<img src="D:\Note\Picture\Pokemon.jpg"  alt="Pokemon" height=150 width=120>
</body>

效果如下：

在这里插入图片描述

2.链接标签

<a>标签用于定义超链接，从一个页面链接到另一个页面

需要使用闭合标签</a>
格式：<a href=“path” target=”目标窗口“ > 链接描述 </a>
链接描述可以是文本，也可以是一个img标签

属性	值	描述
href	URL（网址或本地路径）	hypertext reference的缩写，用于填写目标页面的链接
target	{_self,_blank,_parent,_top}	规定目标页面在哪个窗口打开

target属性的默认值为_self，即在当前页面打开新的页面
target的值若为_blank，则会创建一个新的页面

简单地说，target属性定义在哪里打开页面，href属性定义打开什么

<h1>链接标签学习</h1>
<hr><br>
	<a href="https://www.baidu.com" target="_blank"> <!--跳转到百度-->
		点击跳转到百度
	</a> 
	<br>
	<a href="web.html">   <!--跳转到本地的一个网页-->
		点击查看大图 
		<img src="D:\Note\Picture\Pokemon.jpg"  alt="美女" height=15 width=12>  <!--点击图片跳转-->
	</a>
</body>

效果如下：

在这里插入图片描述

<a>标签还有另外一种用法，就是跳转到本页面内的某个指定位置，实现类似书签的功能

锚链接：

锚链接用于跳转到页面的指定位置

首先要用一个具备 id 属性的元素来作为锚点，如<p id="top"></p>；

然后在需要跳转的地方，通过href属性来跳转，如<a href="#top">回到顶部</a>

<body>
<h1>链接标签学习</h1>
<hr><br>
	<p id="top"></p>
	<br><br><br><br><br><br><br><br><br><br><br><br>
	<br><br><br><br><br><br><br><br><br><br><br><br>
	<br><br><br><br><br><br><br><br><br><br><br><br>
	<br><br><br><br><br><br><br><br><br><br><br><br>
	<br><br><br><br><br><br><br><br><br><br><br><br>
	<br><br><br><br><br><br><br><br><br><br><br><br>
	<a href="#top">回到顶部</a>
</body>

如果想跳转到其他页面的锚点，也是可以的，如<a href="web.html#top">点击跳转</a>

很多网页的目录就是这么实现的，点击后能跳转到网页中指定的位置

注：原先的html版本中是使用 name 属性作为锚点的，但是在最新的HTML5中 name 属性已经被弃用，只有 <a> 标签仍可以设置 name 属性来作为锚点。

建议使用 id 属性作为锚点

3.列表标签

列表分为有序列表、无序列表、自定义列表

有序列表格式如下:

<ol>
	<li> 列表项1  	</li>   
	<li> 列表项2 	</li>   
	<li> 列表项3 	</li>   
</ol>

无序列表格式与之类似，如下：

<ul>
	<li> 列表项1  	</li>   
	<li> 列表项2 	</li>   
	<li> 列表项3 	</li>   
</ul>

自定义列表格式略为复杂：

<dl>
	<dt>列表项1</dt>
	<dd>对列表项1的描述</dd>
	<dd>对列表项1的描述</dd>
	<dd>对列表项1的描述</dd>
	
	<dt>列表项2</dt>
	<dd>对列表项2的描述</dd>
	<dd>对列表项2的描述</dd>
	<dd>对列表项2的描述</dd>
</dl>

其中<dl>为列表标签，

<dt>定义一个列表项

<dd>是列表项的具体描述

三种列表的效果如下：

在这里插入图片描述

缩写记忆：

ul是unordered lists的缩写 (无序列表)

li是list item的缩写（列表项目）

ol是ordered lists的缩写（有序列表）

dl是definition lists的英文缩写 (自定义列表)

dt是definition term的缩写 (自定义列表组)

dd是definition description的缩写（自定义列表描述）

用得最多的是无序列表ul，用来作为网站的导航栏

4.表格标签

表格元素用<table>标签来定义。

基本格式如下：

border 属性表示表格边框的长度，单位为像素(pixel)
一个表格有若干行，每行通过<tr>标签来定义 (r 表示 row)
一行有若干个单元格，每个单元格通过<td>标签来定义，内容可以是文本、图像等等 (d表示data)
表头单元格可以用<th> 标签来定义（h表示header）

<th> 标签和<td>标签的区别如下：

<th> 元素中的文本通常呈现为粗体并且居中。
<td> 元素中的文本通常是普通的左对齐文本。

<table border=1>
    <tr>
		<th>表头1</th>
		<th>表头2</th>
		<th>表头3</th>
 	</tr>
	<tr>
		<td>1-1</td>
		<td>1-2</td>
		<td>1-3</td>
	</tr>
	<tr>
		<td>2-1</td>
		<td>2-2</td>
		<td>2-3</td>
	</tr>		
</table>

效果如下：

在这里插入图片描述

单元格有colspan和rowspan属性，可以实现跨行、跨列

	<table border=1>
		<tr>
			<th colspan=3>学生成绩</th>
		</tr>
		<tr>
			<td rowspan=3>小悦</td>
			<td>语文</td>
			<td>96</td>
		</tr>
		<tr>
			<td>英语</td>
			<td>100</td>
		</tr>
		<tr>
			<td>数学</td>
			<td>99</td>
		</tr>
		<tr>
			<td rowspan=3>吉利</td>
			<td>语文</td>
			<td>5</td>
		</tr>
		<tr>
			<td>英语</td>
			<td>55</td>
		</tr>
		<tr>
			<td>数学</td>
			<td>25</td>
		</tr>
	</table>

效果如下：

在这里插入图片描述

tips:如果某个单元格是空的，浏览器不会显示它的边框，就会很丑，建议用空格进行占位&nbsp

5.框架标签

通过使用框架，可以在同一个浏览器窗口中显示多个页面（内联框架）

<iframe src="URL"></iframe>

URL为网页的链接

（试了下百度的，发现请求被拒绝）

属性：

frameborder定义iframe是否显示边框，值为0不显示，为1显示
height 和 width 属性分别用来定义iframe的长度和宽度，默认单位为像素，也可以按百分比赋值

例：

<iframe src="https://www.runoob.com/html/html-tutorial.html" frameborder="0" height="500" width="30%"></iframe>

效果如下：

在这里插入图片描述

使用iframe来显示目标链接页面：

iframe元素中还有一个属性name

在链接元素中将target指定为iframe的name，则可以在iframe中打开链接元素中的链接

	<iframe src="https://www.runoob.com/html/html-tutorial.html" name="hey" frameborder="0" height="500" width="30%"></iframe>
	<a href="https://www.bilibili.com/" target="hey" >点击跳转到B站</a>

五.表单

推荐B站上一个讲表单的视频：表单验证课程

这个教程里讲了很多HTML5中新增的表单新特性，建议对表单有一定了解后再去看。

1.概述

表单的作用是收集不同类型的用户输入，并提交到处理数据的地方

一个常见的案例是登录框，需要收集用户输入的账号和密码，提交到后台再验证账号是否存在、密码是否正确等

表单标签：<form> </form>

form标签中有两个重要的属性：

method：值为post或get，规定表单提交的方式
action：值为URL，规定表单提交到哪里

post方式更为安全，get方式更为高效

典型的get方法如百度，你每次搜索的内容都会在地址栏中显示出来

注：表单本身在网页中是不可见的。具体功能需要通过input标签实现

input标签是一个自闭合标签，是表单中最重要和常用的标签。

除了input标签，还有文件域textarea、下拉框select等标签

2.input属性

input标签中最重要的就是type属性

根据type属性，input元素可以展示很多形态：

type=“text” 文本框
type=“password” 密码框
type=“radio” 单选框
type=“checkbox” 复选框
type=“file” 用于提交文件
type=“button” 按钮
type=“reset” 重置按钮，点击后表单数据被清空
type=“submit” 提交按钮，点击后表单被提交

各个类型的具体情况，之后会一一介绍

input元素的其他属性：

name属性
- 作用：为input元素设置名字
- 表单的作用是收集用户输入的信息并提交，一个input元素可以收集一份信息，令用户输入的值为value，最后提交的信息是 name=value 这种形式的
- 例：<input type="text" name="username">
vlaue属性规定了input元素的初始值（默认值）
- 用户输入的信息会变为value属性的值
- 如果代码中直接给value属性赋值了，就相当于默认值的效果了
placeholder属性规定文本框的提示信息
- 例：淘宝网的登录框
pattern 属性用于输入正则表达式，以实现表单验证
- 表单验证：对用户的输入作一定的校验，比如规定用户名中不允许出现特殊字符

以下五个属性不需要赋值

checked、selected分别在单选框多选框和下拉框中表示默认被选
disabled 属性表示禁用
readonly 属性表示只读
hidden 属性表示隐藏
required 属性表示非空判断（即不能输入空值）
autocomplete 属性表示自动填充

3.文本框和密码框

密码框和文本框都用于收集用户输入的字符，区别在于，密码框中输入的字符在网页中显示为掩码

我们可以通过maxlength属性来规定文本框和密码框中输入的最大字符数

详见下例：

<form action="提交到这里.html" method="get">
	<p> 用户名： <input type="text" name="username" maxlength="8" value="haha"> </p>
	<p> 密码  ： <input type="password" name="pwd"  maxlength="10">  </p>
	<p>
		<input type="submit" >
		<input type="reset"  >
	</p>

</form>

效果如下：

在这里插入图片描述

密码框中的内容在网页上以掩码形式出现

点击重置按钮后表单中内容会恢复初始值

点击提交后跳转到form元素action属性所指向的网页

表单中的元素会以name:value的形式被提交，其中value是用户所输入的值，若在HTML中为value属性赋值则相当于给该表单赋了一个默认初值，name属性应该自己定义

3.单选框和多选框

radio表示单选框，checkbox表示多选框

每一个选项都要定义一个input元素，所以在radio和checkbox中name属性是很重要的：

name相同的元素属于同一个问题的选项

大致写法如下：

	<form action="提交到这里.html" method="post">
		<p> 性别：
			<input type="radio" value="male" name="gender" >   男
			<input type="radio" value="female" name="gender"> 女
		</p>

		<p>爱好：
			<input type="checkbox" value="basketball" name="hobby" > 篮球
			<input type="checkbox" value="running" name="hobby">    跑步
			<input type="checkbox" value="soccer"   name="hobby">   足球
			<input type="checkbox" value="sleep"   name="hobby" checked>    睡觉
		</p>

		<p>
			<input type="submit">
			<input type="reset">
		</p>

	</form>

效果如下：

在这里插入图片描述

在radio和checkbox中，value属性是必填项。

本质上，男、女、篮球等等这些文本是在<input>元素外的，真正提交的数据是input元素的value值

checked表示默认被选，因此一打开上面的页面睡觉就已经显示被选择了

注：单选框最多有一个选项被checked，若有多个以最后一个为准

4.特殊文本框

用户输入的内容可能是非法的，有一些文本框能对用户的输入作简单的合法性检查：

①邮箱

<p>个人邮箱：
	<input type="email" name="e-mail">
</p>

会检查用户输入的字符中是否含有@，并且要求@不能是在字符串的末尾

②URL

<p>个人网页：
	<input type="url" name="web">
</p>

会检查用户输入的字符是否满足合法的网址格式

③数字

<p>年龄：
	<input type="number" name="_num" max=120 min=0 step=1> 
</p>

可以自定义值域，max表示最大值，min表示最小值

step为变化的步长

利用pattern属性（正则表达式）可以实现更强的验证

例：网上找到邮箱的正则表达式

<p>个人邮箱：
	<input type="text" name="e-mail" pattern="^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$">
</p>

5.下拉框

下拉框所实现的功能其实和单选框是一样的，即多选一

		<p>国籍：
			<select name="nationality">
				<option value="China"> 中国 </option>
				<option value="England"> 英国 </option>
				<option value="South Korea" selected> 韩国 </option>
				<option value="North Korea"> 朝鲜</option>
			</select>
		</p>

selected表示默认项，和前面的checked是一样的

value为选择对应选项后表单提交的值

效果如下：

在这里插入图片描述

6.文本域

文本域用于多行文本输入，例：

	<textarea maxlength="1000" cols="20" rows="30" name="complain"  >
    	你有什么想说的请写在这里
	</textarea>

maxlength规定输入的最大字符数

cols和rows分别用来规定文本域的列数和行数以控制尺寸

<textarea>和</textarea>间的文字为文本域的默认内容

效果如下：

在这里插入图片描述

7.各种按钮

前面出现过的submit、reset其实就是按钮，作用分别是提交表单、重置表单

可以通过value属性改变按钮上的字：

<input type="submit" value="submit">
<input type="reset"  value="点击重置">

图片形式的提交按钮：

<input type="image" src="C:\Users\93297\Pictures\壁纸\动漫\8cfb108aea41b521f5b3a7b1d46dd5cd5c0fcd5a.jpg@518w.webp" width="50" height="100">

属性src、width、height都只针对type为image 的input元素

src提供图片的地址（或url）、width和height分别用于定义图片的高、宽

提交文件时的按钮

<p>头像上传：
	<input type="file" name="profile_photo">
</p>

以上都是具有特定用途的按钮

type为button时定义的是最普通的按钮，本身并没有什么用，但可以和JS一些动作函数进行配合。

六.总结

HTML是文本标记语言，门槛比较低，但知识点杂。

学习HTML的主要目标是：

理解HTML的语法和编写规则，对网页是如何形成的有大致的了解
掌握常见的标签
掌握表单及表单验证

本篇笔记涉及的知识点较少，以入门为主。

涉及布局的 div、span标签将在CSS的笔记中再提及。

自定义属性将在JS的笔记中再提及。

学习HTML的目的是学会开发网页，而不是记住所有标签名、属性名等

HTML标签参考手册：w3school

表单验证课程：BV16K4y1Z7Gb

遇到的其他问题，百度即可

Nefu_qky

关注

1
点赞
踩
5

收藏

觉得还不错? 一键收藏
1
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫

专栏目录

0x01 HTML快速入门

文章目录

一.HTML简介

1.基本概念

2.HTML标签

3.HTML骨架

4.环境准备

5.网页的创建

二.网页基本标签

1.注释标签

2.标题标签

3.段落标签

4.换行标签

5.水平线标签

6.粗体斜体标签

三.基本知识

1.元素

2.标准流

3.属性

4.转义字符

四.常用标签

1.图像标签

2.链接标签

3.列表标签

4.表格标签

5.框架标签

五.表单

1.概述

2.input属性

3.文本框和密码框

3.单选框和多选框

4.特殊文本框

5.下拉框

6.文本域

7.各种按钮

六.总结