表格表单视频音频

页面的组成部分

列表

<ul>
    <li></li>  无序列表
</ul>

<ol>
    <li></li>  有序列表
</ol>
ol标签的属性有 start  type='a/A/i/I/1' reversed反向

<dl>
    <dt></dt>  t:title的首字母
    <dd></dd>  d:describe的首字母
</dl>

列表的css属性

llist-style-type(列表符号项):circle/square/none/disc
list-style-position:outside默认，框外/inside
list-style-image:url()
list-style(复合属性,一般只填none):circle outside url()

---

表格标签

<table>
    <caption><h2>表格名<h2></caption>
    <thead> 表头
        <tr> 行，table row的缩写
            <th>序号<th>
            <th>姓名<th>
        </tr>
    </thead>
    <tbody>
        <tr> 
            <td>1<td>
            <td>egon<td>
        </tr>
        <tr> 
            <td>2<td>
            <td>lxxn<td>
        </tr>
    </tbody>
    <tfoot>
        <tr>
            <td colspan='2'></td>
        </tr>
    </tfoot>
</table>

th,td的标签属性：colspan横向合并表格
                 rowspan纵向合并表格
常用css通用属性：
    td,th:padding,border
    table:width height一般只用width
常用表格专有css属性：
    table-layout:fixed;固定每列等宽
    border-collapse:collapse;合并单元格边框
    border-spacing:5px;单元格间隙，前提：没有合并单元格
    caption-side:top/bottom;标题在顶部或底部

---

表单

<form action='提交的地址url' method='提交方式 get/post' enctype='multipart/form-data'>
    用户名:<input type='text' name='username'(用于传输给后端时使用key:value形式存储)
    placeholder='请输入用户名'(框内的提示，输入内容就消失) maxlenght='10'(最大输入字符个数)>
    
    密码:<input type='password' name='password'> (输入的为密文)
    
    多选一:<input type='radio' name='sex' value='male'(传输的值) checked(选中)>男
           <input type='radio' name='sex'
    value='female'(传输的值)>女
    
    多选多(与选一相同):<input type='checkbox' name='xxx'>
    
    文件选择框:<input type='file' name='file' multiple(多个，默认为一个)>
    
    邮箱:type='email'
    网址:type='url'
    数字:type='number' (可指定max min step默认为1)
    搜索:type='search'
    电话:type='tel' (在手机端能弹出数字框)
    范围选择:type='range' (可指定max min step默认为1)
    颜色选择:type='color'
    时间日期：日期   type='date'
              月份   type='mouth'
              第几周   type='week'
              时间   type='time'
           年月日时分秒   type='datetime-local'
           
    下拉框：<select name=''>
                <option value=''>xxx</opton>
                ...
            </select>
    
    多行文本:
    <textarea name='' rows='行高，非最大行数' cols='框宽'></textarea>
</form>

按钮
提交：<input type='submit' value=''>
      <button>提交</button>
重置: <input type='reset' value=''> 
      <button type='reset'></button>
普通：<input type='button' value=''> 
      <button type='button'></button>
      
提交信息到指定地址：如直接提交信息进行百度
<form action='http://www.baidu.com'>
    <input type='text' name='wd' list='mylist'>
    <datalist id='mylist'>
        <option value=''></option>
        ...
    <datalist>
    <button>搜索</button>
</form>

---

表单空间通用属性

• disabled 元素禁用
• enabled 可用
• readable 只读用于可输入框
• autofocus 自动获取焦点 光标直接过去
• autocomplete='off'/'on' 自动保存，下次输入会有提示
• pattern 正则
• required 必填

---

视频音频

视频格式：mp4 ogg webm
<video src='视频地址' controls autoplay></video>
其余属性:loop:循环  poster='播放视频前显示的图片地址'
preload 预加载
音频格式：MP3 wav ogg
<audio src='' controls autoplay></video>

分类选择
<video>
    <source src='' type='video/mp4'>
    <source src='' type='video/ogg'>
    <source src='' type='video/webm'>
</video>