[郑州|结业弟子]JS-徐海达|2018年06月08日的日报-技能树.IT修真院

发表于： 2018-06-08 20:31:56

3 658

今天完成的事情：敲完了任务三，然后一直在看基础知识，然后看了class和id的命名规则。

明天计划的事情：明天看一下任务死，然后继续补基础知识，然后class规范命名，练习工具的熟练应用。

遇到的问题：今天敲任务三的时候图片大小一直无法控制，后来去看了img的属性，然后用height解决了问

题，然后是文字的居中，开始只用了外间距无法达还原效果图，后来又加上了居中text-align：center；解

决了居中问题。

收获：今天学到了img的属性运用 height ：定义图像的高度

width ：定义图像的宽度

然后就是text-align：center；居中的应用

还有class和id的命名规范：采用英文字母，数字和 - 命名，以小写字母开头，不能以数字和 - 开头

命名要考虑复用，且符合语言语义化，要根据功能来命名，不要以表现来命名。

一个id在一个页面里只能出现一次，不能出现多个同名id。

任务一深度思考

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

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

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

DOCTYPE声明必须在 HTML 文档的第一行，它不属于 HTML 标签；它是一条指令，告诉浏览器编写页面所用的标记的版本。

doctype会影响代码验证，并决定了浏览器最终如何显示Web文档。

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

CSS盒子模型就是在网页设计中经常用到的CSS技术所使用的一种思维模型。　属性名：内容(content)、填充(padding)、边框(border)、边界(margin)，　这些属性可以把它转移到日常生活中的盒子（箱子）上来理解，日常生活中所见的盒子也就是能装东西的一种箱子，也具有这些属性，所以叫它盒子模式。　　每个盒子都有：边界、边框、填充、内容四个属性；　　每个属性都包括四个部分：上、右、下、左；这四部分可同时设置，也可分别设置；里的抗震辅料厚度，而边框有大小和颜色之分，又可以理解为生活中所见盒子的厚度以及这个盒子是用什么颜色材料做成的，边界就是该盒子与其它东西要保留多大距离。css盒子尺寸的计算：我们通过给高宽赋值，来定义content(内容)的高度和宽度。如果没有做任何声明，那么高度和宽度的默认值将是自动(auto)。即在css中给一个块级元素的width和height属性赋值时比如div{width ：200px; height: 200px}时，其中的width 和height只是对content部分设置的，是长和宽而不是内容，内边距，边框的总和。

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

inline元素全称Inline Elements，一个内联元素不会开始新的一行，并且只占有必要的宽度。

常见的块元素有div、p、h1...h6、ol、ul、dl、table、address、blockquote、form。

block元素全称Block-level Elements一个块级元素总是开始新的一行，并且占据可获得的全部宽度(左右都会尽可能的延伸到它能延伸的最远)

常见的块元素有div、p、h1...h6、ol、ul、dl、table、address、blockquote 、form。

inline-block元素，英文释义:inline-block elements are like inline elements but they can have a width and a height.它像内联元素，但具有宽度和高度。

4.如何使用浏览器的F12调试页面？

成果展示然后f12，点击代码，调试属性。。。

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

换个单位百分比，px都可以，百分比，rem。

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

IDE的英文全称为“IntegratedDriveElectronics”，即“电子集成驱动器”，它的本意是指把“硬盘控制器”与“盘体”集成在一起的硬盘驱动器。把盘体与控制器集成在一起的做法减少了硬盘接口的电缆数目与长度，数据传输的可靠性得到了增强，硬盘制造起来变得更容易