提示：文章写完后，目录可以自动生成，如何生成可参考右边的帮助文档

文章目录

我的html理解
- 任何网页只要右键—查看源代码就能看到他的*真实面目*
1、语法规范
2、HTML基本结构标签
- 2.1.文档类型声明标签
- 2.2字符集
3 HTML常用标签
- 3.1标题标签`
  
  ~
  
  `
- 3.2 段落和换行标签
- 3.3 文本格式化标签
- 3.4 `
  `和` `标签
- 3.5 图像标签和路径
- - 3.5.1. 图像标签
  - 3.5.2.路径
- 3.6 超链接标签
- - 3.6.1. 链接的语法格式
  - 3.6.2.链接分类
4 HTML中的注释和特殊字符
- 4.1 注释
- 4.2 特殊字符
5 列表标签
- 5.1无序列表
- 6.2 有序列表
- 6.3自定义列表
- 6.4 列表总结
7 表单标签
- 7.1 表单的组成
- 7.2 表单域
- 7.3 表单控件（表单元素）
- 7.4 表单元素总结
- - 7.4.1``标签
  - 7.4.2``表单元素
  - 7.4.3``表单元素
总结

我的html理解

提示：这里可以添加本文要记录的大概内容：

用来创建平时我们浏览的网页上看到的信息的一种标记语言，标记不多，很容易记忆和理解。
HTML可以定义网页基本内容和大致表现效果

任何网页只要右键—查看源代码就能看到他的真实面目

提示：以下是本篇文章正文内容，下面案例可供参考

1、语法规范

HTML标签通常成对出现
有些特殊的标签必须是单个标签，例如

2、HTML基本结构标签

<html></html> HTML标签：根标签
<head></head> 文档头部：在head标签中我们必须要设置的标签是title
**<title></title>**文档的标题：页面标题
**<body></body>**文档的主体：元素包含文档的所有内容，页面内容基本都是放到body里面

2.1.文档类型声明标签

用来告诉浏览器使用哪个版本的HTML来显示网页，现在可有可无

注意：1.声明位于文档中的最前面的位置，处于标签之前
2.这不是一个HTML标签，就是一个文档类型声明标签

2.2字符集

   在**<head>**标签内，可以通过**<meta>**标签的**charset**属性来规定HTML文档应该使用哪些字符编码**charset**常用的：UTF-8万国码基本包含了全世界所有国家需要用到的字符。

3 HTML常用标签

3.1标题标签`<h1>~<h6>`

HTML提供了六个等级的标签即<h1>~<h6>。

标签语义：作为标题使用，重要性依次递减。

注意：加了标题的文字会变粗变大,一个标题独占一行。

3.2 段落和换行标签

在网页中，要把文字有条理地显示出来，就要将这些文字分段显示。
在HTML标签中，

<p>标签用于定义段落，它可以将整个网页分为若干段落。 标签语义：可以把HTML文档分割为若干段落。

ps ：文本一个段落中会根据浏览器窗口的大小自动换行。段落与段落之间保有空隙。

 强制换行：换行标签<br /> 单词break的缩写，意为打断，换行。

ps ：是个单标签,该标签只是简单的开启新的一行，它跟段落不同，段落之间有插入一些垂直间距。

3.3 文本格式化标签

加粗   <strong></strong>或<b></b>   更推荐使用<strong>标签加粗
倾斜  <em></em>或<i></i>           更推荐<em>标签加粗
删除线 <del></del>或<s></s>     更推荐<del>标签加粗
下划线 <ins></ins>或<u></u>     更推荐<ins>标签加粗

标签语义：突出重要性，比普通文字更重要。

3.4 `<div>`和`<span>`标签

<div>和<span>是没有语义的，它们就是一个盒子，用来装饰内容。

<div>这是头部 </div>
<span>没有语义</span>

 div是division的缩写，表分割；span意为跨度，跨距。特点：1.   <div>标签用来布局，但现在一行只能放一个<div>大盒子。2.    <span>标签用来布局，一行可以放多个<span>小盒子。

3.5 图像标签和路径

3.5.1. 图像标签

