本文是前端新手学习HTML的笔记，重点介绍了表格的构成与样式设置，如align、border属性，以及跨行、跨列合并单元格的方法。接着讲解了列表的类型及其用法，包括无序、有序和自定义列表。最后，文章探讨了表单的用途，阐述了表单域、表单元素如input、select和textarea的用法，强调了label标签在提升用户体验上的作用。
一.表格
1.表格主要用来显示、展示数据。
2.基本组成：<table></table>定义表格标签；<tr></tr>行；<td></td>单元格。<th></th>表头单元格（表格第一行，里面内容居中加粗）。 <thead></thead>定义头部;<tbody><tbody>定义主体（加强语义，方便对表格主体渲染）。
3.属性：写在table里。align是对齐方式，有center,left,right三种；border是表格边框，默认无；width宽度；height高度；cellpadding内容与单元格边框的的距离，默认1像素；cellspacing单元格之间的距离，默认2像素。（开发时通常把cellpadding和cellspacing设为0）
4.合并单元格：两种方式跨行合并（rowspan）和跨列合并(colspan)；目标单元格（左上角的单元格）；删除多余单元格。（三步走）
二、列表
1.列表就是用来布局的。
2.可以根据使用情景的不同分为无序列表，有序列表和自定义列表。
无序列表：<ul><li>内容</li></ul> ，ul标签里只能放li，li里面可以放其他标签。
有序列表：<ol><li>内容</li></ol>同有序列表
自定义列表：<dl><dt>名词</dt><dd>名词解释 ，dl只能包含dt和dd，dt和dd数量不固定，一个dt可以对应多个dd。
三、表单
1.表单就是为了收集用户信息的。
2.表单的组成：表单域（form）、表单控件（表单元素:input 输入 ；select 选择；textarea 文本域）和提示信息。
input：单标签，type属性（必填）用来选择输入输入的样式。
name属性用来区别表单。value值，用于纪录某个控件的值。checked属性默认被选中。maxlength输入框最大长度。
3.label标签：用来绑定一个表单元素。当点击<label>标签内的文本时，会自动选择对应的表单元素。（用于增加用户体验）
label里的for属性值等于对应表单的id的属性值。（也可以将表单元素直接包在label标签中）
4.select标签：下拉表单，可以用来节省空间。<select> <option></option></select>（实际开发中很少用，多是模拟出来的）
5.textarea标签：文本域。（较为常用，样式多用css来设置）
PS：H5中默认属性与属性值一样，属性值可以省略。
依旧是不可或缺的思维导图
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
