1.前端开发流程?
老板或甲方是一个需求的真正发起者
设计是前端的上游,前端是设计的下游
产品最终的结果是原型图/设计师的结果是psd文件/前端的工作结果html页面
产品文档表示页面的流转或数据的走向/交互文档描述页面复杂的交互或各个用户表单与用户发生的各种互动。
2.概念:
1.场景设计/2.测试回溯:/没有文件或邮件是不能做一个后期测试回溯的依据
2.html基础
- 前端开发语言(html)、第一个标准的HTML页面
- 标签与代码嵌套关系、样式表的种类与区别
- 超链接、target、相对路径与绝对路径
- 盒模型及其注意事项
- 弹性盒
- html常用标签:h1-h6、div、 p、strong、em、span、ul、ol…,
- HTML5标签: header 、 nav 、 footer 、section、article、aside、time
- 特殊的img、
- -
3.CSS基础
- CSS常见样式:width\height\border\
- 复合样式(font/bacground/margin/padding/border/transition/)
- rgb\16进制
CSS浮动
- 浮动(float)概念
- 文档流的概念与现象、
- 清除浮动的原理
.fl{float: left;}
.fr{float: right;}
.clear{
clear: both;
}
.clear:after,.clear:before{
content: '',
display: table;
clear: both;
}
.clear{
*zoom:1;
}
CSS定位(position)
- 相对定位(relative)概念、
- 相对定位的表现、绝对定位(absolute)概念、绝对定位的表现、
- 固定定位(fixed)概念
- 定位的层级特征(z-index)
- 透明度、透明度滤镜、opacity \ filter:alpha(opacity=0~100)
button{
cursor: pointer;
/*transition:CSS3的过度效果*/
transition:0.5s;
}
button:focus{
border:none;
outline: none;
opacity: 0.6;
/*这是ie的alpha滤镜*/
filter: alpha(opacity=60);
}