HTML基本语法2

HTML实体

•  空格
• < 小于<
• > 大于>
• " 引号"
• ¥ ¥
• & 和号 &
• × 乘 ×
• ÷ 除 ÷
• © 版权 ©
• ® 注册商标 ®

列表标签

• ul 双 无序列表
  • 属性（不赞成使用）：type(disc(默认)/square/circle)
• li 双 列表项
  • 属性（不建议使用）：type 值同上、value项目列表数字
• ol 双 有序列表
  • 属性：
    • reversed(降序) H5新添加
    • 不建议使用： type(1/a/A/I)、start（起始值）
• dl 双 定义列表
• dt 双 列表项目的标题
• dd 双 列表项目的描述

文本标签（双）

• 常用：
  • em 强调 表现为斜体
  • strong 强调 表现为加粗
  • cite 引证、举例：距离 书名 电影名
• 不常用：
  • dfn 定义项目
  • kbd 键盘按键
  • abbr 定义缩写 配合title
  • bdo 配合dir属性（ltr,tlr） 改变文字书写方向
  • code 定义代码
  • var 定义变量
  • del 已经删除的 删除线
  • ins 当前的 下划线
  • sup 上标文字
  • sub 下标文字
  • q 引用 短
  • blockquote 引用 长
  • address 定义地址
  • b 加粗 强调
  • i 斜体 科学专业术语
  • u 下划线 定义与其他文本不同风格的文本

超链接

URL

• 统一资源定位符
• 万维网的每一个文件都有一个URL

a 标签

• href 值 URL
• target 新网页从哪个窗口打开
  • _self（默认）
  • _blank 新窗口打开
  • _parent 将连接的内容，当成文件的上一个画面
  • _top 解决新内容被旧框窗包围的困扰，会将整个画面重新显示成链接的画面内容。
• title 链接的附加提示信息
• download 下载 H5 新增

超链接范例

网站链接：<a href="http://www.baidu.com">百度</a>
电子邮件链接： <a href="mailto:278819322@qq.com">写信给我</a>
电话： <a href="tel:10086">10086</a>
短信 sms:<phone_number>[<phone-number>]*[?body=<message_body>]

路径

• 相对路径 (html/01.html)

• ./（当前目录） ../（上一级目录） ../../(上上级目录)

   	表示效果相同都是在当前目录
    <a href="cp01.html">cp01.html</a>
     <a href="./cp01.html">cp01.html</a>
  

• 绝对路径 (http://www.sohu.com/index.html)

锚点

• <a name="锚点的名字"></a>

• 使用 <a href="#锚点名">跳转</a>

• 使用超链接#跳转到指定锚点

    例 如：<a name="h1">第一部分</a>
    使用 <a href="#h1">跳转到第一部分</a>
  

• 跳转到指定页面指定锚点

  • http://www.lampuser.com/index.html#section2

图像

img标签 属性

• src 代表一个图像源（图像的位置）
• alt 图片无法显示时显示的文字
• title 提示信息
• border 图片边框的宽度 值：数字
• width 图像的宽度
• height 图像的高度
• usemap 将图像定义为客户端图像映射
• ismap 将图像规定为服务器端图像映射

常见的图片格式

• jpg/jpeg 支持多种颜色，可以有很高的压缩，使用了有损压缩，不支持透明，不支持动画效果
• gif 最多支持256色，支持透明，支持多帧动画显示效果
• png 新的图片技术，可表现品质比较高的图片，使用了无损压缩，支持透明，不支持动画

图片热点 图片映射

• 图像映射：指带有可点击区域的一幅图像

• map 定义图像映射 属性 id name

    <img>中的usemap属性可引用<map>中的id或name属性（取决于浏览器），所以应同时向<map>添加 id 和 name 属性
  

• area 定义图像地图内部的区域

  • 永远嵌套在map元素内部

  • 属性 alt 规定区域的替代文本

  • href url 规定区域的目标 URL

  • coords 规定区域的坐标

  • shape 规定区域的形状

    • rect 矩形
    • circle 圆形
    • poly 多边形

  • target

      圆形：shape="circle"，coords="x,y,z"
      这里的 x 和 y 定义了圆心的位置（"0,0" 是图像左上角的坐标），r 是以像素为单位的圆形半径。
      多边形：shape="polygon"，coords="x1,y1,x2,y2,x3,y3,..."
      每一对 "x,y" 坐标都定义了多边形的一个顶点（"0,0" 是图像左上角的坐标）。定义三角形至少需要三组坐标；高纬多边形则需要更多数量的顶点。
      多边形会自动封闭，因此在列表的结尾不需要重复第一个坐标来闭合整个区域。
      矩形：shape="rectangle"，coords="x1,y1,x2,y2"
      第一个坐标是矩形的一个角的顶点坐标，另一对坐标是对角的顶点坐标，"0,0" 是图像左上角的坐标。请注意，定义矩形实际上是定义带有四个顶点的多边形的一种简化方法。