最近还莫名其妙的生病了，好受打击，希望能顺顺利利的学完我的前端。加油！

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

有序列表 ol（ordered list）
有序列表，顾名思义，就是有顺序的列表，项目列表使用数字进行标记，适用于有前后循序的列表。有序列表始于
1. 标签。


    有序列表
    有序列表
    有序列表

无序列表 ul（unordered list）
无序列表就是没有顺序的列表，项目列表使用原点进行标记，适用于前后没有明确顺序的列表。无序列表始于
- 标签。
```
    无序列表
    无序列表
    无序列表
```
- 自定义列表 dl（defined list）
  自定义列表不仅仅是列表，更是项目及其注释的组合。自定义列表始于
  标签，每个列表项始于表头
  ，列表项的说明始于表内容
  。
```
    表头
    内容
    内容
```
总的来说，列表无论用上面三种的哪一种都可以实现，关键要看列表要怎么展示出来，然后选择最适合的方式。有序列表适用于明显的排列顺利，而且次序不能乱；无序列表最常见，适用于简单的列出，表示并列关系；自定义列表有的时候可能会更简单，更精准，语义化更好。
列表是可以嵌套的，下面写个简单的实例，其中也含有列表嵌套：
```
    
    
    列表
    


    
        刷牙
        洗脸
        吃饭
    
    
    
            规划
            
                制定出每天要完成的任务
                每天一小步，一步步去实现
            
        
        
            学习步骤
            
                先看视频  
                把问题整理成博客
                对于重要的知识点，自己要再去多查阅资料，善于总结
            
        
    
    
        兴趣爱好 
        旅游
        交朋友
    
```
效果预览地址：预览
ps:如果class名称为多个单词，除了使用上面的命令[class="A B"]外，还可以使用[class=A][class=B]。

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

要去除列表前面的点或者数字，使用list-style: none;就可以实现。

去除列表的点和数字

三.class 和 id 有什么区别？什么时候用 class 什么时候用 id？
- class和id的区别
- 对于css来说：
  - id和class都是选择器，不同的是id优先级高于class
  - 在css里面，id前缀要加“#”，class“.”
- 对于html来说：
  - id具有唯一性，class具有普遍性，可以重复使用
  - id具有锚点功能，如果浏览器有个地址#xxxx，页面会自动跳到id=xxxx的元素上面
- 从概念上来说，id是先找到结构或者内容，然后才是定义样式，而class是先定义好某种样式，再来给多个结构或者内容。
- 什么时候用id什么时候用class
  id是identity的缩写，形象化来说，比如说我是学生，class代表我的班级，id代表我的学号。班级里的所有人都可以称为是这个班级的，但是每个人的学号是唯一的。
  因为id的唯一性，所以尽量在结构内部使用，通常来说用于页面布局；id多用于Javascript操作DOM。
  class可以重复，一般在结构内部使用，用于样式定义；class可以通过给多个元素赋予同一class，批量操作来设置css。
四.块级元素、行内元素是什么？有什么区别？分别对应哪些常用标签？
- 块元素就像是一个段落，是其他元素的容器元素，可以容纳其他块元素或者行内元素；行内元素，也叫内联元素或者内嵌元素，则可以比作一个单词，只能够容纳文本内容或者其他的行内元素。
- 块级元素（block element）会占据一整行空间，块级元素之间会另起一行显示；行内元素（inline element）只占用自身的内容宽度，可以并排显示。形象的来看，利用审查元素，当你鼠标放置在块级元素上面时，选中的是元素所在的一整行；而放置在行内元素时，只选中了元素所在内容的那一部分。
- 对于行内元素，手动设置宽高是无效的，它本身的高度是由自身决定的；
  行内元素的margin和padding的上下方向不占据空间（若元素加了边框，边框会上去，但本身不占据空间），margin和padding的左右方向会有效果。
  
  行内元素的宽高和内外边距
- 块级元素常用标签：p,div,dl,ol,ul,h1-h6,table等
  行内元素常用标签：a,img,span,input等
提到块级元素和行内元素，就必须要提到display，它可以改变元素的展示形式，比如说把块级元素变成行内元素，这就是下面要提到的内容。

五.display: block、display: inline、display: inline-block分别有什么作用?
- display: block
  表示把此元素作为块级元素显示，具有块级元素的性质。
- display: inline
  表示把此元素作为行内元素显示，具有行内元素的性质。
