HTML自学笔记

最新推荐文章于 2024-01-28 00:31:47 发布
最新推荐文章于 2024-01-28 00:31:47 发布
阅读量674 收藏 3
点赞数 1
文章标签： html
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/Liudashuaia/article/details/104430642
版权
本文详细介绍了HTML的基础知识，包括HTML的定义、作用、版本和扩展名。接着，深入探讨了HTML文档结构，如基本结构、标签、注释、实体字符和文档类型。进一步讲解了常用标签，如基本标签、超链接、表格和表单。最后，提到了HTML5的发展、特点和新增内容，包括结构和语义标签、表单相关更新以及多媒体支持。
摘要由CSDN通过智能技术生成

一、HTML简介

1.HTML是什么？

HTML:hyper text markup language超文本标记（标签）语言由各种标签组成，用来制作网页，告诉浏览器该如何显示页面

2.作用

  • 制作网页，控制网页和内容的显示

  • 插入图片、音乐、视频、动画等多媒体

  • 通过链接来检索信息

  • 使用表单获取用户的信息，实现交互

3.版本

W3C:world wide web consortium万维网联盟，制定Web技术相关标准和规范的组织，HTML就是由W3C制定的标准

两个版本：HTML 4.0.1、HTML5.0-----通常H5

官网：http://www.w3shcool.com.cn

4.扩展名

HTML文档是以.html或.htm结尾

二、HTML文档结构

1.基本结构

1.1 简介
  • HTML标签是由尖括号括起来的关键词，如 ,通常是成对出现的，如
  • 以 为根标签包含: 头部和
  • 头部提供关于网页的相关信息，如标题、文档类型、字符编码、关键字等摘要信息
  • 主体部分提供网页的显示内容，真正显示在页面中的内容
  • 合理的进行缩进
  • 标签名不区分大小写，但是一般要用小写
    在这里插入图片描述
1.2.开发工具

记事本notepad、sublime、Notepad++、Dreamweaver、VScode、Webstorm等

使用步骤：

  1. 新建文件(cltr+N)，然后保存（ctrl+s）,指定扩展名为.html
  2. 编写HTML代码
  3. 在浏览器中打开文件

使用技巧：

  • 先保存再写代码，否则代码无颜色提示

  • 创建一个文件夹，用于保存所有的网页内容，将文件夹拖拽到sublime中，便于管理

显示/隐藏侧边栏

  • 方式1:查看–>侧边栏–>显示/隐藏侧边栏

  • 方式2:ctrl+K紧接着按B

显示多栏

  • 方式1：查看–>布局–>列数：2列

  • 方式2：Alt+shift+2

1.3浏览器

常见的浏览器：IE浏览器微软、chrome谷哥浏览器、firefox火狐、safari苹果

浏览器的作用是读取html文件，并以网页的形式来显示

浏览器不会直接显示html标签，而是使用标签来解释网页的内容

2.标签

2.1 标签的组成

一个完整的html标签的组成：

<标签名 属性名=“属性值”>内容</标签名>

<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="UTF-8">
		<title>标签</title>
	</head>
		<body bgcolor="red" text="blue">
			html从入门到精通!
		</body>
</html>

属性值要用双撇号括起来，一般用双引号

2.2 标签的分类

根据标签是否关闭，分为，关闭型和非关闭型

**关闭型：**有结束标签，即标签成对出现

<html></html>
<head></head>
<title></title>

**非闭闭型：**没有结束标签

<meta>
<br>
<h1>.....<h6>

根据标签是否独占一行，分为块级标签和行级标签

**块级标签：**显示为块状，独占一行

<h1>大家好</h1>
<hr>

**行级标签：**在行内显示，可与其他内容在同一行显示

<span></span>

page3.png
在这里插入图片描述

