HTML4

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

• 有序列表(ordered list)
  

  
  
  1. 有序
  
  
  2. 有序
  
  
  3. 有序
  
  
  
  
  ，HTML5中加入了start 与reversed。start的值只能是整数。

  1. 无序列表(unorded list)
     

     
     
     • 无序
     
     
     • 无序
     
     
     • 无序
     
     

  2. 自定义列表（defined list）
     

     
     

     表头

     
     

     内容

     
     

     表头

     
     

     内容

     
     

  3. 无序排列更加适合所排列的元素关系是并列的，而有序列表更适合有一定顺序关系的元素。自定义列表通常用来概述多个及其描述，通常是专业集。定义术语用dt元素，定义属于的描述用dd元素。

  4. 嵌套
     决定在哪里嵌套后，先不要闭合这个列表标签，插入需要嵌套的列表之后在闭合列表元素，然后继续原来的列表。
     

     
     
     • 苹果
     
     
     • 梨子
     
     
     • 西瓜
       
       
       
       1. 成熟西瓜
       
       
       2. 未熟西瓜
       
       
       
       
     
     

http://learn.hicc.me/html-css/ordered-unordered-definition-lists.html
http://blog.csdn.net/chun_1959/article/details/39159415

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

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

• id是唯一的，不可重复。（像身份证一样）而class则可以重复。
• id的样式优先级别高于class
• id还一个老特性是锚点功能，当浏览器地址栏有一个#xxx，页面会自动滚动到id=xxx的元素上面。
• id一般用于JS， class一般用于CSS。
• 在CSS中
• 以“#”来开头命名id名称如：#css5{属性:属性值;}
• class是以小写句号“.”开头命名，而ID是以“#”好开头定义。
• class一般用于批量的CSS样式处理（因为多个元素可以重复命名给class）

http://www.divcss5.com/rumen/r3.shtml?jdfwkey=43u5z

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

• 一个行内元素只占据它对应标签的边框所包含的空间。

• 块级元素占据其父元素（容器）的整个空间，因此创建了一个“块”。
  代码
  

  

  范例

• 区别
  块级元素占用空间一整行，行内元素占用空间是它自身的内容宽度。行内元素可以一并排显示，块级元素不可。

• 行内元素宽高由其自身决定。行内的左右margin与padding有效，上下的margin与padding无效，但是加border可以显示，可以用line-height将其撑开

• 块级元素：div、p、h1..h6、table、ul、li、dl、dt、form

• 行内元素：a、span、img、input、button、em、textarea

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

• display:block 将元素变为块级元素
• display: inline 将元素变为行内元素
• display: inline-block 将行内元素拥有块级元素属性,但可以在同一行排列，但IE8一下不支持

下面代码是做什么的？抄写一遍下面的代码，注意class和id的使用及命名方式

    

        
        

            
导航1
            
导航2
            
导航3
    
        
    


    

        
侧边栏
        
中心区块
    


    
这里是footer

该代码使得页面分为3部分，头部，内容，底部。使用的是ID命名。头部内有导航的无序列表。内容为侧边栏与中心区块。底部为"这里是footer"。三大块由不同的id命名，即id用来划分大的区块，内部使用class区分。样式中的.wrap使得页面整体处于居中位置，与浏览器上下外距离为0。

如何理解 HTML CSS 语义化? 在平时写代码的过程中要注意哪些细节

• 选择合适的标签
• 合理的代码结构
• 便于开发者阅读
• 同时让浏览器的爬虫和机器很好地解析
• 细节
• html写法是先把页面分大区快，每一大块再分成小块，再细分
• div 中语义化，
  • 大小写不要混用
  • 多个单词用-来连接
  • 命名风格统一

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

• 作用：把用户输入的数据提交到后台
  

• name：表单提交时的名称

• action：提交到的地址

• method：提交方式，get与post,不填写默认为get

• 常用标签

• type="text"，用于输入文本。placeholder属性（可选）展示的是输入框里的提示，maxlength（可选）限制最大输入长度。
  

• type="password" 用于密码输入,输入的内容显示为星号。
  

• type="radio"， 单选圆圈按钮。注意：name要相同，这样表示它们是一组，才能实现单选，value要有值，否则后台无法显示对应的输入值。
  男
  女

• type="checkbox"，复选框。加checked属性会默认选上。提交时，如果选中（如bike），那么bike=on。
  自行车
  汽车

• type="textarea"，文本域，用于输入多行文本。
  

• type="hidden"，隐藏域，用户看不到，用于暂存数据或者安全性校验。
  
  

• 下拉列表框
  我的car:
  
  Volvo
  audi
  opel
  

post 和 get 方式的区别？

	GET	POST
提交数据可见性	提交的数据URL可以看到	不可
数据长度限制	受浏览器限制 ，IE为2083个字符（2K+35字节）	post理论上无上限，受服务器限制
数据类型限制	制 只允许 ASCII 字符	没有限制。也允许二进制数据
后退按钮/刷新	无害	数据会被重新提交（浏览器应该告知用户数据会被重新提交）
书签	可收藏为书签	不可收藏为书签
编码类型	application/x-www-form-urlencoded	application/x-www-form-urlencoded 或 multipart/form-data。为二进制数据使用多重编码
历史	参数保留在浏览器历史中	参数不会保留在浏览器历史中
安全性	GET 的安全性较差，因为所发送的数据是 URL 的一部分	POST 比 GET 更安全，因为参数不会被保存在浏览器历史或 web 服务器日志中。
提交方式	提交的数据URL可以看到	不可

http://www.w3school.com.cn/tags/html_ref_httpmethods.asp

在input里，name 有什么作用？

• name是表单提交时的名称，如果它的值相同，则表示它们是一组，可以实现单选。
• 复选框当中，可以把name值设置成一个数组，比如：
  爱好：
  dota
  旅游
  这样可以使后台对对应的变量选择对应的输入数据。

提交、提交、 三者有什么区别？

• 提交是一个html标签，有众多属性，其中type属性可以设置属性值button或submit，设置不同属性值其功能也不相同；可以包含丰富的内容，而input type="button"则不含有内容。
• 提交
  把一个链接放在提交按钮里面，点击提交会跳转到另一个页面，但是不会向后台提交数据。
• 
  有默认的按钮样式，是表单的一个提交按钮，当点击时会把表单数据发送到服务器

radio 如何 分组?

• 拥有相同的name值的radio为一组

placeholder 属性有什么作用?

• placeholder帮助用户填写输入字段的提示，该提示会在输入字段为空时显示，并会在字段获得焦点时消失。

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

  
    账号：

    密码:
    
    
  
  

这个不可见的表单元素的 value 属性保存了一个要提交给 Web 服务器的任意字符串。如果想要提交并非用户直接输入的数据的话，就是用这种类型的元素。用于暂存数据或者后台进行安全性校验。

---

本文版权归本人和饥人谷所有，转载请注明来源，谢谢！