Html的常用标签,列举至少5个,并注明作用?

Html的常用标签,列举至少5个,并注明作用?,第1张

<html>定义 HTML 文档。

<body>定义文档的主体。

<h1> to <h6>定义 HTML 标题

<hr>定义水平线。

<!-->定义注释。

一、Html的基本结构:

<!DOCTYPE html>

<html>

<head>

<meta  charset=utf-8">

<title></title>

</head>

<body>

网页的文本、图片等信息;

</body>

</html>

 二、Head部分:用于表示网页的元数据即描述网页的基本信息

其常用标签属性有:

1、title标签:浏览器标签页显示的标题

2、meta标签:其常用属性

①charset:设置文档的字符集编码格式。HTML5中设置字符集编码:<meta charset="UTF-8">

常见的字符集编码格式:

a.GB-2312:国标码,简体中文

b.GBK:扩展的国标码

c.UTF-8:万国码 Unicode 常用

②http-equiv属性:将我们的信息写给浏览器看,让浏览器按照这里面的要求执行,可选属性值:Content-Type(文档类型) refresh(网页定时刷新) set-cookie(设置浏览器cookie缓存) 需要配合content属性使用。(http-equiv属性只是表明需要设置哪一部分,具体的设置内容,放到content属性中)

③name属性:使用方法同“http-equiv”。将我们的信息写给搜索引擎看

常用且需要掌握的属性值:author(作者) keywords(网页关键字) description(网页描述) 这两个属性设置,网页必不可少。

3、link标签:链接网页图标(title前的小logo),其常用属性有:

①rel属性:声明链接文件的类型,此处选icon

②type属性:可以省略

③href属性:表示图片的路径地址

 三、body部分:网页的文本、图片等信息

标签的分类:

块级标签:显示为块,前后隔一行(自动换行)

行级标签:按行从左往右逐一显示。

1、 常见的块级标签:

①<h1></h1>......<h6><h6>:标题标签,自动加粗,h1最大,h6最小。

②<hr/>:水平线标签,添加一条水平线。

③<p></p>:段落标签,

④<br/>:换行标签,

⑤<blockquote/></blockquote>:引用标签,cite属性,表明引用的来源,一般引用网址

浏览器默认首行缩进。

⑥<pre></pre>:预格式标签,用于重载代码。浏览器默认显示样式:1、显示为等宽字体。 2、代码中的换行、

空格等元素能在浏览器中显示。

【补充】html 文件中空格的表示:&nbsp

2、 基于布局的块级标签

列表:无序列表、有序列表、定义列表

①有序列表:<ol></ol>列表项:<li></li>

②无序列表:<ul></ul>列表项:<li></li>

③定义列表(实现图文混排):<dl></dl>

列表标题:<dt>一般只有一项</dt>

列表描述项:<dd>可以有很多项</dd>

3、组合标签:<figure></figure>用于显示图片及图片标题

他有两个子标签:<img />图片

<figcaption></figcaption>图片的标题

例如:<figure>

<img src="img/EZ.jpg" height="20%" width="20%" alt="探险家"/>

<figcaption>探险家 伊泽瑞尔</figcaption>

</figure>

4、分区标签:<div></div>

 

5、常见的行级标签

<1>span(文本):无实际意义,用于包裹某部分文字,修改特定样式,例如:

这是<span style="color: redfont-size: 36px">span</span>中的文字

img(图片):其常用属性:①src:表示引用图片的地址。

路径地址的写法:相对路径:以当前文件为最准,去寻找图片地址

a、与文件处于同一层的图片,直接写图片名

b、图片在当前文件下一层:文件名/图片名

c、图片在当前文件上一层:../图片名

绝对路径:file:///盘符:/文件夹/图片名,但 是严禁使用

图片网址:网络上的图片链接,但是一般不用

②height和width:图片的高度和宽度。可以用CSS样式代替

③title:图片标。当鼠标指上之后显示的文字

④alt:当图片无法显示的时候,显示的文字

<2>em(倾斜强调)

<3>strong(加粗强调)

<4>b(加粗)

<5>i(倾斜)

Strong、em、b、i的区别

1、Strong、em都表示强调,Strong为粗体,em为斜体,而Strong的强调 程度逗比em高

2、Strong和b都能加粗,em和i都能倾斜,,但是Strong和em多了一层强调的语义 。H5要求标签尽可能实现语义化。

<6>q(短引用)

<7>small/big(缩小/放大字体):small和big分别是缩小和扩大字体,都可以多层嵌套直至上限或下限

<8>a(超链接)

1、href:超链接的路径,可以是网络链接,也可以是本地文件。

2、target:跳转页面打开的位置。_self自身页面,_blank新页面。

3、title:鼠标指在超链接上显示的名称。

