2、HTML常用标签

HTML标签:

  <html lang="en">/*告诉搜索引擎爬虫,

                              我们的网站是关于什么内容的,en:代表英文*/

  </html>

<meta content="这是一个衣服" name="description">/*SEO技术*/

<meta content="服装" name="keywords">

<del></del>:划到原来的内容

<address></address>:地址标签

<div></div>:快级标签

<span></span>:化为整体

<bdo></bdo>:定义文本排序显示方向,必须要与其属性值dir一起使用。

      取值为ltr,则文本从左向右书写,若取值为rtl,则文本从右向左显示

      。

<blockquote></blockquote>:定义大块内容引用

border属性:定义边框线,例:border:3px solid green;

padding属性:定义内间距 例:padding:10px;

<cite></cite>:

          定义用法:<cite>标签通常表示它所包含的文本对某个参考文献的

                        引用,比如书籍或者杂志的标题,被引用部分将 以斜

                        体显示,一般包含在<a>标签内。

<pre></pre>:被包围在<pre>标签元素中的文本通常会保留空格和

                        换行。而文本也会呈现为等宽字体。

<code></code>:将文本变成等宽字体;暗示这段文本是源程序代码,

                            浏览器可以做出自己的样式处理,而<pre>则没有这

                            向功能。

<ins></ins>:定义已经被插入文档中的文本,一般与<del></del>一

                      起使用,表示文本的更新和修正。

<dfn></dfn>:标签可标记那些对特殊术语或短语的定义。

                现在流行的浏览器通常用斜体来显示<dfn>中的文本。将来,

                <dfn>还可能有助于创建文档的索引或术语表。

                与其他许多基于内容的样式和物理样式标签一样,<dfn>标

                签尽量少用为秒。作为一种通用样式,尤其在技术文档中,

                当第一次新的术语时,应该将它们与普通文本分开,而从哪

                以后就不需要在用任何标记了。

<hr />标签:分隔线(横向分隔线)

<br />标签:换行

<strong></strong>标签:加粗

<b></b>标签:加粗

<i></i>标签:斜体效果

<em></em>标签:表示强调,显示效果为斜体。

<u></u>:下划线

<kbd></kbd>标签:定义键盘文本。它表示文本是从键盘上键入的。其

                  经常用在与计算机相关的文档或手册中。

<mark></mark>标签:将“标签内容”以高亮显示的方式突出那些要

                          在视觉上向用户说明其重要性的文字内容。mark元

                          素当前比较常见的用法,就是在搜索结果中以高亮的

                          视觉效果标示用户所指定的关键词。

<p></p>标签:段落标签,带有自动换行功能。自成一段。

<div></div>标签:一个容器,可称为块。

<q></q>标签:分离文本中的引语,定义一个引用。表现形式为双引号。

                      常用cite将引用来源标注清楚。

&lt:小于号或显示标记(左尖括号)

&gt:大于号或显示标记(右尖括号)

&amp:可用于显示其他特殊字符

&quot:引号

&reg:已注册

&copy:版权

&trade:商标

&ensp:半个空白位

&emsp:一个空位白

&nbsp:不断行的空白

<ruby></ruby>标签:定义ruby注释

<rp></rp>标签:定义若浏览器不支持ruby元素显示的内容。

<rt></rt>标签:定义ruby注释的解释,如:<rt>hua zi</rt>

<table></table>标签:定义HTML表格

<tr></tr>标签:定义表格的行

<td></td>标签:定义表格中的列

表格属性:

        border:边框宽度

        rowspan:纵向合并

        colspan:横向合并

<caption></caption>标签:指定表格外面正上方的标题。需写

                在<table></table>标签的内部方可。

    caption-side属性:定义caption内容的上下位置。

<th></th>标签:定义表格中的表头单元格,字体加粗。

  cellpadding属性:指定表格单元格内文字距边框的距离

  cellspacing属性:指定单元格之间的距离。

