HTML总结笔记(三)

一、列表

1.1 无序列表

无序列表,ul(unordered list)，即列表中的每一项没有排名次序的。ul是一个组标签，内部只能有li标签。ul的作用是增加“无序列表”语义的。

列表项,li(list item),  不能单独存在，没有意义，必须包裹在组标签(ul/ol)里，li是一个容器级标签。

实际应用场景：导航栏、产品列表等。

1.2 有序列表

有序列表，ol(ordered list), 即列表中的内容有先后排名，使用方式同ul，但是实际使用场景不多，如果想要表达顺序 大家一般会用ul:

<ul>

        <li>1.王芳 100分</li>

        <li>2.李雷 98分</li>

        <li>3.小明 30分</li>

</ul>

1.3 定义列表

定义列表，dl(definition list)   每一个内容标题都有自己的专属描述。dl是一个组标签，内部存在两个子标签:

定义标题，dt(definition title)  

定义描述，dd(definition description)   用于描述dt标题的，一个dt可以搭配很多的dd

主要应用场景：

1.平台垂直菜单

京东-垂直菜单

2.部分平台底部平台信息列表

---

二、div 和 span

分割区域，div(division) ,容器级标签。  大家常说的“div+css”模式中的div即是此。div标签负责布局结构，css负责样式。

分割区域，span,文本级标签，  也就是说，span里面只能放置图片、文字、表单元素

三、表单

表单,form，用于收集用户信息，即一些输入框、选择框、下拉菜单的集合。

内部有两个属性： action：动作，这个表单将会提交到哪里。   method：提交方式(get/post)

 input表示“输入”，代表此控件为一个输入相关控件。

3.1 input的type属性决定input的类型，如：

text-文本框

password-密码框 

radio-单选按钮(一组单选按钮需要一个相同的name值，否则互斥无效)

checkbox-复选框(最好也要有相同的name)

3.2 下拉列表

 select标签，也是组标签，内部需要option选项标签支撑。

3.3 文本域

文本域，textarea，内部文字即为该文本域默认文字，其中有两个属性，cols(columns):列 rows:行

3.4 按钮

按钮有三种类型：普通按钮，提交按钮，重置按钮。

按钮也是input标签 的type属性决定，分别是：button\submit\reset

3.5 label

标签，用于关联内容，例如点击标题可以获取对应输入框的焦点等

<input type="checkbox" id="kk" /> <label for="kk">10天内免登陆</label> 

四、其他内容

4.1 注释

<!-- xxxx --> 为一个完整的注释。 sublime中快捷键：ctrl+/

4.2 字符实体

用于打印可能会被转义成标签的内容。例如打印<h1>,只需要打印 &lt;h1> 系统便不会识别错误

常用替代字符: 

&lt;  less than,小于。

&gt; greater than 大于。

&copy; 版权符号。

&nbsp; non-breaking spacing 空格

4.3 废弃标签

font:字体 

b:加粗

u:下划线

i:倾斜

del:删除线

em:强调

strong:强调

hr:水平线

br:换行