4、Rel(被链接是当前的前/后一篇):指定被链接文档与当前文档的关系,搜索引擎 会利用该属性 获取更多的有关链接的信息:

rel="prev"被链接文档是当前文档的前一篇文 档,

rel="next"被链接文档是当前文档的后一篇文档,

rel="icon"被链接文档是当前文档的图标

rel="stylesheet"被链接文档是当前文档的样式表

5、Rev(当前是被链接的前/后一篇)

锚链接:

①本页面锚链接:a、设置锚点:<a name="top"></a>

b、跳转锚点:#name名

①页面间锚链接:a、在即将跳转页面的指定位置设置锚点

b、跳转锚点:页面地址.html#name名

<a href="02_常见的块级标签.html#Hbuilder">页面间锚链接</a><br/>

功能性链接: mailto用于给指定邮箱发送邮件

file:///e:/aaa.png打开本地文件

tencent://message/?uin=1315618220 给指定QQ发送息

<9>s标签,有误文本:删除线

<s>这是S标签中的文字</s><br />

<10>cite标签:浏览器显示为倾斜,常用于书、画作、作品的引用

<cite>这是cite中的文本</cite><br />

<11>code:计算机代码,不保留代码格式

<pre>

<code></code>

</pre>

<12>bdo:表示文本方向,属性:dir="ltr"表示从左往右,dir="rtl"表示从右往左

<bdo dir="rtl">1234567</bdo><br />

kbd:表示需要用户用键盘输入的内容,浏览器显示为等宽字体

请输入“<kbd>Esc</kbd>”推迟系统<br />

<13>sup:上标文本,sub:下标文本

x<sub>6</sub><br />

© &copy空格 &nbsp

© &copy空格 &nbsp<br />

<14>u:下划线

<u>这是下划线</u><br />

mark:高亮或标记文本,浏览器显示为黄色背景

<mark>mark</mark><br />

<HTML>,表示该文件为HTML文件

<HEAD>,包含文件的标题,使用的脚本,样式定义等

<TITLE>---</TITLE>,包含文件的标题,标题出现在浏览器标题栏中

</HEAD>,<HEAD>的结束标志

<BODY>,放置浏览器中显示信息的所有标志和属性,其中内容在浏览器中显示.

</BODY>,<BODY>的结束标志

</HTML>,<HTML>的结束标志

其它主要标签,以下所有标志用在<BODY></BODY>中:

<A,HREF="…"></A>,链接标志,"…"为链接的文件地址

<IMG,SRC="…">,显示图片标志,"…"为图片的地址

<BR>,换行标志

<P>,分段标志

<B></B>,采用黑体字

<I></I>,采用斜体字

<HR>,水平画线

<TABLE></TABLE>,定义表格,HTML中重要的标志

<TR></TR>,定义表格的行,用在<TABLE></TABLE>中

<TD></TD>,定义表格的单元格,用在<TR></TR>中

<FONT></FONT>,字体样式标志

属性:

属性是用来修饰标志的,属性放在开始标志内.

例:属性bgcolor="BLACK"表示背景色为黑色.

引用属性的例子:

<BODY,bgcolor="BLACK"></BODY>表示页面背景色为黑色

<TABLE,bgcolor="BLACK"></TABLE>表示表格背景色为黑色.

常用属性:

对齐属性,范围属性:

ALIGN=LEFT,左对齐(缺省值),WIDTH=象素值或百分比,对象宽度.

ALIGN=CENTER,居中,HEIGHT=象素值或百分比,对象高度.

ALIGN=RIGHT,右对齐.

色彩属性:

COLOR=#RRGGBB,前景色,参考色彩对照表.

BGCOLOR=#RRGGBB,背景色.

<center>表示绝对居中.

<table></table>表格标识的开始和结束.

属性:

cellpadding=数值单位是像素,定义表元内距

cellspacing=数值单位是像素,定义表元间距

border=数值单位是像素,定义表格边框宽度

width=数值单位是像素或窗口百分比,定义表格宽度

background=图片链接地址,定义表格背景图

<tr></tr>表格中一个表格行的开始和结束

<td></td>表格中行内一个单元格的开始和结束

属性:

Colspan="",单元格跨越多列

Rowspan="",单元格跨越多行

Width=""定义表格宽度

Height=""定义表格高度

Align=""对齐方式

Valign=""

Border="",边框宽度

Bgcolor="",背景色

Bordercolor="",边框颜色

Bordercolorlight="",边框明亮面的颜色

Bordercolordark="",边框暗淡面的颜色

Cellpadding="",内容与边框的距离(默认为2)

Cellspacing="",单元格间的距离(默认为2)

太多了只能传一些 具体可以去这个网站 http://smileweixiao2012.blog.163.com/blog/static/1699234602010102210650924/


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/zaji/7063228.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-04-01
下一篇 2023-04-01

发表评论

登录后才能评论

评论列表(0条)

保存