1. photoShop使用？
组成：
菜单项
工具栏
辅助面板
下载：
https://pan.baidu.com/s/1LVa5R_btSjczLBwskCZidQ 提取码: sc3v
快捷键：
ctrl + r : 显示隐藏标尺
标尺的功能？
在标尺上可以拖拽参考线
可以通过移动工具拖拽回去，也可以在视图菜单中选择清除所有的参考线
图层中的小眼睛可以对当前图层进行显示隐藏
alt + 滚轮：可以对图片进行放大缩小
png等图片的切图流程：
1. 通过矩形选框工具，选择指定的区域
微调：alt 减少区域 shift 增加区域 上下左右键进行微调
利用参考线记录量取的位置，以便以后测量其他的值
2. ctrl + c : 复制图层
3. ctrl + n : 新建图层
4. ctrl + v : 粘贴图层
5. 存储为web格式
psd图片的切图流程：
1. 启动生成器
2. 生成 -图像资源
3. 重命名图层，自动获取切图
4. 可上传到线上，方便数据获取
企业切图流程：
利用工具快速获取样式
蓝湖：https:/ /lanhuapp.com
2. float浮动？
文档流？
文档流是文档中可显示对象在排列时所占用的位置。
float特性？
加浮动的元素，会脱离文档流，会延迟父容器靠左或靠右排列，如果之前已经有浮动的的元素，会挨着浮动的元素进行排列。
脱离文档流，延迟父容器靠左或靠右进行排列。
float: left、right、none
float注意点
只会影响后面的元素。
内容默认提升半层。
默认宽根据内容决定。
换行排列。
主要给块元素添加，但也可以给内联元素添加。
如何清除浮动？
上下排列：clear属性，表示清除浮动的，left、right、both
嵌套排列：
固定宽高 : 不推荐 , 不能把高度固定死，不适合做自适应的效果。
父元素浮动 : 不推荐 , 因为父容器浮动也会影响到后面的元素。
overflow : hidden (BFC规范) , 如果有子元素想溢出，那么会受到影响。
display : inline-block (BFC规范)，不推荐，父容器会影响到后面的元素。
设置空标签 : 不推荐 , 会多添加一个标签。
after伪类 : 推荐，是空标签的加强版，目前各大公司的做法。
( clear属性只会操作块标签，对内联标签不起作用 )
.clear:after{
content: '';
clear: both;
display: block;
/* 目前最流行的 */
}
3. CSS 定位？
position :
static（默认）
relative
absolute
fixed
sticky
relative：相对定位
如果没有定位偏移量，对元素本身没有任何影响
不使元素脱离文档流
不影响其他元素布局
left、top、right、bottom是相对于当前元素自身进行偏移的
absolute：绝对定位
使元素完全脱离文档流
使内联元素支持宽高 （让内联具备块特性）
使块元素默认宽根据内容决定（让块具备内联的特性）
如果有定位祖先元素相对于定位祖先元素发生偏移，没有定位祖先元素相对于整个文档发生偏移（绝对、相对、固定）
fixed：固定定位
使元素完全脱离文档流
使内联元素支持宽高 （让内联具备块特性）
使块元素默认宽根据内容决定（让块具备内联的特性）
相对于整个浏览器窗口进行偏移，不受浏览器滚动条的影响
sticky黏性定位：
在指定的位置，进行黏性操作。
z-index定位层级。
默认层级为0
注意嵌套时候的层级问题--视频86集
.
4. PC端的布局？
***通栏 : 自适应浏览器的宽度。
***版心 : 固定一个宽度，并且让容器居中。
5.css添加省略号？
width 必须有一个固定的宽
white-space : nowrap 不让内容折行
overflow : hidden 隐藏溢出的内容
text-overflow : ellipsis 添加省略号
6.css精灵及好处？
特性
CSS雪碧也叫做CSS精灵，是一种网页图片应用处理方式。它允许你将一个页面涉及到的所有零星图片都包含到一张大图中去加载。
好处
可以减少图片的质量，网页的图片加载速度快
减少图片的请求的次数，加快网页的打开
练习：利用精灵图实现布局效果。
7.css圆角？
border-radius 给标签添加圆角
border-radius: 10px 50px 20px 30px ;
/* 左上 ·10 右上50 右下20 左下30 */
border-radius: 10px 50px;
/* 上左 右下10
上右 左下50 */
border-radius: 20px/40px ;
/* x轴半径20 y轴半径40 椭圆*/
width: 300px;
height: 150px;
background: red;
border-radius: 150px 150px 0 0 ;
/*半圆*/