<col></col>标签:规定了<colgroup></colgroup>元素内部的每

                一列的列属性。widthing规定了每一列的宽度。

              span属性:规定<col><col>应该横跨的列数。

              valign属性:设置垂直对齐方式。

              align属性:设置水平对齐方式。

    border-collapse属性:设置表格的边框是否被合并为一个单一的

                        边框,还是在HTML中分开显示,效果为颜色填充完

                          整个表格。

              属性值:

                    separate:默认值,边框会被分开。不会忽略

                                    border-sapcing和empty-cells属性

                    inherit:规定应该从父元素继承border-collapse属性的值。

                    collapse:如果可能,边框会合并为一个单一的边框,会忽

                                    略 border-sapcing和empty-cells属性

      empty-cells属性:设置是否显示表格中的空单元格。

      border-spacing属性:设置表格单元格之间的距离。

              cellspacing属性的区别为:border-spacing属性为CSS属性。

                      而cellspacing属性为HTML属性,在应用行内样式时,

                        border-spacing属性应该放在style属性内。

    align属性:设置水平方向的对齐方式。

    valign属性:设置垂直方向的对齐方式。

<samp></samp>标签:定义计算机代码样本。

                    如:<samp>Http 403 禁止</samp>

<small></small>标签:定义小号文本。

<sub></sub>标签:定义下标文本。如化学式当中的下角数字

<sup></sup>标签:定义上标文本。如数学表达式中的指数。

<time></time>标签:定义时间/日期。

<var></var>标签:定义变量。

<frameset></frameset>标签:HTML5不支持此标签,但有些浏览器

          还是支持的,此标签定义一个框架,其被用来组织一个或多个

        <frame>元素。每个frame有各自独立的文档。

<frame></frame>标签:用于在框架集<frameset>里定义一个窗格(

                  框架)。每个窗格都可以具有不同的属性,比如边框、滚动条

                  、可否调整大小等。

            注:为了让包含框架的页面符合W3C标准,需将文档类型设置为

                  "Frameset DTD"。

            要点:如果使用了<frameset></frameset>标签,就不能再使

                  用<body></body>标签!反之亦然。它们不能同时使用。

                不过,假如你为不支持框架的浏览器定义了<noframes>

                </noframes>的话,那么在<noframes></noframes>标

                签之间,你需要将内容放在<body></body>标签里。

rows属性:rows属性规定<frameset>中行的尺寸和数量,

frameborder属性:设置是否显示边框。

<noframes><noframes>标签:可为那些不支持框架的浏览器显示文本

              。noframes标签位于frameset元素内部。

name属性:用于在JavaScript中引用元素,或者作为连接的目标。

&diams:方片

大方片:Ctrl+Shift+Z;搜狗输入法特殊字符。&#9670

<object></object>标签:调用对象,定义一个嵌入的对象,请使用此

              元素向您的XHTML页面添加多媒体。此元素允许您规定插入

              HTML文档中的对象的数据和参数,以及可用来显示和操作数

              据的代码。

        用法示例:<object data="img/P1050373.JPG"

                        type="image/jpeg" width="400" height="300">

                        花的图片</object>

a:visited:表示点击过后的颜色的选择器

a:hover:鼠标浮动在上面的颜色的选择器

a:link:正常情况下默认的颜色选择器。

a标签的id属性值通常用于定义快速定位如:

    <a href="#name">*****</a>

  则定位的id部分应该写为:

      <a id="name"></a>

<base>标签及其href属性:规定页面上的所有的相对链接访问的默认

              URL或默认目标。在一个文档中,最多能使用一个<base>标签

            ,请把<base>标签排在<head></head>元素中第一个元素的

            位置,这样head区域中其他元素就可以使用<base>元素中的信

            息了。如果使用此标签,则必须具有href或者target属性或者两

            者都具备。

target属性:指定所链接的页面在浏览器中的打开方式,其值主要有以下

          几种:

            _blank:在新浏览器窗口中打开链接文件。

            _parent:将链接的文件载入含有该链接框架的父框架集或父窗

                            口中

            _self:在同一框架或窗口中打开所链接的文档

            _top:在当前的整个浏览器窗口中打开所链接的文档,因而会删

                      除所有框架

