css、js

css盒子模型

盒子成分分析：

margin：盒子的外边距

margin-top：上边距

margin-bottom：下边距

margin-left：左边距

margin-right：右边距

padding：盒子的内边距

padding-top：上边距

padding-bottom：下边距

padding-left：左边距

padding-right：右边距

注意：从上开始，顺时针进行赋值 对边相等

border：盒子的边框

border-top：上边框

border-bottom：下边框

border-left：左边框

border-right：右边框

border-width：边框宽度

border-style：边框样式

border-color：边框颜色

盒子总大小计算：

margin+border+padding+content

css标准文档流

行内元素、行内块：依次从左到右进行排布

块级元素：依次从上到下进行排布

三种方式进行脱流：

1.浮动

2.绝对定位

3.固定定位

css浮动

浮动的性质

1.浮动的元素脱流

2.浮动的文字会出现字体围绕的效果

3.浮动的元素相互依靠

注意：浮动后不再区分行内、块级等，可以设置宽高

css定位

1.静态定位，默认为静态定位，position：static，无法通过top、bottom、left、right进行定位

2.相对定位，position：relative，参照原本的位置进行移动，通过top、bottom、left、right进行定

位，并且保留原本的位置

3.绝对定位，position：absolute，参照有定位属性的父级标签，如果没有，则参照body，通过

top、bottom、left、right进行定位，并且不会保留原本的位置

4.固定定位，position：fixed，参照浏览器进行移动，通过top、bottom、left、right进行定位

JavaScript介绍

JavaScript是一种基于对象和事件，并且有安全性的脚本语言，是一门弱类型语言

注意：js严格区分大小写

js的三种写法

1.行内js

只作用于当前行

2.页面js

作用于当前页面

3.外部js

作用于当前项目

js基本语法

js基本数据类型

1.number：数字

2.string：字符串

3.boolean：true&false

4.null：空

5.undefined：未定义

js变量：

var 变量名 = 变量值;

查询变量属于什么类型

typeof()