表单

• radio单选框/checkbox复选框

  • 【技巧1】框与文字垂直居中对齐
    • 对框使用vertical-align:微调像素值
      • 对于文字大小12px，微调中像素值为-3px即可
      • 对于文字大小14px，微调中像素值为-2px即可

• textarea多行文本框

  • 【技巧1】固定大小
    • 对框使用max-width和max-height，定义最大宽高
  • 【技巧2】禁用拖动
    • 对框使用resize:none，禁用拖动功能，使右下角小三角消失
  • 【技巧3】在多浏览器中实现相同外观
    • 对框使用width和height定义大小，
    • 使用overflow:auto定义滚动条自适应

• 表单对齐

  • 1、每一行用p元素包裹,并清除浮动

    p {
      overflow: hidden;
    }
    

  • 2、每一行分为左栏（label）+ 若干右栏（input）
    • 左栏设置text-align:right右对齐
    • 每一行的所有右栏总长度要相等
    • 左右栏都设为左浮动
    • 左右栏总长即为总表单行宽
  • 3、一行的总结构
    • 标签值+标签右margin + 输入框border+输入框padding+输入框width