12.无序列表标签(ul-->li)
说明: ul标签中只能放li标签。li标签可以放其他标签
<ul> <li>香蕉</li> <li>牛奶</li> </ul>
13.有序列表标签(ol-->li)
说明: ol标签中只能放li标签。li标签可以放其他标签。列表的每一项默认显示序号标识
<ol> <li>香蕉</li> <li>牛奶</li> </ol>
14.自定义标签(dl-->dt-->dd)
说明:dl标签中只能放dt主题标签和dd内容标签。dt和dd标签可以放任意标签。并且dd标签默认显示缩进
<dl> <dt>主题</dt> <dd>香蕉</dd> <dd>牛奶</dd> </dl>
15.表格标签(table-->tr-->td)
说明:没有看见表格是没有加显示表格的语句,表格的属性设置建议用css设置,后面会讲到。
table是表格大标签,tr是行标签,td是内容标签
<table> <tr> <td>男生</td> <td>女生</td> </tr> <tr> <td>新手</td> <td>老手</td> </tr> </table>
16.表头标题和表头单元格标签 table-->tr(th、td)。caption是表格标题
说明: 没有看见表格是没有加显示表格的语句,表格的属性设置建议用css设置,后面会讲到。
table是表格大标签,caption是标题标签,tr是行标签,th是表头加粗标签,td是内容标签
<table> <caption>成绩单</caption> <tr> <th>男生</th> <th>女生</th> </tr> <tr> <td>新手</td> <td>老手</td> </tr> </table>
17.合并单元格(caption--->tr---td)
说明:要合并哪里就把多余的标签和数据删除,然后在要合并的标签当中添加行(rowspan)或者列(colspan)合并,数字是合并几行或者几列的意思 。注意:只能合并同一个结构的,不同结构的不能合并
<!-- table嵌套包含tr。tr嵌套包含th、td 。caption是表格标题在table内,跨行是rowspan,跨列是colspan--> <table> <caption>成绩单</caption> <tr> <th>男生</th> <th>女生</th> </tr> <tr> <td colspan="2">老手</td> </tr> </table>
18.表单之按钮大全(input type=)
说明:这些多用于登录注册菜单时候用到
<!-- 表单域标签,用来控制整个表单为一体的,主要是提交和重置按钮 --> <form action=""></form> <!-- 1.写什么就显示什么 --> 文本框:<input type="text"> <br> <!-- 2.输入的内容都会变成点点显示 --> 密码框:<input type="password"> <br> <!-- 3.用于多选一,nanme设置相同名称就只能多选一 --> 单选框:男<input type="radio" name="sex" > 女<input type="radio" name="sex" > <br> <!-- 4.用于多选多 --> 多选框:<input type="checkbox" > <br> <!--5.提前默认选项 checked可以 --> 单选框:男<input type="radio" name="sex" > 女<input type="radio" name="sex" checked> <br> <!-- 6.文件选择,用于上传文件 --> 文件上传:<input type="file"> <br> <!-- 7.文件选择,multiple用于上传多个文件 --> 多个文件上传:<input type="file" multiple> <br> <!-- 8.输入提示 --> 请输入:<input type="text" placeholder="请输入用户名"> <br> <!-- 9.提交按钮 ,文字提示就添加value--> <input type="submit"> <br> <!-- 10.重置按钮 文字提示就添加value--> <input type="reset"> <br> <!-- 11.普通按钮,默认无功能,后面配合js添加功能 --> <input type="button" value="普普通通"> <br> <!-- 12.普通双标签按钮,默认无功能,后面配合js添加功能 --> <button>我是按钮</button>
19.表单之下拉菜单(select-->option)
说明:看注释里面都有
<!-- select是下拉菜单的整体,option是选项内容 ,selected是默认选项 --> <select > <option >射手</option> <option >法师</option> <option >战士</option> <option selected>刺客</option> </select>
20.表单之文本域(textarea)
说明:看注释里面都有
<!-- 这是文本域,可以在里面输入各种文字 --> <textarea ></textarea>
21.点击文字图片选中按钮(label)
说明:看注释里面都有
<!--5.用label包裹住需要点击文字就选中按钮的标签就好了,要把生成的for删除 --> <label > 我是最厉害的 <input type="radio" name="sex" > </label> <label > 我是最帅的<input type="radio" name="sex" > </label>
22.空格符号( )
说明:&这个符号在键盘7那里,需要几个空格就放几个
<!-- 一个 占一个空格,需要几个就放几个 --> 大 哥
23.布局标签(div 、span)
说明:div和span都是盒子标签,页面就是由一个个盒子互相嵌套组成的
<!-- div独占一行,span不会 --> <div>我是div1</div> <div>我是div2</div> <span>我是span1</span> <span>我是span2</span>