[北京|结业弟子]JS-郭晨阳|2018年07月14日的日报-技能树.IT修真院

发表于： 2018-07-14 21:24:47

2 679

任务1深度思考：

1.HTML文件里开头的Doctype有什么作用？

Doctype是一个声明，说明它是在哪个HTML版本的指令，必须在文档的开始添加 <!DOCTYPE> 声明。

【<!DOCTYPE> 声明必须是 HTML 文档的第一行，位于 <html> 标签之前。 <!DOCTYPE> 声明不是 HTML 标签；它是指示 web 浏览器关于页面使用哪个 HTML 版本进行编写的指令。在 HTML 4.01 中，<!DOCTYPE> 声明引用 DTD，因为 HTML 4.01 基于 SGML。DTD 规定了标记语言的规则，这样浏览器才能正确地呈现内容。 HTML5 不基于 SGML，所以不需要引用 DTD。】

2.如何理解盒模型及其content、padding、border、margin？

昨天的日报水了一下，没说margin。margin：top right bottom left； margin 属性值是数值单位，可以是长度、百分比或auto，margin 甚至可以设为负值，造成BOX与BOX之间的重叠显示。

margin折叠的规则：1两个或多个毗邻的普通流中的块元素垂直方向上的margin会折叠 2浮动元素/inline-block的元素/绝对定位元素的margin不会和垂直方向上的其他元素的margin折叠 3创建了块级格式化内容的元素，不和它的子元素发生margin折叠 4元素自身的margin-bottom和margin-top相邻时也会折叠

3.常见的inline元素、block元素、inline-block元素有哪些？它们之间有什么区别？

inline是内联元素，block是块级元素，inline-block是内联块元素。

【inline元素：一个内联元素不会开始新的一行，并且只占有必要的宽度。常见的块元素有div、p、h1...h6、ol、ul、dl、table、address、blockquote、form。

block元素：一个块级元素总是开始新的一行，并且占据可获得的全部宽度(左右都会尽可能的延伸到它能延伸的最远) 常见的块元素有div、p、h1...h6、ol、ul、dl、table、address、blockquote 、form。

inline-block元素：它像内联元素，但具有宽度和高度。 img、input标签就是这种内联块元素标签

区别:一是排列方式，二是宽高边距设置，三是默认宽度。 (1)块级元素会独占一行，而内联元素和内联块元素则会在一行内显示。 (2)块级元素和内联块元素可以设置 width、height 属性，而内联元素设置无效。 (3)块级元素的 width 默认为 100%，而内联元素则是根据其自身的内容或子元素来决定其宽度。

4.IDE是什么？它和文本编辑器相比有什么优缺点？

集成开发环境（IDE，Integrated Development Environment ）是用于提供程序开发环境的应用程序，一般包括代码编辑器、编译器、调试器和图形用户界面等工具。集成了代码编写功能、分析功能、编译功能、调试功能等一体化的开发软件服务套。所有具备这一特性的软件或者软件套（组）都可以叫集成开发环境。

IDE用于软件开发，有着特别多的其他功能，能做的事情很多，文本编辑器就是纯粹编辑文本的编辑器，比较简单。

5.加和不加meta的viewport有什么区别？

加入meta标签可以viewport的宽度等于设备的宽度；同时不允许用户手动缩放。