首先我上个图来告诉大家什么是列表
左侧的这一部分就可以称为是列表或者叫树，其实我们可以通过div+css实现列表，可是考虑语义化的问题，我们还是看看html提供好的列表标签，html提供了两种列表，一种是无序列表，一种是有序列表。可是实际开发中我们只是在用无序列表，因为它好扩展，我可以通过font awesome添加我们想要的图片作为序号标识，这样岂不是更好。那么，看一个简单的无序列表的例子：
<!DOCTYPE html> <html> <head lang="zh"> <meta charset="UTF-8"> </head> <body> <!--ul标签向界面上添加一个数据列表--> <ul> <!--li标签用来定义列表项--> <li>咖啡</li> <li>茶</li> <li>牛奶</li> </ul> </body> </html>
界面上显示效果如下，如果要去掉列表项前面的黑色小点，可以通过css实现。
表单标签通常分为好几种类型，一般有文本输入框，单选框，复选框，下拉列表。
来看下面简单的例子：
<!DOCTYPE html> <html> <head lang="zh"> <meta charset="UTF-8"> </head> <body> <!--form标签用来定义一个表单组--> <form> <!--可以通过指定input元素的type属性来指定输入框是单选框，文本输入框等--> 文本输入框：<input type="text" name="textinput"> <br> <input type="radio" name="sex" value="male" checked>Male <input type="radio" name="sex" value="female">Female <!--select标签用来指定一个下拉列表--> <select name="cars"> <option value="volvo">Volvo</option> <option value="saab">Saab</option> <option value="fiat">Fiat</option> <option value="audi">Audi</option> </select> </form> </body> </html>
界面效果如下：
