2021-08-04

1.列表
先后之分： 有   排行榜
          无   新闻列表   商品列表

    无序列表 ul-li
    <ul type="value">
        <li>需要显示的条目内容</li>
    </ul>
    value：disc    默认值 实心圆
           circle  空心圆
           square  实心方块
    li其实是英文list item的缩写
    list是列表的意思
    item是条目的意思
    所以结合起来就是 列表条目的意思

    有序列表 ol-li  奥运会夺金排行榜
    <ol type="A">
        <li>需要显示的条目内容</li>
    </ol>
    value：1   默认值。数字有序列表。（1、2、3、4）
                a   按字母顺序排列的有序列表，小写。（a、b、c、d）
                A   按字母顺序排列的有序列表，大写。（A、B、C、D）
                i   罗马字母，小写。（i, ii, iii, iv）
                I   罗马字母，大写。（I, II, III, IV）
    
2.表格标签
    一对table标签就是一个表格
    一对tr标签就是表格中的一行
    一对td标签就是一行中的一个单元格
    补充：tr与th搭配用来表示表头，字体为居中的粗体文本
          tr与td搭配用来表示表体，字体为左对齐的普通文本

    宽高属性设置：
        table   表格的宽高
        td  th   单元格的宽高   
        都属于块级元素： 宽默认100%  

    水平垂直对齐
        水平方向align： table（表格） tr td（单元格内容） 
        垂直方向valign： tr td
        取值：align: left center right
              valign: top mid bottom
    
    表格的外边距内边距（在元素中为margin padding）
        cellspacing外边距  单元格和单元格之间的距离  默认2px
        cellpadding内边距  单元格和文字之间的距离  默认1px

    表格完整结构
        标题caption    表头th    主体tr-td

    单元格合并
        水平方向单元格合并  colspan
        垂直方向单元格合并  rowspan

3.form表单
    提交表单信息
    <form action="提交的服务器接口地址">
        <表单元素>
    </form>

    input
    -明文输入框
            <input type="text" name="account" placeholder="请输入用户名">
			name:表单提交时，会作为参数的名称，结合输入的值进行匹配，组成 参数名=参数值的结构
			placeholder:提示
    -暗文输入框 
		    <input type="password" name="password" placeholder="请输入密码">
    -单选框 
		    <input type="radio" name="xx" value="xxx" checked>
            注意点:
            1.设置name属性  2.值一样
            2.默认选中某个单选框  checked
    -多选框 
            <input type="checkbox" name="xxx" value="xxx">
            多选框默认选中 checked
    -提交按钮 
		    <input type="submit">
            作用: 将表单中已经填写好的数据, 提交到远程服务器
            操作：
                1.form表单天津一个action属性 指定需要提交到的服务器地址
                2.给要提交的表单元素添加一个name属性
    -普通按钮 
		    <input type="button" value="xxx">
            value设置标题
    -图片按钮 
		    <input type="image" src="">
    -重置按钮 
            <input type="reset" value="xx">
            作用: 用于清空表单中已经填写好的数据