HTML基本语法2

HTML实体

  •  空格
  • &lt; 小于<
  • &gt; 大于>
  • &quot; 引号"
  • &yen; ¥
  • &amp; 和号 &
  • &times; 乘 ×
  • &divide; 除 ÷
  • &copy; 版权 ©
  • &reg; 注册商标 ®

列表标签

  • 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" 是图像左上角的坐标。请注意,定义矩形实际上是定义带有四个顶点的多边形的一种简化方法。
原文地址:https://www.cnblogs.com/pangwl/p/7230966.html