HTML--HTML学习笔记

HTML5

  1. 内容标题 h1-h6 字体由大到小 独占一行 字体加粗 上下外边距 ,align=“left/right/center”
  2. 段落标签 p 独占一行 上下外边距
  3. 水平分割线 hr
  4. 换行 br
  5. 列表标签
  • 无序列表: ul:type li
  • 有序列表: ol:type start reversed li
  • 定义列表: dl dt dd
  • 列表嵌套: 有序和无序可以任意无限嵌套
  1. 分区元素
  • div:块级分区元素 独占一行
  • span: 行内分区元素 共占一行
  • h5: header article footer
  1. 元素分类
  • 块级元素: div h1-h6 p hr
  • 行内元素: span strong和b em和i del和s u
  1. 实体引用
  • 空格  
  • 小于号 <
  • 大于号 >
  1. 图片标签 img
  • src: 路径
    1. 相对路径:访问站内资源
      • 同目录 直接写文件名
      • 上级目录 …/文件名
      • 下级目录 文件夹名/文件名
    2. 绝对路径: 访问站外资源
      • 好处:节省本站资源
      • 坏处:有可能找不到图片
  • alt: 当图片不能正常显示的时候显示的文本
  • title: 鼠标悬停时显示的文本
  • width/height: 两种赋值方式 1. 像素 2. 上级元素的百分比
  1. 图片地图map
  • name唯一标识 结合 图片里面的usemap使用
  • 子标签 area: shape(形状rect/circle) coords(坐标,矩形对角线点的坐标,圆形圆心坐标+半径) href:资源路径,页面资源直接访问 文件资源(能浏览则浏览 不能浏览则下载)
  1. 超链接a
  • 如果不写href属性则就是纯文本

  • target="_blank" 在新窗口中显示页面

  • a标签包裹文本是文本超链接 包裹图片则是图片超链接

  • 页面内部调转功能,如果目的地位置有元素则给元素添加id属性,如果没有元素则添加一个空的a标签作为锚,然后通过另外一个a标签跳转过去

      
      回到顶部
    

###表格标签table

  • tr:table row td:table data th:table head 表头 居中 加粗

  • 跨行:rowspan row(行)

  • 跨列:colspan column(列)

  • caption 表格标题

  • 分组(分区)标签:thead tbody tfoot
    ###表单form

  • 表单作用:获取用户的各种数据 提交到服务器

  • form表单的各种控件: 文本框、密码框、单选、多选、下拉选、文本域等

      
    用户名:
    密码:
    性别:
    爱好: 王者农药 搞对象
    生日:
    靓照:
    所在城市:
    自我介绍:

你可能感兴趣的:(前端)