a:active:用来定义超链接被鼠标点击时的颜色。

a:visited:用来定义被访问过的颜色

a:hover:用来定义鼠标悬浮于超链接上时的颜色。

<link />标签:是用来与外部文件建立链接。例如:

      引入外部CSS样式表:

                <link href="style.css" type="text/css" rel="stylesheet" />

      href属性:用来指定文件路径

      charset属性:规定了被链接文档的字符编码方式,在HTML5中已

          被淘汰。

      hreflang属性:规定被链接文档的语言,如:hreflang="zh"代表是

          个中文网站。

      type属性:指定所链接文档的MIME类型,CSS的MIME类型是

              type/css,

      media属性:媒体类型,设定被链接文档将显示在什么设备上。

            属性值有{screen,tty,tv,projection,handheld,print,braille

          ,aural,all}。

      rel属性:规定链接类型,值当前文档与被链接文档之间的关系。

            属性值:Alternate,appendix,bookmark,chapter,contents,

            copyright,glossary,help,home,index,next,prev,section,start,

            stylesheet,subsection

      rev属性:指定被链接文档与当前文档之间的关系,在html5中已被

            淘汰。属性值与上面相同。

<caption></caption>标签:指定表格外面正上方的标题。

<textarea><textarea>标签:定义一个文本区域 (text-area) (一个多

            行的文本输入区域)。用户可在此文本区域中写文本。在一个文

            本区中,您可输入无限数量的文本。文本区中的默认字体是等宽

            字体 (fixed pitch)。

    cols属性:规定文本区域内可见的列数。

    rows属性:规定文本区域内可见的行数。

    name属性:为此文本区规定一个名称。

<button></button>标签:<button> 标签定义按钮。您可以在

            button 元素中放置内容,比如文档或图像。这是该元素与由

            input 元素创建的按钮的不同之处。

    name属性:为按钮规定唯一的名称。

    type属性:定义按钮的类型。

    value属性:为按钮规定初始值,该值可通过脚本改变。

    onClick事件属性:例子:onClick="所调用函数等"

<form><form>标签:创建供用户输入的表单。

    action属性:定义一个 URL。当点击提交按钮时,向这个 URL 发送数

            据。

多选框示例:

    <input type="search" name="search" list="yuYan" />

    <input type="submit" value="搜索" />

    <datalist id="yuYan">

        <option value="">*****</option>

        .......

        <option value="">*****</option>

    </datalist>

©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 212,294评论 6 493
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 90,493评论 3 385
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 157,790评论 0 348
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 56,595评论 1 284
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 65,718评论 6 386
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 49,906评论 1 290
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 39,053评论 3 410
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 37,797评论 0 268
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 44,250评论 1 303
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 36,570评论 2 327
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 38,711评论 1 341
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 34,388评论 4 332
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 40,018评论 3 316
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 30,796评论 0 21
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,023评论 1 266
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 46,461评论 2 360
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 43,595评论 2 350

推荐阅读更多精彩内容

  • HTML标签解释大全 一、HTML标记 标签:!DOCTYPE 说明:指定了 HTML 文档遵循的文档类型定义(D...
    米塔塔阅读 3,229评论 1 41
  • 0.B/S结构 浏览器服务器模式,web浏览器是客户端最主要的应用软件.将客户端使用web进行统一,系统功能实现集...
    liusong007阅读 1,050评论 0 1
  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 13,737评论 1 92
  • HTML 5 HTML5概述 因特网上的信息是以网页的形式展示给用户的,因此网页是网络信息传递的载体。网页文件是用...
    阿啊阿吖丁阅读 3,875评论 0 0
  • 1.情绪管理不错。 2.陪伴: 下午约上小伙伴开心的体验长江轮渡,看滚滚长江,看长江风景。 晚上,孩子和妈妈一起完...
    azhifeng阅读 175评论 0 0