天津建站管理系统信息,网站如何做seo推广方案,大中型企业网络设计方案,wordpress标签标题目录
1.b/strong标签
2.i/em 标签
3.u标签
4.del删除线
5.br换行
6.p标签 *
7.pre 预处理标签
8.span标签**
9.div标签***
10.sub标签
11.sup标签
12.hr标签
13.hn标签
14.HTML5中语义标签
特殊字符
15.多媒体标签
img***
a 标签***
第一种用法#xff1a;…目录
1.b/strong标签
2.i/em 标签
3.u标签
4.del删除线
5.br换行
6.p标签 *
7.pre 预处理标签
8.span标签**
9.div标签***
10.sub标签
11.sup标签
12.hr标签
13.hn标签
14.HTML5中语义标签
特殊字符
15.多媒体标签
img***
a 标签***
第一种用法超链接
第二种用法锚点
audio 标签
video标签
16.表格标签**
基本表格
带标题的表格
跨行跨列表格
表格嵌套
17.列表标签***
ul
ol
dl
18.表单标签***
form标签
input
select
textarea 1.b/strong标签
这个标签是用于加粗文字的一般用于强调某个部分的作用。 !DOCTYPE html
html langen
headmeta charsetUTF-8titleb/strong标签的使用/title
/head
body
2022年3月23日 bHTML/b文档也叫做web strong页面/strong HTML 标签 HTML 标记标签通常被称为 HTML 标签 (HTML tag)。 HTML 标签是由尖括号包围的关键词,比如 HTML 标签通常是成对出现的
/body
/html 在以后使用中推荐使用 strong 标签。
2.i/em 标签
它们的使用是让文字变为斜体 !DOCTYPE html
html langen
headmeta charsetUTF-8titleb/strong标签的使用/title
/head
body
i2022年3月23日/i bHTML/b文档也叫做web strong页面/strong HTML 标签 HTML em标记/em标签通常被称为 HTML 标签 (HTML tag)。 HTML 标签是由尖括号包围的关键词,比如 HTML 标签通常是成对出现的
/body
/html 3.u标签
它的作用是给文字添加下划线 !DOCTYPE html
html langen
headmeta charsetUTF-8titleb/strong标签的使用/title
/head
body
i2022年3月23日/i bHTML/b文档也叫做web strong页面/strong HTML 标签 HTML em标记/em标签u通常/u被称为 HTML 标签 (HTML tag)。 HTML 标签是由尖括号包围的关键词,比如 HTML 标签通常是成对出现的
/body
/html 4.del删除线
它的使用是给文字添加删除线 !DOCTYPE html
html langen
headmeta charsetUTF-8titleb/strong标签的使用/title
/head
body
i2022年3月23日/i bHTML/b文档也叫做web strong页面/strong HTML del标签/del HTML em标记/em标签u通常/u被称为 HTML 标签 (HTML tag)。 HTML 标签是由尖括号包围的关键词,比如 HTML 标签通常是成对出现的
/body
/html 5.br换行
不需要/br !DOCTYPE html
html langen
headmeta charsetUTF-8titleb/strong标签的使用/title
/head
body
i2022年3月23日/i bHTML/b文档也叫做web strong页面/strong HTML del标签/del HTML em标记/em标签u通常/u被称为 HTML 标签 (HTML tag)。 brHTML 标签是由尖括号包围的关键词,比如 HTML 标签通常是成对出现的
/body
/html 6.p标签 *
这个标签是一个段落标签它本身就自带了行间距。在这个标签中的文件会独占一行。 !DOCTYPE html
html langen
headmeta charsetUTF-8titlep标签的使用/title
/head
body
pHTML 不是编程语言是一种超文本标记语言用来制作网页的一门语言由标签组成的比如图片标签、链接标签、视频标签...所谓超文本有两层含义/p
phtml 可以加入图片、声音、动画、多媒体等内容超越了文本的限制/p
phtml 可以从一个文件跳转到另一个文件与世界各地主机的文件连接超级链接文本/p
pHTML 页面也称为 HTML 文档/p
pHTML 文档的后缀名必须是.html 或 .htm浏览器的作用是读取HTML文档并以网页的形式显示出它们HTML 文档里按下多次空格在网页中只会显示一个空格并且在 HTML 文档里按下回车键在网页中也不会进行换行/p
/body
/html 7.pre 预处理标签 这个标签的作用是书写的内容与显示的样式内容相同。 !DOCTYPE html
html langen
headmeta charsetUTF-8titlepre标签/title
/head
body
pre静夜思床前明月光疑是地上霜。举头望明月低头思故乡。
/pre
/body
/html 这个标签一般用于显示源码的。
8.span标签** 它是一个行内标签它没有什么特殊的意义但是在使用中却比较多。一般会接合 css 样式来修饰文本。 !DOCTYPE html
html langen
headmeta charsetUTF-8titlespan标签/titlestylespan {color: red;}/style
/head
body
静夜思版本说明span明代版本/span这是目前流传比较广泛的版本。
/body
/html 9.div标签***
它是一个块状标签一般用于页面布局。 !DOCTYPE html
html langen
headmeta charsetUTF-8titlediv标签/title
/head
body
div classdiv2
div标签是一个块状标签
一个 div 标签会独占一行
/div
div iddiv1
它没有任意的属性
但是我们可以给它自定义一个属性
例如id、class 等。
/div
/body
/html 10.sub标签
这个标签的作用是指定下标一般用于数字方面。 !DOCTYPE html
html langen
headmeta charsetUTF-8titlesub/title
/head
body
logsub2/sub
/body
/html 11.sup标签
这个标签的作用是指定上标一般用于数字方面。 !DOCTYPE html
html langen
headmeta charsetUTF-8titlesup/title
/head
body
2sup3/sup8
/body
/html 12.hr标签
这个标签用于给页面划水平线。不需要/hr !DOCTYPE htmlhtml langenhead meta charsetUTF-8 titlehr/title/headbody静夜思hr size5 width100 alignleft床前明月光疑是地上霜。举头望明月低头思故乡。/body/html 标签属性说明 size用于指定线的粗线值越大线越粗
width用于指定线的宽度值越大越宽
align用于指定线的对齐方式有以下三个值left居左对齐center居中对齐它是默认值right居右对齐 13.hn标签
这个标签中的 n 是 1 ~ 6 的数字一般用于标题。 !DOCTYPE html
html langen
headmeta charsetUTF-8titlehn/title
/head
body
h1h1/h1
h2h2/h2
h3h3/h3
h4h4/h4
h5h5/h5
h6h6/h6
/body
/html 14.HTML5中语义标签
这个标签是 HTML5 中定义的新的语义标签有以下几个 header用于定义页面的顶部 article用于表示文章的内容 section用于定义内容的分块信息 nav用于定义页面的导航部分 aside用于定义页面的侧边栏 footer用于定义页面的页脚部分 address用于定义用户邮件、地址等信息 !DOCTYPE html
html langen
headmeta charsetUTF-8titlehtml5新标签的使用/title
/head
body
header这是头部信息/header
nav首页 | 新闻 | 音乐 | 游戏/nav
aside侧边栏/aside
footercopyright; 2024/footer
/body
/html 特殊字符
在 HTML 中有很多特殊字符如下表所示
特殊字符转义码空格nbsp;lt;gt;版权copy;
15.多媒体标签
img***
这个标签的作用是在页面中引入图片 !DOCTYPE html
html langen
headmeta charsetUTF-8titleimg标签/title
/head
body
img srcimage/5.jpeg width200 height50 border1 alt这是图片 title这是图片
/body
/html 标签属性说明 src这个属性非常重要用于指定图片显示的路径可以是相对路径也可以是绝对路径。简单来 说在 windows 中带了盘符在 Linux 中以/开头的路径在链接中以 http:// 开头的就是绝对路径其他都是
相对路径。相对路径的参考点就是这个对象本身。
width用于指定图片显示的宽度如果只指定宽则高会根据宽度来等比例绽放
height用于指定图片显示的高度如果只指定高则宽度会根据高度来等比例绽放。注意width和height两个属性不要同时指定。
border用于指定力图片显示的边框粗细默认是无边框
alt是在图片不能正常显示时才会显示这个文字内容
title用于当鼠标移动到图片上时显示的提示信息。一般用于搜索引擎优化。 a 标签***
这个标签是用于作链接的标签。
第一种用法超链接 !DOCTYPE html
html langen
headmeta charsetUTF-8titlea标签/title
/head
body
a hrefhttps://www.baidu.com百度/abr
a hrefhttp://www.baidu.com target_blank打开百度/abr
/body
/html 属性说明
href这个属性是一个必须属性用于指定要打开的目标地址
target链接打开的方式有以下几个值- _blank在新窗口打开- _self在本窗口打开默认值- _top在父窗口打开一般用于 frame 框架时- _parent在父窗口打开一般用于 frame 框架时
第二种用法锚点 !DOCTYPE html
html langen
headmeta charsetUTF-8title锚点/title
/head
body
a href#bottom底部/a | a hrefdemo2.html#bottomdemo2.html/a
img srcimage/6.jpeg
a namebottom/a
/body
/html!DOCTYPE html
html langen
headmeta charsetUTF-8titledemo2/title
/head
body
a hrefdemo1.htmldemo1.html/a
img srcimage/7.jpeg
a namebottom/a
/body
/html audio 标签
这个标签是用于播放音乐的标签。常用支持格式为 mp3 格式。 !DOCTYPE html
html langen
headmeta charsetUTF-8titleaudio/title
/head
body
audio srchttps://www.runoob.com/try/demo_source/horse.mp3 controlscontrols autoplayautoplay/audio
audio controlssource srchttps://www.runoob.com/try/demo_source/horse.mp3
/audio
/body
/html 标签属性说明
1. controls它是用于对播放器进行控制器的即显示播放器的控制按钮
2. src用于指定音频文件的路径
3. autoplay指定是否自动播放
4. loop指定是否循环播放
video标签 !DOCTYPE html
html langen
headmeta charsetUTF-8titlevideo/title
/head
body
video srchttps://www.runoob.com/try/demo_source/movie.mp4 controls autoplay width200/video
video controlssource srchttps://www.runoob.com/try/demo_source/movie.mp4
/video
/body
/html 标签属性说明
1. src指定要播放的视频地址可以是相对路径也可以是绝对路径。这个标签所支持的视频格式不多 目前只把持 mp4、ogg 两种
2. controls显示播放控制按钮
3. autoplay自动播放
4. loop自动循环
5. width设置播放器的宽度
6. height设置播放器的高度
16.表格标签**
在我们进行数据展示时很多时候都会用到表格特殊是在后台进行数据管理时或者显示列表数据时就会用表格。
要使用表格就需要用到 table 标签而表格是由行和列组成。行的标签是 tr而列的标签是 td 或 th。
基本表格 !DOCTYPE html
html langen
headmeta charsetUTF-8title简单表格/title
/head
body
table width100 border1 cellspacing0 cellpadding0trtd1/tdtd2/tdtd3/td/trtrtd4/tdtd5/tdtd6/td/tr
/table
/body
/html 表格的标签和属性说明 table用于绘制表格
tr用于绘制表格的行
td用于绘制表格的列单元格
width指定表格的宽度也可以是 td 的属性
border指定表格的边框粗细
cellspacing指定单元格之间的间距
cellpadding指定单元格边框与单元格中内容的距离
align用于指定表格对齐方式- left左对齐默认值- center居中对齐- right右对齐align属性可以是 table也可以是 tr还可以是 td。如果是 table 的表示对整个表格有效如果是 tr 的表示对当前行有效如果是 td 的表示只对当前的单元格有效。
带标题的表格 !DOCTYPE html
html langen
headmeta charsetUTF-8title带标题的表格/title
/head
body
!-- 我们画一个三行三列的表格 --
table width200 border1 cellspacing0caption第二个表格/captiontheadtrth编号/thth姓名/thth年龄/th/tr/theadtbodytrtd1/tdtd2/tdtd3/td/trtrtd4/tdtd5/tdtd6/td/trtrtd7/tdtd8/tdtd9/td/tr/tbodytfoottrtd/tdtdhello/tdtd/td/tr/tfoot
/table
/body
/html 使用 caption 来指定表格的标题使用 thead 标签来指定表格的头tbody 来指定表格数据区tfoot 指定表格的尾部。
td 和 th 的区别 td中的内容是普通格式而 th 中的内容是加粗的格式 td中的内容是左对齐而 th 中的内容是居中对齐
跨行跨列表格 !DOCTYPE html
html langen
headmeta charsetUTF-8title跨行跨列的列表/title
/head
body
table width200 border1 cellspacing0tr aligncentertd colspan21/tdtd3/tdtd4/td/trtr aligncentertd5/tdtd6/tdtd7/tdtd rowspan28/td/trtr aligncentertd9/tdtd10/tdtd11/td/tr
/table
/body
/html 相关属性说明
1. colspan用于指定要跨多少列它的值是一个数字
2. rowspan用于指定要跨多少行它的值是一个数字
表格嵌套 !DOCTYPE html
html langen
headmeta charsetUTF-8title表格嵌套/title
/head
body
table width150 border1 cellspacing0trtd1/tdtd2/td/trtrtd3/tdtdtable width100% border1 cellspacing0trtd41/tdtd42/td/trtrtd43/tdtd44/td/tr/table/td/tr
/table
/body
/html 17.列表标签***
在 HTML 中列表标签有以下几种 ul ol dl
ul
它是无序列表标签 !DOCTYPE html
html langen
headmeta charsetUTF-8titleul/title
/head
body
ul typecircleli西安/lili北京/lili重庆/liliulli1/lili2/lili3/li/ul/li
/ul
/body
/html 标签和属性说明 ul用于指定无序列表
li指定列表中的某一项
type指定无序列表的格式有以下几个值了解- disc实心圆形默认值- square实心方形- circle空心圆形 ol
它是有序列表 !DOCTYPE html
html langen
headmeta charsetUTF-8titleol/title
/head
body
ol type1li北京/lili上海/lili天津/li
/ol
ol typeali北京/lili上海/lili天津/li
/ol
ol typeAli北京/lili上海/lili天津/li
/ol
ol typeili北京/lili上海/lili天津/li
/ol
/body
/html type属性有以下值 1. 数字默认值
2. a以小写字母 a 开始
3. A在大写字母 A 开始
4. i以罗马字开始 dl
它数据列表 !DOCTYPE html
html langen
headmeta charsetUTF-8titledl/title
/head
body
dldt陕西地名/dtdd西安/dddd潼关/dddd宝鸡/dd
/dl
/body
/html 18.表单标签***
form标签
这个标签是用于表单提交的标签一般在与用户交互时就会用到 form 标签。 !DOCTYPE html
html langen
headmeta charsetUTF-8titleform表单标签/title
/head
body
form nameform1 actiondemo1.html methodpostinput typesubmit value提交
/form
/body
/html 标签属性说明
name用于给这个表单取一个唯一的名称便于后续使用 js 来操作这个表单
action表单提交的地址
method表单提交的方式有以下两个值- get表单以 get 方式提交- post表单以 post 方式提交 补充get和post提交的区别 get提交的数据会以参数的形式体现在浏览器地址栏中而 post提交的数据是在请求头中 get提交方式提交的数据不能超过4k大小而post提交方式理论上是没有大小限制的 input
这是表单元素中非常重要一组标称它有很多类型 text最常见的类型用于提交文本字符串内容 password用于提交密码数据 radio单选按钮 checkbox多选按钮 submit提交按钮 reset重置按钮 button普通按钮 image图片按钮 file文件上传域 !DOCTYPE html
html langen
headmeta charsetUTF-8titleform2表单元素之input的使用/title
/head
body
form action methodpostinput typetext namename placeholder姓名brinput typepassword namepassword placeholder密码brinput typenumber nameage value18 placeholder年龄brinput typeemail nameemail placeholder邮箱brinput typeradio namegender value男 男 input typeradio namegender checked value女 女 brinput typecheckbox namelove value看书 checked 看书 input typecheckbox namelove checked value电影 电影 input typecheckbox namelove value游戏 游戏brinput typefile namefilebrinput typebutton namebtn value普通按钮 brinput typereset namereset value重置brinput typesubmit namesubmit value提交brinput typeimage srcimage/8.jpeg width50
/form
/body
/html select
select是下拉列表标签 !DOCTYPE html
html langen
headmeta charsetUTF-8titleform表单之下拉列表/title
/head
body
form action methodpostselect namecityoption--请选择--/optionoption value西安西安/optionoption selected value北京北京/optionoption value上海上海/option/select
hr
select namehobby size3 multipleoption value看书看书/optionoption value电影电影/optionoption value音乐音乐/optionoption value游戏游戏/option/select
/form
/body
/html 标签属性说明 name表单提交时要获取对应元素值是所需要的属性
value指定select中每一个子元素的值
size指定 select 可看到的元素个数默认值是 1
multiple表示可以多选 textarea
这个标签是用于输入大文本内容的标签。 !DOCTYPE html
html langen
headmeta charsetUTF-8titleform表单之textarea/title
/head
body
form action methodposttextarea namecontent cols50 rows5内容/textarea
/form
/body
/html 标签属性说明 name用于获取元素值的属性
cols用于指定文本框的宽度
rows用于指定文本框的高度