zoukankan      html  css  js  c++  java
  • HTML之基础温习

    HTML相关标签温习:

            <html></html> 根标签
            <head></head>头标签

            <body></body>内容标签 

     整个HTML由以上三个标签块构成,其中head标签内容负责页面相关属性的说明,不做具体展示之用。快速开发平台
            body标签里面则是具体的内容,用作浏览器展示之用。

    |-- head
        |-- title : 网页标题,显示在浏览器标签上。
        |-- style: 定义了HTML文档的样式文件引用地址,可在标签中指定样式文件。
        |-- script: 于加载脚本文件,通常是JavaScript脚本。
        |-- link: 定义了文档与外部资源之间的关系,通常用于链接到样式表。
            |-- <link rel="stylesheet" type="text/css" href="theme.css">
        |-- base:定义了页面链接标签的默认链接地址。
            |-- <base href="http://www.w3cschool.cc/images/" target="_blank">
        |-- meta:描述了一些基本的元数据,元数据不会显示在客户端,会被浏览器解析。(通常用于指定网页的描述,关键词,的文件的最后修改,作者,和其他元数据。
    元数据可以被使用浏览器(如何显示内容或重新加载页面),搜索引擎(关键词),或其他 Web 服务调用。)
            |-- <meta name="keywords" content="HTML, CSS, XML, XHTML, JavaScript"> 为搜索引擎定义关键词
            |-- <meta name="description" content="Free Web tutorials on HTML and CSS"> 为搜索引擎定义关键词
            |-- <meta http-equiv="refresh" content="30"> 每30秒刷新页面
            |-- <meta name="author" content="Hege Refsnes"> 定义页面作者定义页面作者
            |-- <meta http-equiv="content-type" content="text/html; charset=UTF-8"> (HTML5: <meta charset="UTF-8">)

    标签的用途、标签在浏览器中的默认样式:
    语义化:那么什么叫做语义化呢,说的通俗点就是:明白每个标签的用途(在什么情况下我可以使用这个标签才合理)。

    标题 <hx>

    x : 1~6 ; 请确保将 HTML heading 标签只用于标题。不要仅仅是为了生成粗体或的文本而使用标题。

    HTML 水平线:<hr/> 标签在 HTML 页面中创建水平线。
    注释:<!-- 这是一个注释 -->
    换行: <br/>
    段落:  这是一块段落。

    格式化标签:

    标签 描述
    <b> 定义粗体文本
    <em> 定义着重文字
    <i> 定义斜体字
    <small> 定义小号字
    <strong> 定义加重语气
    <sub> 定义下标字
    <sup> 定义上标字
    <ins> 定义插入字
    <del> 定义删除字
    HTML "计算机输出标签" :
    标签 描述
    <code> 定义计算机代码
    <kbd> 定义键盘码
    <samp> 定义计算机代码样本
    <var> 定义变量
    <pre> 定义预格式文本
    HTML 引文、引用,及标签定义:
    标签 描述
    <abbr> 定义缩写
    <address> 定义地址
    <bdo> 定义文字方向
    <blockquote> 定义长的引用
    <q> 定义短的引用语
    <cite> 定义引用、引证
    <dfn> 定义一个定义项目。

    HTML 链接:

    超链接可以是一个字,一个词,或者一组词,也可以是一幅图像,您可以点击这些内容来跳转到新的文档或者当前文档中的某个部分。
       Link text
    href 属性描述了链接的目标。【# href="#id",本地文档的定位处】
    使用 Target 属性,你可以定义被链接的文档在何处显示。【_blank、_parent、_self、_top】
    Note: 注释:请始终将正斜杠添加到子文件夹。假如这样书写链接:href="http://www.w3cschool.cc/html",就会向服务器产生两次 HTTP 请求。这是因为服务器会添加正斜杠到这个地址,然后创建一个新的请求,就像这样:href="http://www.w3cschool.cc/html/"。

    HTML 列表:
    无序列表是一个项目的列表,此列项目使用粗体圆点(典型的小黑圆圈)进行标记。   

    • 列表项

    有序列表也是一列项目,列表项目使用数字进行标记。 有序列表始于

    标签。每个列表项始于 <li> 标签。

    <ol>   

    • 列表项1
    • 列表项2

    自定义列表不仅仅是一列项目,而是项目及其注释的组合。
    自定义列表以 <dl> 标签开始。每个自定义列表项以 <dt> 开始。每个自定义列表项的定义以 <dd> 开始。
    <dl>
        <dt>Coffee</dt>
        <dd>- black hot drink</dd>
        <dt>Milk</dt>
        <dd>- white cold drink</dd>
    </dl>

    HTML 头像:IMG
    <img src="url" alt="some_text" width="304" height="228" usemap="#planetmap" >
    <map name="planetmap" id="planetmap">
      <area shape="rect" coords="0,0,82,126" href="sun.htm" alt="Sun">
      <area shape="circle" coords="90,58,3" href="mercur.htm" alt="Mercury">
      <area shape="circle" coords="124,58,8" href="venus.htm" alt="Venus">
    </map>

    src 指 "source"。源属性的值是图像的 URL 地址。
    alt 属性用来为图像定义一串预备的可替换的文本。
    height(高度) 与 width(宽度)属性用于设置图像的高度与宽度。
    标签 描述
    <img> 定义图像
    <map> 定义图像地图
    <area> 定义图像地图中的可点击区域

    HTML 表格:
    <table>
    <caption>表格标题</caption>
    <tr>
    <th>表头1</th>
    <th>表头2</th>
    </tr>
    <tr>
    <td>row 1, cell 1</td>
    <td>row 1, cell 2</td>
    </tr>
    <tr>
    <td>row 2, cell 1</td>
    <td>row 2, cell 2</td>
    </tr>

    </table>

    标签 描述

    <table> 定义表格
    <th> 定义表格的表头
    <tr> 定义表格的行
    <td> 定义表格单元
    <caption> 定义表格标题
    <colgroup> 定义表格列的组
    <col> 定义用于表格列的属性
    <thead> 定义表格的页眉
    <tbody> 定义表格的主体
    <tfoot> 定义表格的页脚

    HTML 区块:

    大多数 HTML 元素被定义为块级元素或内联元素。
    块级元素在浏览器显示时,通常会以新行来开始(和结束)。
    实例: <h1>, <p>, <ul>, <table>
    HTML 内联元素:
    内联元素在显示时通常不会以新行开始。
    实例: <b>, <td>, <a>, <img>
    HTML <div> 元素是块级元素,它是可用于组合其他 HTML 元素的容器。
    HTML <span> 元素是内联元素,可用作文本的容器。

    HTML 表单元素:

    标签 描述
    <form> 定义供用户输入的表单
    <input> 定义输入域
    <textarea> 定义文本域 (一个多行的输入控件)
    <label> 定义了 <input> 元素的标签,一般为输入标题
    <fieldset> 定义了一组相关的表单元素,并使用外框包含起来
    <legend> 定义了 <fieldset> 元素的标题
    <select> 定义了下拉选项列表
    <optgroup> 定义选项组
    <option> 定义下拉列表中的选项
    <button> 定义一个点击按钮
    <datalist>New 指定一个预先定义的输入控件选项列表
    <keygen>New 定义了表单的密钥对生成器字段
    <output>New 定义一个计算结果

    HTML 框架:

    标签 说明
    <iframe> 定义一个内联的iframe

    HTML 实体:

    显示结果 描述 实体名称 实体编号

    空格 &#160;
    < 小于号 < &#60;
    > 大于号 > &#62;
    & 和号 &amp; &#38;
    " 引号 " &#34;
    ' 撇号 &apos; (IE不支持) &#39;
    ¢ 分 &cent; &#162;
    £ 镑 &pound; &#163;
    ¥ 日元 &yen; &#165;
    € 欧元 &euro; &#8364;
    § 小节 &sect; &#167;
    ? 版权 &copy; &#169;
    ? 注册商标 &reg; &#174;
    ? 商标 &trade; &#8482;
    × 乘号 &times; &#215;
    ÷ 除号 &divide; &#247;

    本站文章除注明转载外,均为本站原创或翻译,欢迎任何形式的转载,但请务必注明出处,尊重他人劳动,共创和谐网络环境。
    转载请注明:文章转载自:快速开发框架 » HTML之基础温习
    本文标题:HTML之基础温习

  • 相关阅读:
    SpringBoot整合Spring Data Elasticsearch
    Elasticsearch(一)基础入门
    二叉排序树
    数据结构之栈
    数据结构之队列
    MySQL主从备份
    Redis主从复制之哨兵模式(sentinel)
    shiro核心
    MySQL常用命令
    Docker常用命令
  • 原文地址:https://www.cnblogs.com/frfwef/p/14572359.html
Copyright © 2011-2022 走看看