第一阶段项目总结---dhBigData

1. 切图

根据psd原型图，裁截相关的图片图标
ps的相关使用方法： ctrl+n新建画布、打开标尺ctrl+r、打开自动选择和图层

放大（快捷键z）图片 ，移动图片（快捷键v），双击所需要的区域的图标，找到对应的图层

同时找到图标的背景图片，关闭背景图片（bg），从顶部侧边可以按住鼠标拉拽出辅助线，有利于剪切，
剪切图标（快捷键c），尽量准确的剪切图标的大小
【也可以找到图标后，右键快速导出png图片】

导出切片（ctrl+shift+Alt+s），选中剪切的图片，改变图片的格式（.png），保存**（图片的命名不要用中文）。**

2. 页面布局

首先对页面进行合理的分块，确定好各个部分的宽高，要求精确的还原原型图，对各个盒子部分的布局定位要合理的设计，使代码具有可复用性，布局方面，要注意，float浮动和position定位相结合使用，要明确什么时候该用哪种方式的布局。
此次项目中出现的问题：
第一：要注意调试，注意页面缩小时横向滚动条的出现，设定最小宽度时，滚动条该出现的宽度为最小宽度。
第二：页面出现白边，缩小时布局出现混乱，检查是否是定位，盒子的宽度，出现问题；还有页面的最小宽度的问题。
第三：文本居中的问题，对于多行文本或者单行文本在盒子内布局中，且当文字超出设定的宽度高度时要注意溢出隐藏，并且以省略号的形式呈现，
在父元素中设置相对定位：position: relative;
在子元素中设置：

	.child{
	/*文字溢出隐藏*/
	      overflow: hidden;
	     text-overflow: ellipsis;
	
	/*文字居中    c3*/
     	position: absolute;
	    top: 50%;
	   left: 50%;
    	transform: translate(-50%,-50%);}

这样多行文字均能在盒子中保持居中，且不会溢出。

第四：鼠标移入移出的hover效果，会出现画面闪烁，要将移入的样式的盒 子，写在同一个标签中，不然，浏览器会识别混乱，出现闪烁。
若每个子标签中有二级菜单，即，二级菜单盒子需要将相对定位写在子标签的父级元素中，这样才能，将所有的子标签的二级菜单固定在相同的位置，不然，二级菜单会相对每个子标签而绝对定位。