两天时间学习的html的知识笔记
作者：互联网
坚持努力背
特殊字符：
空格符
< 小于号 <
> 大于号 >
& 和号 &
￥ 人民币 ¥
© 版权 ©
R 注册商标 ®
。 摄氏度 °
正负号 ±
X 乘号 ×
除号 ÷
2 平方2 (.上标2) ²
3 立方3 (上标3) ³
标签有两种（单标签、双标签）：
双标签：<html></html>、<head></head>、<title></title>、<body></body>、<p>段落标签</p>、
<h1>标题标签</h1>~<h6></h6>、<strong>加粗</strong>、<b>加粗</b>、<em>斜体</em>、<i>斜体</i>、
<del>删除线</del>、<s>删除线</s>、<ins>下划线</ins>、<u>下划线</u>、<div>大盒子</div>、<span>小盒子</span>、
<a>超链接标签</a>、
标题标签：1、加了标题的文字会加粗、字体也会变大。
2、一个标题独占一行。
段落标签：1、会根据浏览器的窗口大小自动换行。
2、段落和段落之间会有间距/空隙。
文本格式化标签：是指给文字 加粗、斜体、下划线的效果。
大盒子： 1、<div>标签是用来布局的，不做处理一般一行只能放一个<div>。大盒子
小盒子： 2、<span>标签用来布局，一行可以有多个<span>。小盒子
超链接标签：1、一般写成<a href="跳转目标" target="目标窗口的弹出方式">文本或图片</a>
2、里面的属性：href:用于指定目标链接的地址，（必须属性）当标签应用href属性时，他就居于了超链接的功能。
targte:用于指定连接的打开方式，其中_self为默认值（当前窗口打开），_blank为在新窗口中打开。
3、锚点连接：点击之后快速跑到你想看到的内容。（）点击后可以快速定位的页面的某个位置）
格式：<a href="#id名"></a>
<h1 id=名字></h1>
单标签：换行标签<br/>、图像标签<img>、、、、、、、、、、、、、、、、、、、、、
换行标签：1、强制换行、并不产生间距。
图像标签：1、一般写成<img src="图片URL" />、src是<img />标签的 必须属性，用于指定文件的路径和文件名。
所谓属性：简单讲就是属于这个图像标签的特性。
图像标签的其他属性：src——————图片的路径——————必须属性
alt—————— 文本 ——————替换文本，图像不能显示的文本
title———— 文本 ——————提示文本。鼠标到图片上显示的文字
width———— 像素 ——————设置图片的宽度
height———— 像素 ——————设置图片的高度
border———— 像素 ——————设置图像的边框粗细
双标签可以分成两类（包含关系、并列关系）：
包含关系：
<head>
<title>有时候又叫——父子关系</title>
</head>
并列关系：
<head></head>
有时候又叫——兄弟关系
<body></body>
总结
1.以上三个代码vscode自动生成，基本不需要我们重写.
2. <! DOCTYPE html>文档类型声明标签 ,告诉浏览器这个页面采取htm15版本来显示页面.
3. <html lang= "en” >告诉浏览器或者搜索引|擎这是一个英文网站本页面采取英文来显示----中文zh-cN为定义语言为中文
4. <meta charset="UTF-8" />必须写.采取UTF-8来保存文字.如果不写就会乱码.具体原理后面分析.---UTF-8称为：万国码
（包含全世界所有国家要用到的符号）
<!-- 表格标签： -->
标签 描述
<table> 定义表格
<th> 定义表格的表头
<tr> 定义表格的行
<td> 定义表格单元
<caption> 定义表格标题
<colgroup> 定义表格列的组
<col> 定义用于表格列的属性
<thead> 定义表格的页眉
<tbody> 定义表格的主体
<tfoot> 定义表格的页脚
作用：主要用于显示、展示数据。
表格的基本语法：
<table border="" cellspacing="" cellpadding="">
<tr><th>Header</th></tr>
<tr><td>Data</td></tr>
</table>
其中：
<table>表格标签</table>——用于定义表格标签
<tr></tr>标签用于定义表格中的行，必须嵌套在<table></table>标签中
<td></td>用于定义表格中的单元格，必须嵌套在<tr></tr>标签中
<th>表头单元格</th>标签表示表头部分、表头部分显示加粗、里面的文字是居中的。
<thead></thead>表示表格的头部区域
<tbody></tbody>表示表格的主题区域
合并单元：
跨行合并：rowspan="合并单元格的个数"
跨列合并：colspan="合并单元格的个数"
表格会不出现边框，需要给他追加属性：
align left、center、right 规定表格相对周围元素的对其方式
border 1或者"" 规定表格单元格是否拥有边框，默认为""，表示没有边框
cellpadding 像素值 规定单元边沿与其内容之间的空白，默认为1像素
cellspacing 像素值 规定单元格之间的空白，默认为2像素
width 像素值或百分比 规定表格的宽度
<!-- 列表标签： -->
作用：是用来布局的
特点：整齐、整洁、有序、它的布局更加自由和方便。
列表有三大类（无序列表、有序列表、自定义列表）：
无序列表：
<ul>
<li></li>
<li></li>
</ul>
1、无序列表的各个列表项之间没有顺序之分，是并列的
2、<ul></ul>中只能嵌套<li></li>,直接在<ul></ul>标签中输入其他的标签或文字的做法是不允许的。
3、<li></li>之间相当于一个容器，可以容纳所有元素。
4、无序列表会带有自己的属性，但使用时我们会使用CSS来设置
有序列表：
<ol>
<li></li>
<li></li>
</ol>
1、<ol></ol>列表可以用数字来显示,<li></li>标签定义列表的项
2、<ol></ol>中只能嵌套<li></li>,直接在<ol></ol>标签中输入其他的标签或文字的做法是不允许的。
3、<li></li>之间相当于一个容器，可以容纳所有元素。
4、有序列表会带有自己的属性，但使用时我们会使用CSS来设置
自定义列表：自定义列表常用于对术语或名词进行解释和描述,定义列表的列表项前没有任何项目符号。
<dl>
<dt></dt>
<dd></dd>
<dd></dd>
</dl>
<dl></dl>标签定义描述的列表（或定义列表），该标签会与<dt>定义项目（名字）</dt>和<dd></dd>（描述每个项目/名字）一起使用。
1、<dl></dl>里面只能包含<dt></dt>和<dd></dd>
2、<dt></dt>和<dd></dd>是没有次数限制的，一般一个<dt></dt>带有多个<dd></dd>
<!-- 表单： -->
表单是用来收集用户信息的
表单域是一个包含表单元素的区域
<form></form>标签用于定义表单域，以实现用户的信息的收集与传递。
<form></form>会把范围内的表单信息提交给服务器
格式：
<form action="url地址" method="提交方式" name="表单域名称">
</form>
action url地址 用于指定接收并处理表单数据的服务器的程序的url地址
method get/post 用于设定表单的提交方式，其中值为get或post
name 名称 用于指定表单的名字，以区分一个页面的多个表单域
表单控件：
<input type="" name="" id="" value="" />输入表单元素-----用于收集用户信息
type可以取的值：
button 定义可点击按钮(多数情况下，用于通过JavaScript启动脚本)。
checkbox 定义复选框。 //名字也要相同
file 定义输入字段和"浏览"按钮，供文件上传。
hidden 定义隐藏的输入字段。
image 定义图像形式的提交按钮。
password 定义密码字段。该字段中的字符被掩码。
radio 定义单选按钮。 //想要实现多选用一就要把按钮的名字命名的一样（name=相同）
reset 定义重置按钮。重置按钮会清除表单中的所有数据。
submit 定义提交按钮。提交按钮会把表单数据发送到服务器。
text 定义单行的输入字段，用户可在其中输入文本。默认宽度为20个字符。
input的属性：
name 由用户自定义 定义input元素的名称。
value 由用户自定义 规定input元素的值。
checked checked 规定此input元素首次加载时应当被选中。
maxlength 正整数 规定输入字段中的字符的最大长度。
2.页面中的表单元素很多,如何区别不同的表单元素?
答: name属性:当前input表单的名字,后台可以通过这个name属性找到这个表单。页面中的表单很多,
name的主要作用就是用于区别不同的表单。
<laber></laber>标签为input元素定义标注（标签）
<laber></laber>标签用于绑定一个表单元素，当点击<laber></laber>标签内的文本时，浏览器会自动将焦点（光标）
转到或者选择对应的表单元素来增加用户体验
<laber for="sex">男</laber>
<input type="radio" name="sex" id="sex">
核心：<laber></laber>标签for属性应当与相关的id属性相同
<select></select>下拉表单元素
下拉列表
<select></select>在页面中，如果有多个选项让用户选择，并想节约页面空间
<option></option>中定义selected="selected"时，当前选项为默认选中项
结构：
<select>
<option></option>
<option></option>
</select>
<textarea rows="显示的行数" cols="每行中的字符数"></textarea>文本域元素
给body添加一个background属性，并将其值设为图片的路径，即可设定body的背景图片，如下所示：
视频
<video width="800" height="">
<source src="myvideo.mp4" type="video/mp4"></source>
<source src="myvideo.ogv" type="video/ogg"></source>
<source src="myvideo.webm" type="video/webm"></source>
<object width="" height="" type="application/x-shockwave-flash" data="myvideo.swf">
<param name="movie" value="myvideo.swf" />
<param name="flashvars" value="autostart=true&file=myvideo.swf" />
</object>
当前浏览器不支持 video直接播放，点击这里下载视频: <a href="myvideo.webm">下载视频</a>
</video>
<body background="background.gif">
<body bgcolor="yellow">可以将背景颜色改成黄色
制作电子邮件链接？
<a href="mailto:xxx@yyy">
电子邮件链接的实现也是使用a标签实现的（html中没有mail标签）；
实现电子邮件连接需要将href中的值替换为mailto:邮箱地址的形式。
标签：定义,表格,两天,标签,笔记,表单,html,列表,属性 来源： https://www.cnblogs.com/XJiangKunX/p/15787775.html