在HTML标签中，<img>标签用于定义HTML页面中的图像。
src是<img>标签的必须属性，它用于指定图像文件的路径和文件名。 (属性：属于图像的特性)

属性     属性值       说明
src       图片路径  必须属性
alt       文本        替换文本。图像不能显示文字
title     文本        提示文本。鼠标放于图像上，显示文字
wideth    像素        设置图像的宽度
height    像素        设置图像的高度
border    像素        设置图像的边框粗细

图像标签属性注意点：
• 图像标签可以拥有多个属性，必须写在标签名的后面。
• 属性之间不分先后顺序，标签名与属性，属性与属性之间均以空格分开。
• 属性采取键值对的格式，即key=”value"的格式，属性=“属性值”。

3.5.2.路径

页面中的图片会非常多，通常我们会新建一个文件夹来存放图像文件，这时再查找图像，就需要采用“路径”的方式来指定文件的位置。

3.6 超链接标签

在HTML标签中，<a>标签用于定义超链接，作用是从一个页面链接到另一个页面。

3.6.1. 链接的语法格式

<a href="跳转目标" target="目标窗口的弹出方式">文本或图像</a>

属性   作用
href    用于指定链接目标的url地址，（必须属性）当标签应用herf属性是，它就具有了超链接的功能
target  用于指定链接页面的打开方式，其中-self为默认值(当前页面打开），-blank为在新窗口中打开方式。

注：URL是统一资源定位符，是互联网上标准资源的地址。而互联网上的每个文件都有唯一的一个的URL，它包含的信息指出「文件的位置」以及浏览器应该怎么处理它。

3.6.2.链接分类

    1.   外部链接：例如`<a href="hettp://baidu.com" >百度</a>`。2. 内部链接：网站内部之间的互相链接，直接链接内部页面名称即可，例如`<a href ="网页名称.html">首页</a>`。3.  空链接：如果当时没有确定链接目标时，`<a href="#">首页</a>`。4.    下载链接：如果herf里面的地址是一个文件或者压缩包，会下载这个文件。5. 网页元素链接：在网页中的各种网页元素，如文本，图像，表格，音频，视频等都可以添加超链接。6.    锚点链接：点我们点击链接，可以快速定位到页面中的某个位置。•    在链接文本的herf属性中，设置属性值为#名字的形式，如<a href="#名字">目标位置名称</a>
•   找到目标位置标签，里面添加一个id属性=上步定义的名字，如<h3 id="名字">目标</h3>

4 HTML中的注释和特殊字符

4.1 注释

如果需要在HTML文档添加一些便于阅读和理解但又不需要显示在页面中的注释文字，就需要注释标签。
HTML中是注释以“ ”结束。
快捷键：Ctrl+/
注释标签中的内容是给自己看的，该代码不执行不显示到页面中。

4.2 特殊字符

在HTML页面中，一些特殊符号很难或者不方便直接使用，我们就需要采用下面字符来代替。

特殊符号    描述      字符的代码
``           空格符   &nbsp;
<           小于号    &lt;
>           大于号    &gt;
$          和号       &amp;
¥          人民币  &yen;
©          版权       &copy;
®          注册商标 &reg;
°          摄氏度  &deg;
±          正负号  &plusmn;
×          乘号   &times;
÷          除号   &divide;
²          平方2  &sup2;
³          立 方3 &sup3;

5 列表标签

5.1无序列表

<ul>标签表示HTML页面中项目的无序列表，一般会以项目符号呈现列表项，而列表项使用<li>标签定义
效果：
• 列表项1
• 列表项2
• 列表项3

 1. 无序列表的各个列表项之间没有顺序级别之分，是并列的。2.  <ul></ul>之中只能嵌套<li></li>，直接在<li></li>标签 中输入其他标签或者文字的做法是不被允许的。3.  <li></li>之间相当于一个容器，可以之间容纳所有元素。4. 无序列表会带有自己的样式属性，但在实际使用时，我们会用CSS来设置。

6.2 有序列表

<ol>标签表示HTML页面中项目的有序列表，一般会以项目符号呈现列表项，而列表项使用<li>标签定义。

1.   <ol></ol>之中只能嵌套<li></li>，直接在<li></li>标签中输入其他标签或者文字的做法是不被允许的。
2.  <li></li>之间相当于一个容器，可以之间容纳所有元素。
3.  无序列表会带有自己的样式属性，但在实际使用时，我们会用CSS来设置。

6.3自定义列表

在HTML标签中，<dl>标签用于定义描述列表（或定义列表），该标签会与<dt>(定义项目/名字)和<dd>(描述每一个项目/名字)一起使用。

    1. `<dl></dl>`里面只能包含`<dt>`和`<dd>`。2.   `<dt>`和`<dd>`个数没有限制，经常是一个`<dt>`对应多个`<dd>`

6.4 列表总结

标签名          定义          说明
<ul></ul>      无序标签         里面只能包含li，没有顺序，使用较多，li里面可以包含任何标签
<ol></ol>      有序标签         里面只能包含li，有顺序，使用较少，li里面可以包含任何标签
<dl></dl>      自定义列表        里面只能包含dd和dt，dt和dd里面可以放任何标签

7 表单标签

使用表单目的是为了收集用户信息，在我们网页中，我们也需要跟用户进行交互，收集用户资料，这时就需要表单了。

7.1 表单的组成

在HTML中，一个完整的表单通常包含表单域，表单控件（也称表单元素）和提示信息三个部分构成。

7.2 表单域

表单域是一个包含表单元素的区域
在HTML标签中，<form>标签用于定义表单域，以实现用户信息的收集和传递。
<form>会把它范围内的表单元素信息提交给服务器。

<form action="url地址" method="提交方式" name="表单域名称"    >各种表单元素控件
</form>

注意：

在我们写表单元素之前，应该有个表单域把他们进行包含。
表单域是form标签。

7.3 表单控件（表单元素）

在表单域中可以定义各种表单元素，这些表单元素允许用户在表单中输入或者选择的内容控件。
<input>表单元素
在英文单词中，input是输入的意思，而在表单元素中标签用于收集用户信息。
在<input>标签中，包含一个type属性，根据不同的type属性值，输入字段拥有很多种形式(可以是文本字段，复选框，掩码后的文本控件，单选按钮，按钮等)。

<imput type="属性值" />

•    <input />为表单单标签
•   type属性设置不同的属性值用来指定不同的控件类型，其常用值如下。

7.4 表单元素总结

有些表单元素可以显示几个默认文字

<input type="text" value="请输入用户名"/>

页面中的表单元素用name属性，name的主要作用是用于区别不同的表单。

<input type="text" value="请输入用户名" name="usename" />

•    name属性是自定义的值。
•   radio（或者checkbox）如果是一组，我们必须给命名相同的名字。

3.chacked属性（默认选中状态），当页面打开就让某个单选按钮或者复选框就是选中状态。

4.type属性可以让input表单元素设置不同的形态。

7.4.1`<label>`标签

<label>标签为input元素定义注释（标签）。
<label>标签用于绑定一个表单元素，当点击标签内的文本时，浏览器就会自动将焦点或光标转到或者选择对应的表单上，用来增加用户体验。
语法：

<label for="sex">男</label>
<input type="radio" name="sex" id="sex" />

核心：label标签的for属性应相当与相关元素的id属性相同。

7.4.2`<select>`表单元素

使用场景：在页面中，如果有多个选项让用户选择，并且想要节约页面空间时，我们可以使用<select>标签控件定义下拉列表。
语法表示：

<select><option>选项一</option><option>选项二</option><option>选项三</option>
</select>

1.   <select>中至少包含一对<option>
2.  在<option>中定义selected="selected"时，当前项即为默认选中项。

7.4.3`<textarea>`表单元素

使用场景：当用户输入内容较多的情况下，我们就不能使用文本框表单了，此时我们可以使用<textarea>标签。
在表单元素中，<textarea>标签是用于定义多行文本输入的控件。该控件多用于留言板，评论。
语法表示：

  <textarea row="3" cols="20">文本内容</textarea>

事例：

 <textarea row="3" cols="20">文本内容</textarea>

1.   通过<textarea>标签可以轻松创建多行文本输入框。
2.  cols="每行中的字符数"，rows="显示的行数"，我们在实际开发中不会使用，都是用css来改变大小。·

总结

以上就是我对html的了解和总结

浅浅总结一下HTML吧相关推荐

花嫁之容氏浅浅最后怎么样了_花嫁之容氏浅浅小说
<花嫁之容氏浅浅>小说节选免费试读梅姐变成了植物人? 我惊呆了. 我知道梅姐在雪山那次受了伤,可我没想到严重到这种地步.毕竟陆亦辰.梅婷婷也都被那女鬼抓走了,都没什么大碍啊. " ...
浅浅轻吟如花的芬芳，开始散漫着
落日红极惹上彩色的画面,黄昏的夕阳化了妆,红红升腾洒遍各个角落,一种美丽的惆怅安详端坐,独享这份安乐.剧情中的主角何慕天,李梦竹几度夕阳.摊开的落日,晚霞布满落日四周的云彩,那海的岸边,夕阳映照余晖恋 ...
花嫁之容氏浅浅最后怎么样了_花嫁之容氏浅浅最后怎么样了小说完整版
花嫁之容氏浅浅最后怎么样了?小说花嫁之容氏浅浅中主角舒浅容祁最后都怎么样了?推荐在线阅读小说完整版,了解更多故事精彩内容.昨晚那不是梦那.那是真的?男鬼邪性的笑了笑,还不算太笨,所以舒浅昨晚是真实存在 ...
花嫁之容氏浅浅最后怎么样了_花嫁之容氏浅浅大结局最后章节第2章免费看
<花嫁之容氏浅浅> 章节介绍 <花嫁之容氏浅浅>是一部故事内容新颖的小说,作者许暖暖不落俗套,标新立异,为读者呈现了前所未有的精彩画面.小说<花嫁之容氏浅浅>第2章 ...
我浅浅驻足，徒留深深缠绵
夜深人静,无意间打开了一个叫ITer的人人小站,在其主页看到这么一段文艺代码: #include <stdio.h> void main() {double world;unsigned ...
达内科技NTD1712浅浅解析数据在各个设备中如何传输的过程
本文章重在浅浅讲解TCP/TP五层协议在各个设备中的是如何传输的,拓扑图如下. 例,在PC1和PC2上均有一个qq程序.PC1给PC2发送一个消息,I love you.把这句话定义为数据A. 它在本 ...
对计算机知识体系的了解,浅浅而谈计算机专业知识体系（对要进入计算机专业学习的人的小小建议）...
之所以是浅浅而谈,是因为我下个学期刚上大四,所以对整个体系还不能完全了解.之所以谈,是因为我已经知道大四的内容是什么,方向是什么. 我个人觉得,首先对"计算机"有一个认识:我是计算 ...
花嫁之容氏浅浅最后怎么样了_花嫁之容氏浅浅章节目录阅读
花嫁之容氏浅浅小说完整版无弹窗在线阅读.花嫁之容氏浅浅小说是作者:许暖暖创作完成的一本热门玄幻灵异小说,主要讲述女主舒浅和鬼王容祁两人的精彩故事.梦里,舒浅感受到一双冰冷的手在自己身上游走,可是即使这 ...
拿Python获取奶茶店的数据，做个可视化，浅浅尝试一下吧
嗨嗨,大家好~ 马上又要迎来,万圣节了,很多店家都在搞活动,有我们都知道的kfc,最近奶茶店的活动也开始了,就比如coco,买奶茶送库洛米相关的周边奶茶好不好喝不知道,但是还是吸引蛮多人去买的,就是 ...
带你浅浅了解自动驾驶激光雷达
"激光雷达市场竞争异常激烈,国内两大巨头厂商禾赛科技.速腾聚创一较高下,国外FMCW方案厂商Aeva一骑绝尘.本文将介绍TOF和FMCW的激光雷达以及行业现状,带大家浅浅了解激光雷达小知识. ...

浅浅总结一下HTML吧