HTML03 实体和图片标签

1、实体

• 在 HTML 中，有些时候不能直接书写一些特殊字符
  • 比如：多个连续的空格，比如<、>号
  • 特别是组合在一起而且中间还有字的情况下是不能直接使用，a<b>c
  • 需要书写这些特殊字符，则需要用到 HTML 中的实体（转义字符）
• 实体标签：
  • 需要用一些特殊符号来表示这些特殊字符，这些特殊字符被称为实体（转义字符串）
  • 实体的语法：
    • 语法 ：&实体的名字；
    • &lt; ：小于＜号
    • &gt; ：大于＞号
    • &nbsp; ：空格
    • &copy; ：版权符号 
    • a<b>c  =>  a&lt;b&gt;c
    • 菜鸟教程里面有，实体符号参考手册

2、 图片标签

• img 标签也是一个自结束标签
  • 使用 img 标签来向文本页面中引入一个外部图片
  • 属性：
    • src：设置一个外部图片的路径
    • alt：可以用来设置在图片不能显示时图片的描述
      • 搜索引擎可以通过alt属性来识别不同的图片
      • 比如你向百度搜索宝贝，下面这张图就会出现在搜索列表里面
      • 如果不写alt属性，搜索引擎就不会对img里的图片进行收录
    • width：可以用来修改图片的宽度
    • height ：可以用来修改图片的高度，一般使用px作为单位
      • 宽度和高度只动其中一个，另一个也会进行等比例缩放
      • 如果两个同时指定，则按照指定的来
      • 但一般在开发中，除了自适应的页面，其他不建议设置 width 和 height
• 路径:
  • src属性配置的是图片的路径，目前我们使用的路径全是相对路径
  • 相对路径： 
    • 是指相对于当前资源所在目录的位置
    • 路径写在哪里，哪里就是当前资源
    • <!-- 此处是图片在对象的下下级 -->
      • <img src="ab/ab/00302.jpg" alt="这是我的大宝贝" width="200    "/>
    • <!--可以使用../来返回当前文件夹的上一级目录,返回几个上级目录就../几次-->
      • <img src="../abc/00301.gif" alt="这是我的大宝贝" width="275"/>
• 图片的格式问题 
  • JPEG(JPG)
    • 支持的颜色较多，图片可以压缩，但是不支持透明
    • 一般使用JPEG来保存照片等颜色的丰富的图片
  • GIF
    • 支持的颜色较少，只支持简单的透明（直线的）
    • 支持动态图
    • 图片颜色单一，或者是动态图时使用
  • PNG
    • 支持的颜色较多，并支持复杂的透明
    • 可以用来显示颜色较复杂的透明图片
  • 图片的使用原则：
    • 效果不一致 ：使用效果好的
    • 效果一致 ：使用小的