html中无序标签怎么用,HTML用法和标签

本文详细介绍了HTML文档的基本结构,包括<head>和<body>的作用,以及<title>标签的重要性。同时,讲解了HTML标签的语法,强调了块级元素与行内元素的区别。CSS样式的优先级和meta标签的功能也被提及,特别是meta标签的http-equiv和name属性。此外,还涵盖了常用的body内标签,如段落、标题、超链接、列表和表格的使用方法。最后,讨论了表单元素和input类型的多样性和功能,以及如何通过form标签实现用户与服务器的交互。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

HTML文档结构

css样式优先级

1.声明为HTML5文档。

2.、是文档的开始标记和结束的标记。是HTML页面的根元素,在它们之间是文档的头部(head)和主体(body)。

3.

、定义了HTML文档的开头部分。它们之间的内容不会在浏览器的文档窗口显示。包含了文档的元(meta)数据。

4.

、定义了网页标题,在浏览器标题栏显示。

5.

、之间的文本是可见的网页主体内容。

HTML标签格式

1.HTML标签是由尖括号包围的关键字,如, 

2.HTML标签通常是成对出现的,比如:

,第一个标签是开始,第二个标签是结束。结束标签会有斜线。

3.也有一部分标签是单独呈现的,比如:


1.jpg等。

4.标签里面可以有若干属性,也可以不带属性

标签的语法:

1.内容部分标签名>

2.

几个很重要的属性:

1.id:定义标签的唯一ID,HTML文档树中唯一

2.class:为html元素定义一个或多个类名(classname)(CSS样式类名)

3.style:规定元素的行内样式(CSS样式)

[一]head内常用标签

9075541af851e370874cb02204882a7e.png

Meta标签介绍:

元素可提供有关页面的元信息,针对搜索引擎和更新频度的描述和关键词。

标签位于文档的头部,不包含任何内容。

提供的信息是用户不可见的。

meta标签的组成:meta标签共有两个属性,它们分别是http-equiv属性和name 属性,不同的属性又有不同的参数值,这些不同的参数值就实现了不同的网页功能。

1.http-equiv属性:相当于http的文件头作用,它可以向浏览器传回一些有用的信息,以帮助正确地显示网页内容,与之对应的属性值为content,content中的内容其实就是各个参数的变量值

2.name属性

主要用于描述网页,与之对应的属性值为content,content中的内容主要是便于搜索引擎机器人查找信息和分类信息用的。

[二]body内常用标签

加粗

斜体

下划线

删除

段落标签

标题1

标题2

标题3

标题4
标题5
标题6

特殊字符:

97cee645881d51b9eb59f0ec0e8de070.png

div标签和span标签

div标签用来定义一个块级元素,并无实际的意义。主要通过CSS样式为其赋予不同的表现。

span标签用来定义内联(行内)元素,并无实际的意义。主要通过CSS样式为其赋予不同的表现。

块级元素与行内元素的区别:

所谓块元素,是以另起一行开始渲染的元素,行内元素则不需另起一行。如果单独在网页中插入这两个元素,不会对页面产生任何的影响。

这两个元素是专门为定义CSS样式而生的。

注意:

关于标签嵌套:通常块级元素可以包含内联元素或某些块级元素,但内联元素不能包含块级元素,它只能包含其它内联元素。

p标签不能包含块级标签,p标签也不能包含p标签。

img标签

图片未加载成功时的提示

a标签

超链接标签

所谓的超链接是指从一个网页指向一个目标的连接关系,这个目标可以是另一个网页,也可以是相同网页上的不同位置,还可以是一个图片,一个电子邮件地址,一个文件,甚至是一个应用程序。

点我

href属性指定目标网页地址。该地址可以有几种类型:

绝对URL - 指向另一个站点(比如 href="http://www.jd.com)

相对URL - 指当前站点中确切的路径(href="index.htm")

锚URL - 指向页面中的锚(href="#top")

target:

_blank表示在新标签页中打开目标网页

_self表示在当前标签页中打开目标网页

列表

1.无序列表

  • 第一项
  • 第二项

type属性:

disc(实心圆点,默认值)

circle(空心圆圈)

square(实心方块)

none(无样式)

2.有序列表

  1. 第一项
  2. 第二项

type属性:

1 数字列表,默认值

A 大写字母

a 小写字母

Ⅰ大写罗马

ⅰ小写罗马

3.标题列表

标题1
内容1
标题2
内容1
内容2

[三]表格

表格是一个二维数据空间,一个表格由若干行组成,一个行又有若干单元格组成,单元格里可以包含文字、列表、图案、表单、数字符号、预置文本和其它的表格等内容。

表格最重要的目的是显示表格类数据。表格类数据是指最适合组织为表格格式(即按行和列组织)的数据

表格的基本结构:

序号姓名爱好

1Egon杠娘2Yuan日天

属性:

border: 表格边框.

cellpadding: 内边距

cellspacing: 外边距.

width: 像素 百分比.(最好通过css来设置长宽)

rowspan: 单元格竖跨多少行

colspan: 单元格横跨多少列(即合并单元格)

[四]form

功能:

表单用于向服务器传输数据,从而实现用户与Web服务器的交互

表单能够包含input系列标签,比如文本字段、复选框、单选框、提交按钮等等。

表单还可以包含textarea、select、fieldset和 label标签

属性:

3e6b4f7e0e86785bf398a9c575f793dd.png

表单元素:

基本概念:

HTML表单是HTML元素中较为复杂的部分,表单往往和脚本、动态页面、数据处理等功能相结合,因此它是制作动态网站很重要的内容。

表单一般用来收集用户的输入信息

表单工作原理:

访问者在浏览有表单的网页时,可填写必需的信息,然后按某个按钮提交。这些信息通过Internet传送到服务器上。

服务器上专门的程序对这些数据进行处理,如果有错误会返回错误信息,并要求纠正错误。当数据完整无误后,服务器反馈一个输入完成的信息。

[五]input

元素会根据不同的 type 属性,变化为多种形态。

e255c3c450b535ea3a93320511774ad6.png

属性说明:

name:表单提交时的“键”,注意和id的区别

value:表单提交时对应项的值

type="button", "reset", "submit"时,为按钮上显示的文本年内容

type="text","password","hidden"时,为输入框的初始值

type="checkbox", "radio", "file",为输入相关联的值

checked:radio和checkbox默认被选中的项

readonly:text和password设置只读

disabled:所有input均适用

[六]select标签

北京

上海

广州

深圳

属性说明:

multiple:布尔属性,设置后为多选,否则默认单选

disabled:禁用

selected:默认选中该项

value:定义提交时的选项值

label标签

定义: 标签为 input 元素定义标注(标记)。

说明:

label 元素不会向用户呈现任何特殊效果。

标签的 for 属性值应当与相关元素的 id 属性值相同。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值