单词练习记录 单词练习记录导读：2323/3/20所遇到单词表头表头special特殊的holiday假期suppose认为useful有用的prefer喜欢/更喜欢travel旅行train火车catch接住，抓住；赶上advice建议，劝告club俱乐部{dotted startColor="#ff6c6c" endColor="#1989fa"/}表头表头always总是，一直taxi出租车story故事interesting有趣的college学院graduates毕业country国，国家try尝试truth事实explain解释{dotted startColor="#ff6c6c" endColor="#1989fa"/}表头表头mean方法，途径improve改进amounts金额deal处理noise噪声search搜索表格表格表格表格表格表格表格表格

表格table标签 && form 表单标签 表格 table 表格table tr表示一行 td表示一个 <table border="1" align="center"> <tr> <td>A1</td> <td>B1</td> <td>C1</td> <td>D1</td> </tr> <tr> <td>A2</td> <td>B2</td> <td>C2</td> rowspan 纵向合并 <td rowspan="2">D2</td> </tr> <tr> <td>A3</td> <td>B3</td> <td>C3</td> </tr> <tr> <td>A4</td> <td>B4</td> colspan 横向合并单元格 <td colspan="2">C4</td> </tr> </table>长表格 头部 thead 主体 tbody 底部 tfoot th 表示头部的单元格 <table border="1" width="50%" align="center"> <thead> <tr> <th>日期</th> <th>日期</th> <th>日期</th> <th>日期</th> </tr> </thead> <tbody> <tr> <td>2000.1.1</td> <td>500</td> <td>500</td> <td>500</td> </tr> <tr> <td>2000.1.1</td> <td>500</td> <td>500</td> <td>500</td> </tr> <tr> <td>2000.1.1</td> <td>500</td> <td>500</td> <td>500</td> </tr> <tr> <td>2000.1.1</td> <td>500</td> <td>500</td> <td>500</td> </tr> </tbody> <tfoot> <tr> <td></td> <td></td> <td>合计</td> <td>500</td> </tr> </tfoot> </table>表格样式 <style> table{ width: 50%; margin: 0 auto; border: 1px solid black; border-spacing: 指定边框之间的距离 border-spacing: 0px; border-collapse:collapse;设置边框的合并 border-collapse: collapse; } td{ border: 1px solid black; height: 100px; 默认情况下元素在td中是垂直居中的，可以通过veryical-align 来设置 vertical-align: middle; text-align: center; } 如果浏览器中没有使用tbody而是直接使用tr 那么浏览器会自动生成一个tbody，并且tr全部放到tbody中 tr不是table的资源 tbody > tr:nth-child(2n+1){ background-color: #bfa; } .box1{ width: 300px; height: 300px; background-color: orange; 将元素设置为单元格 td display: table-cell; vertical-align: middle; } .box2{ width: 100px; height: 100px; background-color: yellow; margin: 0 auto; } </style>表单 form 表单：form的属性 action 表单提交的服务器地址 <form action="target.html"> 文本框 input标签 type设置，需要设置一个name 文本框 <input type="text" name="username"> <br><br> 密码框<input type="password" name="password"> <br><br> 单选按钮 -像这种选择框，必须设置value 属性 checked 可以将单选框设置为默认值 单选框name属性必须填写一样 单选按钮<input type="radio" name="hello" value="a"> <input type="radio" name="hello" value="b" checked> <br><br> 多选按钮<input type="checkbox" name="test" value="1"> <input type="checkbox" name="test" value="2"> <input type="checkbox" name="test" value="2"> <br><br> 下拉列表 select标签 > option标签 selected 设置默认 <select name="haha" > <option value="i">选项一</option> <option selected value="ii">选项二</option> <option value="iii">选项三</option> </select> <br><br> 提交按钮，需要将type="submit" 修改名字value <input type="submit" value="注册"> autocomplete="off" 关闭自动补全 readonly 将表单设置为只读，数据会提交 disabled 将表单项设置为禁用 autofocus 设置表单自动获取焦点 <input type="text" name="username" value="hello" readonly> <br><br> <input type="text" name="a" disabled> <br><br> <input type="text" name="b" autofocus> <br><br> <input type="color" email tel 等> <input type="submit"> 重置按钮 <input type="reset"> 普通按钮 <input type="button" value="按钮"> <br><br> <button type="submit">提交</button> <button type="reset">重置</button> <button type="button">按钮</button> </form>