HTML网页布局和表单表格

HTML网页布局和表单表格：HTML标签：无语义标签、有语义标签；JS：基本语法、变量、数据类型、函数。

网页布局

• div
  • 布局原则
    • 从上到下
    • 从左到右
    • 从大到小
  • 盒子模型
    • 宽/高 width/height
    • 外边距 margin
    • 内边距 padding
    • 边框 border
  • 浮动布局
    • 浮动概念 float
    • position：absolute、relative、fixed、清除浮动
• html结构
  • head
    • title
    • metacharset
  • body
    • div
    • css
    • js
• CSS样式
  • 选择器
    • id选择器
    • 类选择器
    • 标签选择器
    • 通配符选择器
  • 控制效果
    • 段落控制
      • text-indent(首行缩进)
      • text-align(水平文字方向)
      • text-decoration(文字装饰线)
      • text-transform(字母大小写转换)
      • letter-spaing：字符间距
    • 文本控制
      • color(颜色)
      • font-style(文字样式)
      • font-size(文字大小)
      • font-family(字体)
      • line-height(行高)
    • 背景控制
      • background-color(背景颜色)
      • background-image(背景图片)
      • background-repeat（背景图片重复）
      • background-position(背景图位置粘贴方式)
      • 子主题
  • 引入方式
    • 行内式
    • 内嵌式
    • 外链式
    • import导入
• HTML标签
  • 无语义标签
    • div块状元素
    • 布局分块用
    • span内联元素
  • 有语义标签
    • h1-h6标题标签
    • p段落标签
    • img图片标签
    • a超链接标签
    • ul无序/ol有序列表
    • table表格
• JS
  • 基本语法
  • 变量
  • 数据类型
  • 函数
  • 运算符
  • 流程控制
  • js对象
    • String
    • Array
    • Date
    • Window
    • Document
  • DOM操作
  • JS和CSS综合操作
• 表格table
  • 单元格内 内边距 cellpadding
  • 单元格间 间距 cellspacing
  • 边框 border
  • 单元格所占行个数 rowspan
  • 表格边框折叠为单一边框 border-collapse：collapse
  • 单元格所占列个数 colspan
  • 表格标题 caption
  • thead表头 tr th粗体显示
  • tbody tr td
  • tfoot 表脚
• form表单
  • input用type进行分类
    • text 文本框
    • password 密码框
    • checkbox 复选框
    • radio 单选框
    • submit 提交按钮
    • email 邮件框
    • number 数字框
    • url网址框
    • tel 电话框
    • time 时间框
    • date 日期框
    • month 月框
    • week 星期框
    • range 滚动条
    • color颜色框
    • search 搜索框
  • select 下拉菜单
    • option标签 selected 默认选中
    • optgroup组，不常用，包含option，label属性名字写在标签内
  • textarea 多行文本框
    • cols
    • rows
  • method 提交方式
    • get 明文 255 字节
    • post 加密的 传输量大
  • label for
    • <label for="input输入文本框id属性"></label>