- display: inline-block
  表示此块级元素既有行内元素的性质，可以水平排列，又具有块级元素的性质，可以设置上下左右的边距，但缺点是IE8以下不能使用。当然要实现这样的效果也可以使用浮动来实现。
- display: none
  隐藏，脱离文档流。
ps：text-align用于块级元素，一个div或者段落上，对内部行列元素（文字或者图片等）生效。

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


    
        
            
            
                导航1
                导航2
                导航3    
            
        
    
    
        
            侧边栏
            中心区块
        
    
    
        这里是footer
    
```
上面的代码主要是把页面分为三个部分：头部、内容、底部。头部里面有三个导航栏，内容有侧边栏和中心区块，底部就是footer。三大块由不同的id命名，即id用来划分大的区块，内部使用class区分，这里命名要注意语义化，命名风格要保持统一。在内部结构中，三个区块结构里面共用了一个class，也就是wrap，在样式设置中设置了它的宽度（防止撑满一行）和外边距（水平居中）。

七.如何理解 HTML CSS 语义化? 在平时写代码的过程中要注意哪些细节。
- 语义化就是要根据情况选择正确的标签，恰当的利用好标签的作用。
- 命名要有一定的含义，让人一看到就能知道是什么，这样便于维护和阅读。
- 命名风格要保持统一，比如说使用下划线就坚持使用。
八.form表单有什么作用？有哪些常用的input 标签，分别有什么作用？
- form表单是用来把用户输入的数据提交到后台。
  其中：name:表单提交时的名称；action提交到的地址，如果不写action，信息就会提交到当前页面；method提交方式（get和post），如果不写，默认的是get
```
     
```
- 常见的input标签
- type="text"，用于输入文本。placeholder属性（可选）展示的是输入框里的提示，maxlength（可选）限制最大输入长度。
```
 
```
- type="password"，用于输入密码，输入的内容显示为星号。
- type="file",用于上传文件。
- type="radio"，单选圆圈按钮。注意：name要相同，这样表示它们是一组，才能实现单选，value要有值，否则后台无法显示对应的输入值。
```
 男
 女
```
- type="checkbox"，复选框。加checked属性会默认选上。提交时，如果选中（如bike），那么bike=on。
```
自行车
汽车
```
- type="textarea"，文本域，用于输入多行文本。
- type="hidden"，隐藏域，用户看不到，用于暂存数据或者安全性校验。
- type="submit"，用于提交表单数据。
- 下拉列表框
```
  我的car:
              dota
旅游
```
这样在命名的时候比较方便，后台也会给对应的变量选择对应的输入数据。需要注意的是，input都要有name属性。

十一.、提交、三者有什么区别？
- 是一个普通的提交按钮，需要绑定JS事件，button里面可以加一些比如文字、图像等内容。
- 提交
  把一个链接放在提交按钮里面，点击提交会跳转到另一个页面，但是不会向后台提交数据。
- 可以提交一个表单的数据。
十二.radio如何分组?

通过设置name值实现分组，如果name值相同，则表示它们是一组，可以实现单选。
```
通信工程
网络工程
```
十三.placeholder 属性有什么作用?

placeholder是用于显示在输入框提示的信息。
```
评论：
```
placeholder

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

隐藏域，用户看不到，用于暂存数据或者后台进行安全性校验。

隐藏域

虽然用户看不到，但向后台提交的数据中其实包含了check=1234。

十五.iframe

iframe 也是html的一个标签，在一个页面中嵌入另一个网页，创建包含另外一个文档的内联框架。iframe的属性有以下几种：
- frameborder：可用值为1和0，规定是否显示框架周围的边框
- width：frame的宽度
- height：frame的高度
- src：引入的资源（页面、图片等）url
```
    
    百度
    饥人谷
```
效果图

十六.代码

写出如下form表单，性别和取向是单选，爱好是多选。

要实现的界面

效果预览地址：预览效果
代码的github链接： Github

HTML4

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

规划

学习步骤

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

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

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

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

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

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

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

十一.、提交、三者有什么区别？

十二.radio如何分组?

十三.placeholder 属性有什么作用?

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

十五.iframe

十六.代码

你可能感兴趣的:(HTML4)

HTML4

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

规划

学习步骤

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

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

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

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

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

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

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

十一.提交、提交、三者有什么区别？

十二.radio如何分组?

十三.placeholder 属性有什么作用?

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

十五.iframe

十六.代码

你可能感兴趣的:(HTML4)

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

十一.、提交、三者有什么区别？