2.3
最低0.47元/天 解锁文章
Liudashuaia
关注
html学习笔记
07-24
这个“html学习笔记”涵盖了HTML5的基础概念、新特性和实际应用，旨在帮助初级学习者快速入门并掌握这一核心技术。 在HTML5中，许多旧的元素被废弃，同时引入了许多新的元素，这些元素的设计更具有语义化，使得网页...
html标签（表格标签）-小白学习中
mryer的博客
08-17 678
html-5 13.表格标签 表格标签主要是为了显示数据。 13.1 主要的框架 <table> <tr> <td>单元格内的文字</td> </tr> </table> (1)<table></table>是用于定义表格的标签 (2)<tr></tr>标签用于定义表格中的行，必须在<table></
html---表格边框的颜色设置
zsysingapore的博客
04-19 9715
<table style="border-color: #00FF00;"></table>
HTML——＞表格
qq_55016379的博客
04-30 825
表格 表格的基本结构 在HTML中，一个表格一般由以下3个部分组成： 表格：table标签 行：tr标签 单元格：td标签 语法格式： <table> <tr> <td>单元格1</td> <td>单元格2</td> </tr> <tr> <td>单元格3</td> <td>单元格4 </td>
HTML基础-06-表格（表＜table＞ ，行 ＜tr＞，列 ＜tb＞，表头 ＜th＞，跨列colspan，跨行rowspan，单元格边距 cellpadding，单元格间距cellspacing）
运维玄德公
03-18 1671
1. 表< table > ，行 < tr >，列 < tb > 2. 表头 < th > 3. 表名 < caption > 4. 跨列 colspan 5. 跨行 rowspan 6. 单元格边距 cellpadding 7. 单元格间距 cellspacing 8. 表内标签 9. 一个示例
HTML的常用标签
qq_61219755的博客
06-18 2335
1.标题标签：表示字体加粗，并且每个标题标签括中的文字都显示占取一行，随着h后面的数字增大，标题也就越来越小。 2.段落标签：表示标签内部的内容是以段落的形式呈现的。 3.换行标签：表示前后文本强制换行。目前后面的不写同样可以表示换行。 4.文本格式化标签： 字体加粗：或者 字体倾斜：或者 字体加删除线：或者 字体加下划线：或者 5.和标签都是用来布局的，并没有语义，就是一个盒子，不过它们还是有区别的，内的文本内容独占一行，而一行可以有多个 6. 图像标签： ：图像标签是一个单标签，但是它有很多的属性来丰富
HTML学习笔记.md
08-01
HTML学习笔记
html学习笔记.zip
04-05
介绍了html中代码格式和常用标签 #HTML格式 * `<!DOCTYPE html>`---------*注明文件使用格式* `<html lang="en">`--------*注明网页使用语言 en-英语 zh-CN-中文* `<head>`--------*头部* `...
javaweb 前端 html学习笔记
04-26
javaweb 前端 html学习笔记
HTML中table表格的常用使用
博客之家
03-23 2219
<table border="10" bordercolor="blue" width="500px" height="150px" style="border-collapse: collapse;background-color: yellow; cellpadding="30px" align="center" >
前端学习笔记一一HTML表格标签（table）
pig_html的博客
12-08 2144
前言 表格是网页制作中使用最多的工具之一，在制作网页时，使用表格可以更清晰地排列数据。但是在实际制作过程中，表格更多用在网页布局的定位上。很多网页都是以表格布局的。这是因为表格在文本和图像的位置控制方面都有很强的功能。 1.表格的基本构成 表格由行、列、和单元格3部分组成，一般通过3个标记来创建，分别是表格标记<table>、行标记<tr>、和单元格标记<td>。表格的各种属性都要在表格的开始标记<table>和表格的结束标记</table>之间才
【黑马前端—HTML标签】表格标签、列表标签、表单标签
学习如逆水行舟，不进则退
08-25 462
表格标签 表格的主要作用 表格主要用于显示、展示数据，因为它可以让数据显示的非常的规整，可读性非常好。特别是后台展示数据 的时候，能够熟练运用表格就显得很重要。一个清爽简约的表格能够把繁杂的数据表现得很有条理。 表格不是用来布局页面的,而是用来展示数据的. 表格的基本语法 <table> <tr> <td>单元格内的文字</td> ... </tr> ... </table> <table< </table
HTML表单tr、th、tb的区别
muse_null的博客
09-06 1万+
tr表示table中的行；th表示table中的表的头部，例如一篇文章的标题；tb表示table中的列
Html5-如何正确给table加边框
热门推荐
菲菲的博客
03-04 1万+
Html5-如何正确给table加边框分析单个属性的效果一、表格边框 border="1"二、cellspacing单元格间距三、cellpadding单元格边距四、去掉表格中table的所有属性值，在css中给table设置五、border-collapse: collapse 边框合并六、分析差别七、分析误区总结一下：Html中table的属性:总结来说，给表格加边框，有两种方式：【注意】 分...
HTML表格的语法、使用
tdx03的博客
12-08 1119
每个表格均有若干行（由 标签定义），每行被分割为若干单元格（由 标签定义）。指表格数据（table data），即数据单元格的内容。数据单元格可以包含文本、图片、列表、段落、表单、水平线、表格等等。background-color rgb(x,x,x) #xxxxxx colorname 规定表格的背景颜色。text-align: left center right 规定表格相对周围元素的对齐方式。元素，一个或多个 、tr、th、和 td、元素。height 规定表格的高度。
HTML表格标签
最新发布
qq_73625238的博客
01-28 222
(1). 用于定义表的标签(2). 用于表明单元格一行（必须在中使用）(3). 表示一个单元格内的文字（必须在中使用）
基本表格标签
m0_61417029的博客
07-08 2649
表格基本标签
HTML新手入门笔记整理：HTML基本标签
太空背包客的博客
11-22 1126
HTML基本标签
tb-属性
charly
05-15 460
属性类型 服务器端属性 几乎所有平台实体都支持这种类型的属性：设备，资产，客户，租户，用户等。服务器端属性是可以通过管理UI或REST API配置的属性。设备固件无法访问服务器端属性 共享属性 此类型的属性仅适用于设备。它类似于服务器端属性，但有一个重要区别。设备固件/应用程序可以请求共享属性的值或订阅属性的更新。通过MQTT或其他双向通信协议进行通信的设备可以订阅属性更新并实时接收通知。通过HTTP或其他请求响应通信协议进行通信的设备可以定期请求共享属性的值 客户端属性 此类型的属性仅适用于设备。它用
HTML学习笔记：从基础到实践
本资源是一个个人编写的HTML学习笔记，涵盖了HTML的基本概念、历史演变、常用编辑器以及基本结构和标签。HTML，全称为超文本标记语言，是一种用于创建网页的标准标记语言，它能描述网页的结构并嵌入文字、图形、动画...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值