开通VIP，畅享免费电子书等14项超值服

首页

好书

留言交流

下载APP

联系客服

2024.11.14

1

hellohtml!网页的可视区域(像人的身体，穿的衣服，其他人可以看见的)网页结束

h2标题

8.

html标记语言是由很多的标签组成，不同的标签有不同的样式和功能。

h1

h1-h6标题标签，字体依次由大到小，字体有加粗的效果。

align属性:设置文本对齐方式,属性值有left,center,right。默认左对齐，可以不写。

没有任何默认样式，主要是给css样式使用

：换行标签，br后面的内容换行显示，没有边距。

b标签包裹的文本会加粗显示，没有任何的语义。html4的版本标签

有强调的语义，包裹的文本会加粗显示。html5版本新加的标签

没有任何语义，单纯的斜体。html4的标签

有强调的语义，包裹的文本显示为斜体。h5增加。

²:上标，包裹文本显示偏上显示

₂下标，包裹文本偏小显示

引用的内容出自某处或某人

表示引用，内容用""包裹

表示内容是一段代码，显示为等宽字体样式

标记一段内容，背景显示为黄色

 半角符号，一个英文字母的宽度，半个中文字符的宽度

 全角符号，2个字母的宽度，1个中文字符的宽度

比标题内容小一号字体，默认效果在h标签里生效。h5新加

100元用于数据文本——》value属性：可选，可以设置一个值，方便搜索引擎抓取

190.00表示删除的内容，文本会有一个横线

7.9折表示插入的内容，文本会有下划线

HTML用于专业术语文本——》title属性的内容可以作为对术语的解释

注释内容是浏览器不会渲染处界面，主要是给编程人员看的。vscode里面的注释快捷键是ctrl+/

安装汉化包

常用插件

HTMLSnippets对html代码进行提示

AutoRenameTag自动闭合标签，同步修改标签

HTMLCSSSupport智能提示css类名和id名称

openinbrowser当前的html文件可以用浏览器打开

LiveServer创建一个本地服务器打开文件

shift+!选择第一个，可以快速生成网页的基本结构

html标签嵌套规则:1.布局元素可以嵌套任意元素2.块级元素可以嵌套行内元素3.行内元素不能嵌套块级元素4.p标签不能嵌套其他的块级元素

a超链接标签：

属性

例如

2

很好

target是跳转网页打开的方式，属性值默认是_self当前窗口打开，-blank是新开一个窗口打开。

ping：点击a标签，可以像ping指定的地址发送一个post请求，主要用于跟踪用户的行为。

图片标签:

3

4

5

6

7

信息包裹起来。

figcaption对图片的描述,可以做图片的标题。

列表

ol有序列表

...

有序列表，每一列前面都有一个数字。

属性值设置列前面的数字类型:

1阿拉伯数字(默认值)。

a小写字母排序

A大写字母排序

i小写罗马数字排序

I大写罗马数字排序

ul无序列表

无序列表，没有序号，每一列前面有一个符号

type属性设置列表每一列的符号：disc实心圆(默认值)，cirlce空心圆,square矩形。可以做网页的布局元素。

dl自定义列表

web前端

网页前台

dl列表，dl里面可以有多组dt，dd的组合。

dt表示一个术语dd是对术语的解释

iframe网页容器

embed/XNTg2MzEyMjY2NA=="

frameborder="0"allowfullscreen>

iframe网页容器，可以在一个区域显示其他网页以及网页内容src属性设置显示网页的地址width设置iframe的宽度，height设置iframe的高度frameborder设置边框的尺allowfullscreen点击全屏按钮，可以全屏显示多媒体标签

video:可以播放视频

8

9

10

src="./media/test.mp4"

controls

autoplay

muted

loop

height="300"

poster="./imgs/shop_33.jpg"

preload="auto"

src是视频地址，可以是本地地址或者网络地址controls播放器的控制条autoplay自动播放(chrome浏览器需要设置muted)muted静音loop循环播放width设置宽度，height设置高度,一般设置一个，让另外一个尺寸自动计算poster视频封面图片，可以是网络图片，也可以是本地图片preload视频缓存属性值:auto(默认值)缓冲整个视频，none不缓冲，metadata缓冲视频文文件的元数据,一般不设置，保持默认。

为了兼容不同浏览器播放视频文件的格式，用source元素直到找到能播放的视频文件为止

html符号输入:

可以用搜狗输入法输入特殊符号

通过html符号源代码显示符号(推荐方法)

table表格

table表示一个表格

属性:

tr表示一行

th表头单元格-默认字体加粗，水平居中

td标准单元格，主要显示数据(显示内容放在td元素里面)

caption表格的标题

thead表格的头部(没有头部，可以不写，如果写了thead必须要有tbody和tfoot),表格头部的单元格一般用th表头元素

tbody表格的身体部分

tfoot表格的底部

url:统一资源定位符，也叫网址

**form表单:**标签包含很多表单控件，表单控件可以允许用户输入输入数据并通过form标签传递这些数据到后端。(表单控件都有一个name属性，通过name属性可以把表单控件输入的数据通过查询参数传递到后端。)

值:get请求(默认)数据以查询参数的方式传递。优点:数据传输比较快，缺点:直接能在网址看见数据，传输数据大小有限制，只能传递字符串。如果是get请求可以不写method属性

post请求,数据通过请求体传递，在网址后面看不见数据。缺点:数据传输没get快，缺点:数据在请求体相对安全，传输数据几乎没有显示，可以传递各种数据。

enctype指定post请求，浏览器传递数据的MIME类型（后端根据不同的mime类型取值方式不一样）

input输入框标签，自闭合标签

type属性值:

fieldset标签

fieldset标签是一个块级容器，表示表单件的集合legend设置fieldset控件的标题，通常在fieldset的第一个元素，会嵌入到fieldset上角。

语法：

lable标签

lable表单控件的文字说明，一般用预form表单里面

未知

可以把表单控件放入label标签里面，自动关

联。

男

button按钮

属性：

type按钮的类型:submit(提交form表单数据),reset重置(重置表单数据为初始状态),button普通按钮，没有任何行为。——》button标签可以用在form标签外面。会具有submit属性，可以提交

提交

select下拉菜单

生成一个下拉菜单,需要配合option标签设置选项

四川

广东

1.select——》name表单名称，数据以name=value方式传到后端(value是选中option的vlaue值)

disabled表单不能选择

required必填

multiple可以选中多个选项(需要按ctrl多选)size设置了multiple，可以设置一次可见的行数。

2.option设置下拉菜单的一个选项。——》value选择的值selected设置默认选中项

3.对option进行分组——》label是分组名称，分组不能选择。disabled设置后，分组下面的所有option都不能选择。

datalist容器

textarea多行文本输入框

output

10+1020表示一个

用户的操作结果。

progress

50%s行内元素，表示任务的完成进度，一般显示为进度条样式。

meter指示器

max="500"value="455"low="150"high="350">

meter指示器，显示已知范围内的一个值，value在low和high显示绿色，其他区域显示橘色。

details折叠标签

details折叠标签，浏览器默认会折叠标签包裹内容，点击才能展开查看内容