html和css基础

• 有序列表、无序列表、自定义列表如何使用？写个简单的例子。三者在语义上有什么区别？在哪些情况下使用哪种（重要）？ 

有序列表是有顺序的，如：

<ol>
    <li>1</li>
</ol

无序列表是无顺序的，并列的

<ul>
    <li>苹果</li>
</ul>

自定义列表通常用于表示名词或者是概念的定义，每一个子项有两个部分组成，第一部分是名词或者是概念，第二部分是相应的解释和描述。

<dl>
    <dt>列表头</dt>
    <dd>列表内容</dd>
</dl>

三者区别：

• 无序列表只是纯粹的表示一些相关项的列表，这些项或者顺序不重要或者没有编号或者不以字母顺序为序。在HTML中创建无序列表使用块级元素ul，列表中的项用块级元素li表示。
• 有序列表元素ol，以及其中的列表项和无序列表相似。主要的不同在于有序列表中每项的顺序很重要。与无序列表显示一个实心的小圆点不同，默认有序列表显示数字的序号。使用CSS可以将其更改为字母、罗马数字或者其他。
• 定义列表有别于无序列表和有序列表。定义列表通常用来概述多个及其描述，通常是专业集。在HTML中使用dl元素来表示定义列表，定义列表中不使用li定义列表项，而需要使用两个元素：定义术语用dt元素，定义属于的描述用dd元素。

在哪些情况下使用哪种（重要）？

• 如果项目之间有顺序之分可以使用有序列表；
• 如果是无序的项目则可以使用无序列表；
• 如果需要概述多个项目及其描述可以使用自定义列表。

• 如何去除列表前面的点或者数字？

       通过设置list-style:none。

• class 和 id 有什么区别？什么时候用 class 什么时候用 id？

1. id加前缀#，class加前缀.
2. id一个页面只能使用一次，class可以使用多次。
3. id是一个标签，具有独一无二性，用于区分不同的结构和内容；class是一个样式，可以套在任何结构和内容上。
4. 概念不同：id先找到结构/内容，再定义样式，class先定义好样式，再套给多个结构/内容。

    大部分时候用class，比较灵活。当要用 Javascript 的 GetElementByID 函数时，要用 id。且id和class都区分大小写。

• 块级元素、行内元素是什么？有什么区别？分别对应哪些常用标签？

块级元素：

1. 占用空间是一整行；
2. height、line-height、padding、margin都可调控；
3. 宽度缺省是它容器的100%；
4. 可容纳行内（内联）元素和其他块元素。

常用的块级元素：div、p、h1...h6、table、tr、ul、li、dl、dt、form

      行内元素：

1. 占用空间是它自身的内容宽度；
2. height、line-height、padding、margin不可改变；
3. 宽度是它本身的文字或图片宽度，不可改变；
4. 内联元素只能容纳文本或其他内联元素。

常用的内联元素：a、span、img、input、button、em、textarea等

　　区别：

1. 块级元素不能并排显示，只能单独显示一行；行内元素可以并排显示；

• display: block、display: inline、display: inline-block分别有什么作用?

1. display: block 将元素转化为块级元素，可以设置宽高，可包含块元素和内联元素，不设宽度时自动撑满一行;
2. display: inline 将元素转化为行内元素，可以不独占一行，可包含块元素和内联元素
3. display: inline-block 将元素转化为行内块级元素，可以不独占一行，同时可以设置宽高，不设宽度时宽度由内容宽决定，ie6,7下不支持inline-block

• form表单有什么作用？有哪些常用的input 标签，分别有什么作用？

form表单用于把用户输入的数据提交到后台。

常用的input标签：

1. text:定义单行输入字段，用户可在其中输入文本。
2. radio:单选按钮
3. checkbox:复选框
4. passward：定义密码字段
5. button:可点击按钮
6. submit:提交按钮
7. reset:重置按钮
8. textarea:多行文本区域
9. hidden:隐藏域
10. file:输入字段和“浏览”按钮，供上传文件。
11. image:定义图像形式的提交按钮

• post 和 get 方式的区别？

1. get是默认的，数据提交方式不同，get提交的数据url可以看到，post看不到;
2. get一般用于提交少量数据，post用于提交大量数据；
3. get最多提交1K数据，受浏览器的限制，post理论上不受限制，但是受服务器的限制；
4. get提交的数据保存在浏览器历史记录中，安全性不好

	GET	POST
后退按钮/刷新	无害	数据会被重新提交（浏览器应该告知用户数据会被重新提交）。
书签	可收藏为书签	不可收藏为书签
缓存	能被缓存	不能缓存
编码类型	application/x-www-form-urlencoded	application/x-www-form-urlencoded 或 multipart/form-data。为二进制数据使用多重编码。
历史	参数保留在浏览器历史中。	参数不会保存在浏览器历史中。
对数据长度的限制	是的。当发送数据时，GET 方法向 URL 添加数据；URL 的长度是受限制的（URL 的最大长度是 2048 个字符）。	无限制。
对数据类型的限制	只允许 ASCII 字符。	没有限制。也允许二进制数据。
安全性	与 POST 相比，GET 的安全性较差，因为所发送的数据是 URL 的一部分。在发送密码或其他敏感信息时绝不要使用 GET ！	POST 比 GET 更安全，因为参数不会被保存在浏览器历史或 web 服务器日志中。
可见性	数据在 URL 中对所有人都是可见的。	数据不会显示在 URL 中。

• 在input里，name 有什么作用？

1. name属性规定input元素的名称；
2. 用于对提交到服务器后的表单数据进行标识，或在客户端通过javascript引用表单数据。

• <button>提交</button>、<a class="btn" href="#">提交</a>、<input type="submit" value="提交"> 三者有什么区别？

1. 第一个是提交按钮，后续用于绑定JS事件使用；第二个是在当前页面有个提交按钮的链接，点击不会有提交的效果；第三个是用来提交表单数据，

• radio 如何 分组?

当name相同时，分成一组

• placeholder 属性有什么作用?

提供可描述输入字段预期值的提示信息

• type=hidden隐藏域有什么作用? 举例说明

1. 隐藏域在页面中是不可见的，在表单中插入隐藏域的目的在于收集或发送信息，以利于被处理表单的程序使用。浏览者单击发送按钮发送表单时，隐藏域的信息也被一起发送到服务器。
2. 当form中有多个提交按钮时，可以在每个按钮上写一个隐藏域，使程序能够分清楚到底用户是按哪个按钮提交的
3. 当一个网页有多个form时，由于不能同时提交，但这些form又相互作用时，可在form中添加隐藏域使他们联系起来
4. js不支持全局变量，当必须使用全局变量时可先把值存在隐藏域中，使之不丢失