第二次前端培训

CSS之盒模型

1. html对每个容器进行了定义。这些容器之间的排版是由css来定义的。
2. 一个容器包含Margin,Border,Padding,Content四个部分。
   • content指的是真正的内容
   • border是盒子的边框
   • padding是边框与内容之间的填充部分
   • margin是盒子之间的间距

CSS布局

1. 一个块级元素在css中的display属性定义为block。
   • 块级元素独占一行，当你定义一个新的块级元素的时候，他会新开一行。并且下一个同级元素也会新开一行。跨级元素的宽度是父容器的宽度。
2. 一个内联元素在css中的display属性定义为inline。
   • 内联元素会排列在一行内，其高度和上下边距不可变。
3. 行内块状元素的display属性定义为：inline-block。
   • 这个容器会与前面的容器排列在同一行中，并且你可以定义此容器的高度和边距。
4. 设置容器的float属性会让容器浮于标准流上面，这个也可以用于让两个块级元素并列排放。但是要注意这个脱离了标准流。
   • float:left\right会让元素从左（右）开始一个一个排列。
5. 弹性盒子

JS初步

1. 赋值
   • 在js中对于变量的定义是弱定义的，可以使用let var对于新建的变量进行声明，建议使用let。
   • const用于声明常量。
2. Object
   • 除了常见的基本数据类型，js中还经常需要使用object对象类型。
   • 可以使用.运算符取出对象中的特定元素。
3. 函数
   • js可以写在html的``标签内，也可以写成一个单独的文件，然后html对其进行引用。
4. 循环语句

   for(i = 1;i <= 10;++i) {
   console.log(i)
   }

   5.控制语句

   • 在js函数里，你可以使用if else来控制函数的走向。
5. input标签
   • 把input放到form标签下，然后直接通过formname.inputname.value获取
   • 通过id获取。使用doucument.getElementById(inputId).value获取。
6. API
   • 弹出警告窗windows.alert()
   • 在控制台打印信息console.log()
7. Dom树
   • 可以通过document.getElementById从dom树上获取特定id的元素
   • doucument.getElementByClass可以获得class为特定值的元素列表。
8. innerHTML
   • 可以使用innerHTML获取某个标签中的内容。

刘一达