web前端基础1
html Hypertext Makeup language --结构 超文本标记语言
css Cascading Style Sheets --样式 层叠样式表
js javascript--行为
<!doctype html> 申明文档类型
<title>网页标题</title> 网页标题
<meta charset="utf-8" /> 代码编码类型
<link href="hyy.css" rel="stylesheet">引入外部样式表
background :green url(img/icon.gif) no-repeat 20px 70px fixed;
no-repeat为不重复、repeat-x表示x方向即水平方向重复，repeat-y表示y方向即竖直方向重复
20px(控制水平方向x轴) 70px（控制竖直方向y轴）
也可以给background 设置center表示居中 ，或者百分数，代表占据多少
fixed 表示固定，图片的位置不会跟着滚动条的改变而改变。
上面的写法等同于：
background-position:20px 70px; //背景图位置
background-repeat:no-repeat; //背景图是否重复
background-image:url(img/icon.gif);//背景图
background-color:gray;//背景颜色
background-attachment:fixed;//背景是否滚动
boder:1px solid green;
边框样式
solid 实线
dashed 虚线（有兼容性问题）
dotted 点线（有兼容性问题，IE6不兼容）
上面的写法等同于：
border-top-width:1px;
border-bottom-width:1px;
border-right-width:1px;
border-left-width:1px;
border-right-style:solid;
border-left-style:solid;
border-top-style:solid;
border-bottom-style:solid;
border-left-color:green;
border-right-color:green;
border-bottom-color:green;
border-top-color:green;
也可以写成：
padding：top right bottom left；
padding：上下 左右；
padding：上 左右 下；
padding：30px;上下左右都为x;
也可以写成：
padding-top 上边内边距；
padding-bottom 下边内边距；
padding-right 右边内边距；
padding-left 左边内边距；
内边距相当于给盒子加了填充厚度会影响盒子大小
如果给盒子加了内边距，又不想盒子的大小受影响的话，可以给盒子的宽和高减去对应的内边距大小
margin和padding一样，方向都是上、右、下、左。
外边距存在的问题:(1)上下外边距会叠压
也就是说两个相邻的元素同时写margin-top和margin-bottom，此时内边距会叠压而不是距离相加
（2）当父级元素包含子级元素，给子级元素设置margin-top，此时margin-top会传递给父级，也就是说相当于给父级设置margin-top，子级没有效果；解决方法就是将给父级设置padding-top并将父级高度减去padding-top的高度；
margin-left:auto;这句话的作用是无论你怎么调整窗口大小，都将元素设置到网页的最右边；同理
margin-right:auto;这句话的作用是无论你怎么调整窗口大小,都将元素设置到网页的最左边；
同时加margin-left:auto;和margin-right:auto;则代表无论你怎么调整窗口大小，都会使元素至于网页中间。
盒模型
盒子大小=border+padding+width/height;
盒子宽度=左border+左padding+width+右border+右padding
盒子高度=上border+上padding+height+上border+上padding