美文网首页HTML5
HTML5结构体和标签大全

HTML5结构体和标签大全

作者: MaShuai丨 | 来源:发表于2017-10-13 17:40 被阅读293次
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
</head>
<body>

</body>
</html>
  • <!DOCTYPE>: 定义文档类型.

  • html

    • 告诉浏览器,这是一个网页。所有的标签,都必须写到html里面。
  • head

    • 指定网站的标题/指定网站的小图片
    • 添加网站的SEO信息(指定网站的关键字/指定网站的描述信息)
    • 外挂一些外部的css/js文件。
    • 添加一些浏览器适配相关的内容。
  • head标签的注意点

    • 一般情况相爱,写在head标签内部的内容,都不会给用户查看。
  • title

    • 专门用于指定网站的标题,并且这个指定的标题将来还会作为用户保存网站的默认标题。
  • title标签的注意点

    • title必须写在head的里面
  • body

    • 网页的内容必须写在body里面。

其他常用的标签

  • 1.块级元素
    • 标题<h></h>
    • 有序列表<ol><li></li></ol>
    • 无序列表<ul><li></li></ul>
    • 定义列表<dl></dl>
    • 段落标签<p></p>
    • 预格式文本<pre></pre>
    • 大段引用<blockquote></blockquote>
    • 小段引用<q></q>
    • 划分区块<div></div>
    • 定义<figure></figure>
    • 音频<audio></audio>
    • 视频<video></video>
    • 表格<table></table>
    • 表单<form></form>
    • 装载独立文章<article>
    • 定义文档章节<section>
    • 定义非正文内容<aside>
    • 页眉<header>
    • 页脚<footer>
    • 导航链接部分<nav>
    • 为文档或 section 定义联系信息<address>
    • 制作更小字号的文本<small>

  • 2.内联元素

    • <div>:定义块级元素.
    • <span>:定义行业元素.
    • <header>51:定义区段或页面的页眉.(头部)
    • <footer>5:定义区段或页面的页脚.(足部)
    • <section>5:定义文档中的区段.
    • <article>5:定义文章.
    • <aside>5:定义页面内容之外的内容.
    • <details>5:定义元素的细节.
    • <summary>5:定义 <details> 元素可见的标题.10. <dialog>5:定义对话框或窗口.
    • <nav>:定义导航.
    • <hgroup>5:定义标题组
    • <table>:定义表格.
    • <thead>:定义页眉.
    • <tbody>:定义主体.
    • <tfoot>:定义页脚.
    • <caption>:定义标题.
    • <th>:定义表头.
    • <tr>:定义一行.
    • <td>:定义单元格.

  • 3.内联块元素

    • 图片<img />
    • 内联框架<iframe></iframe>
    • <img>:定义图像.注意加上alt属性
    • <a>:定义超链接.
    • <map>:定义图像映射。
    • <area>:定义图像地图内部的区域.
    • <figure>5:定义媒介内容的分组.
    • <figcaption>5:定义 <figure> 元素的标题.

  • 4.表单标签

    • <form>:定义表单.(表单包含在form标签中)
    • <input>:定义输入域.
    • <textarea>:定义文本域.(多行)
    • <label>:定义一个控制的标签.(input 元素的标注)
    • <fieldset>:定义域.
    • <legend>:定义域的标题.
    • <select>:定义一个选择列表.
    • <optgroup>:定义选择组.
    • <option>:定义下拉 列表的选项.
    • <button>:定义按钮.(定义围绕表单中元素的边框.)
    • <fieldset>:定义围绕表单中元素的边框.
    • <legend>:定义 fieldset 元素的标题.
    • <fieldset>5:定义选项列表.与input 元素配合使用该元素,来定义 input 可能的值.
    • <keygen>5:定义表单的密钥对生成器字段.
    • <output>5:定义不同类型的输出,比如脚本的输出

  • 5.表格标签

    • <table>:定义表格.
    • <thead>:定义页眉.
    • <tbody>:定义主体.
    • <tfoot>:定义页脚.
    • <caption>:定义标题.
    • <th>:定义表头.
    • <tr>:定义一行.
    • <td>:定义单元格.

  • 6.列表标签

    • <ul>:定义无序列表.
    • <ol>:定义有序列表.
    • <li>:定义列表项.
    • <dl>:定义自定义列表.
    • <dt>:定义自定义列表项.
    • <dd>:定义自定义的描述.

  • 7.音频/视频

    • <audio>5:定义声音内容.
    • <source>5:定义媒介源.
    • <track>5:定义用在媒体播放器中的文本轨道.
    • <video>5:定义视频.

  • 8.格式标签

    • 文章标签

      • 1.<h1>-<h6>:定义 HTML 标题.
      • 2.<p>:定义段落.
      • 3.< br>:定义换行.
        1. < hr>:定义水平线.
        1. <bdo>:定义文字方向.
        1. <pre>:定义预格式文本.
        1. <abbr>:定义缩写.
        1. <address>:定义文档作者或拥有者的联系信息.
        1. <ins>:定义被插入文本.
        1. <del>:定义被删除文本.
        1. <time>:定义日期/时间.
    • 短语元素标签

        1. <em>:定义强调文本.
        1. <strong>:定义语气更为强烈的强调文本.
        1. <dfn>:定义定义项目.
        1. <code>:定义计算机代码文本.
        1. <samp>:定义计算机代码样本.
        1. <kbd>:定义键盘文本.
        1. <var>:定义文本的变量部分.
        1. < sup>:定义上标文本.
        1. < sub>:定义下标文本.
        1. <cite>:定义引用.
        1. <blockguote>:定义长的引用.
        1. <q>:定义短的引用.
    • 字体样式标签

        1. <i>:显示斜体文本效果.
        1. <b>:呈现粗体文本效果.
        1. <big>:呈现大号字体效果.
        1. <small>:呈现小号字体效果.
        1. <mark>5:定义有记号的文本.

以上的标签,在开发中会经常用到。

相关文章

  • HTML5结构体和标签大全

    : 定义文档类型. html告诉浏览器,这是一个网页。所有的标签,都必须写到html里面。 h...

  • HTML5常用的标签

    目录: HTML5新结构标签 HTML5新其他标签 HTML5新input类型 HTML5新属性 HTML5高级应...

  • html5的新增标签

    html5的新增标签的类型有: 结构标签 媒体组合标签 表单控件 一.新增的结构标签有### article 页面...

  • html常用标签

    Html 大纲 html知识目录 什么是网页,网页的注释 网页的结构和标签 常用的标签和标签的属性 html5常用...

  • HTML5 新增标签

    HTML5新增标签 HTML5新增了27个标签元素,废除了16个标签元素,主要包括结构性标签、级块性标签、行内语义...

  • HTML + CSS

    HTML html5结构 中间包裹着 和 标签一般包裹着 和 或者 标题标签,从1到6...

  • HTML标签-->HTML5新增

    HTML的Form新增属性 HTML新增标签 HTML5新增结构标签 视频和音频 CSS 引入css 基本选择器

  • 关于html第二天基础

    1、Html标签结构 !+tab 可以写成html5的结构 2、字符编码 AscllAnsiUnicodeG...

  • note for swift 3.0

    在此处输入标题 标签(空格分隔): 未分类 1.类和结构体• swift支持直接设置结构体中的子属性• 所有结构体...

  • HTML的语义化

    笔记类文章 常用HTML5语义化标签 结构标签 header nav main article section a...

网友评论

    本文标题:HTML5结构体和标签大全

    本文链接:https://www.haomeiwen.com/subject/ibttuxtx.html