任务一总结

总结：通过任务1的学习初步了解了一个网页的基本构成

由html开始到html结束

中间有head  有body

body里面放的是内容可以放任何东西譬如说盒子 p标签

图片什么的

了解了一个网页的构成了以后又了解了盒模型 知道了行内元素鱼块级元素 什么是行内块

他们之间的转换一个div里面都有什么东西，content padding margin 高度 宽度等

了解了浮动和长度单位PX知道什么是浮动 浮动会脱离当前的文档流单他会排在上一元素后面

动的框可以向左或向右移动，直到它的外边缘碰到包含框或另一个浮动框的边框为止。

由于浮动框不在文档的普通流中，所以文档的普通流中的块框表现得就像浮动框不存在一样

脑图：

耗时：1天

深度思考：

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

DOCTYPE是document type的简写，它并不是 HTML 标签，也没有结束标签，它是一种标记语言的文档类型声明，即告诉浏览器当前 HTML 是用什么版本编写的。

DOCTYPE的作用?

DOCTYPE是document type(文档类型)的简写，在web设计中用来声明文档类型。 

在所有 HTML 文档中规定 DOCTYPE 是非常重要的，这样浏览器就能了解预期的文档类型， 告诉浏览器要通过哪一种规范（DTD）解析文档（比如HTML或XHTML规范）。 

--------------------- 

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

一个盒子是有内容 内边距 外边距 边框 组成 内边距是内容到边没框的距离，有left right bottdoom

top 外边距也是如此。 

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

常见的行内元素有span  有img常见的会计元素有DIVp 标签 ul  ol等

他们之间的区别块状元素独占一行行内元素在一行排列 行内块元素也是同行排列

同事行内元素也可以转换成行内块 块级元素也可以转黄成行内块等。  

4.如何使用浏览器的F12调试页面？  点击查看相关小课堂

f12可以查看网页里的内容

5.九宫格的布局你还能想到哪些办法实现？它们各自的优势劣势是什么？ 

九宫格的布局还可以用给flex布局实现也可以用给33.33%实现 浮动是最简单的。

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

编辑器就是纯粹编辑文本的编辑器、IDE是带有软件开发功能的“集成开发环境”

编辑器的本质是可以写字符就行,像windows自带的写字板就是最简单的编辑器,他的识别级别在文字级,他只显示你想写入,和打开的文本内容.他不管你写什么内容.只提供接收与显示功能。

IDE是集合了sdk, 语言支持包, 函数库, 编辑器在一起的软件,或者集合.可以支持你要学的特定编程语言的.   他的"识别级别"比编辑器高一级, 可以识别到编程语言, 或者这种语言的库. 往往用起来更方便.  或者更专业。

集成开发环境（IDE，Integrated Development Environment ）是用于提供程序开发环境的应用程序，一般包括代码编辑器、编译器、调试器和图形用户界面等工具。集成了代码编写功能、分析功能、编译功能、调试功能等一体化的开发软件服务套。所有具备这一特性的软件或者软件套（组）都可以叫集成开发环境。如微软的Visual Studio系列，Borland的C++ Builder、Delphi系列等。该程序可以独立运行，也可以和其它程序并用。IDE多被用于开发HTML应用软件。例如，许多人在设计网站时使用IDE（如HomeSite、DreamWeaver等），因为很多项任务会自动生成。

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

<meta name="viewport"
      content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">

因为要自适应手机端和电脑端的像素是不同的css中的1PX不等于移动设备的1px

的像素只是一个抽象的单位，在不同的设备或不同的环境中，css中的1px所代表的设备物理像素是不同的。在为桌面浏览器设计的网页中，我们无需对这个津津计较，但在移动设备上，必须弄明白这点。在早先的移动设备中，屏幕像素密度都比较低，如iphone3，它的分辨率为320x480，在iphone3上，一个css像素确实是等于一个屏幕物理像素的。后来随着技术的发展，移动设备的屏幕像素密度越来越高，从iphone4开始，苹果公司便推出了所谓的Retina屏，分辨率提高了一倍，变成640x960，但屏幕尺寸却没变化，这就意味着同样大小的屏幕上，像素却多了一倍，这时，一个css像素是等于两个物理像素的。其他品牌的移动设备也是这个道理。例如安卓设备根据屏幕像素密度可分为ldpi、mdpi、hdpi、xhdpi等不同的等级，分辨率也是五花八门，安卓设备上的一个css像素相当于多少个屏幕物理像素，也因设备的不同而不同，没有一个定论。

所以需要一个定义来规定它。