1、两栏自适应布局

两栏
html

<div class="layout">
  <div class="left"></div>
  <div class="main"></div>
</div>

css

.layout .left {
  float: left;
  width: 100px;/*设置一个固定宽度*/ 
}
.layout .main {
  margin-left: 100px;/*通过margin-left调整类名为main的div这一栏的左边界位置*/
}

当浏览器宽度发生变化时，类名为main的这一栏就能根据浏览器实际宽度进行宽度调整。

三栏
左右两栏分别设置float:left;和float:right;，并设置所需宽度，中间栏不设置宽度，设置左右两边的margin值即可。

2、JavaScript

引入JavaScript

在html中插入下列语句即可。要有结束标签。

<script src="文件路径"></script>

给元素添加内容

var label = document.querySelector('.类名');
/*根据类名获取内容，并赋值给变量label*/
label.innerHTML = 'hello world';
/*向对象插入内容hello world*/

给元素添加样式

var a = document.querySelector('.类名');
console.log(a);/*确保获取正确的内容*/
a.style.backgroundColor = '#ffffff';/*Color可以改成其他属性*/

变量和字符串的使用

变量可以代表所获取的内容；
“+”可以连接字符串和变量。

var color = 'rgb(' + red + ',' + green + ',' + blue + ')';

数据类型

数值（int）、字符串（string）、布尔（boolean）、数组（array）、对象（object）、Null、Undefined
int + int 输出 int
string + string 输出 string
int + string 输出 string
字符串类型需要用双引号或单引号括起来。
'100'表示的是字符串而不是数值。

3、笔记

常用的浏览器有哪些，目前的主流分别版本是？你能找到市场的占用率数据吗？

常用浏览器有：
Chrome浏览器；
Firefox浏览器（属于Mozilla，网页开发的利器）；
IE浏览器；
Safari浏览器；
UC浏览器（相比PC，移动端用户更多）；
百度浏览器；
搜狗浏览器；
360安全浏览器；
360极速浏览器；
QQ浏览器（安装包很小）；
Edge浏览器（IE的升级版本，现在内置于win10系统中）；
遨游浏览器；
Opera浏览器。
*主流版本有待补充。

世界范围内的桌面浏览器市场占有率

国内桌面浏览器的市场占有率
以上数据来源：浏览迷 » 2017年6月份全球主流浏览器市场份额排行榜

变量名，命名有什么规则吗？比如 $123 这样是合法的吗？中文可以使用吗？

（1）命名规则

1、数字、字母(a-z A-Z)、下划线(_)、$组成
2、不能以数字开头
3、不能Java的关键字和保留字（有特殊含义）
如：int、double、class等是关键字；const、goto是保留字；
4、区分大小写
如：A和a是不同的变量；INT不是关键字可以做变量名；

（2）合法；（3）不可以使用中文。