1 hover的使用
hover表示鼠标移入时候发生的状态改变
hover伪类的使用: 选择器:hover{}
使用:
- 改变自己 当前自己的选择器:hover{}
- 通过父级改变子级 父级选择器:hover 子级选择器{}
- 通过自己改变同级
- 注意: hover不可以通过子级改变父级元素!
拓展:css3中选择器
- > 直接子级元素
- ~ 同级所有
- + 表示同级元素
2 权重的使用
选择器的使用:标签、id、class、包含、群组、通配符、伪类
选择器的权重: 页面中全是div div比较多的时候需要添加不同的选择器 使用四位数字表示的
- 标签 1
- id 100
- class 10
- 包含 ul li 相加
- 群组 a,b,c{} 各自计算
- 通配符 0
- 伪类 10
- 行内样式表 1000
css概念:层叠样式表
- 一个标签可以有多个选择器 id class 标签 包含...
- 多个选择器中属性如果是相同的 会覆盖选择权重最高的显示
- 选择器中的属性是不相同的 会重叠 相加显示
行内样式表,能不写就不写
3 ps的基本使用
1.如何仿写别人的设计图页面
- 360极速/火狐
2.放大缩小设计图
- ctrl+ +/-
- alt+鼠标的滚轮
- ctrl+k会调出首选项
- 按住空格键 鼠标指针会变成抓手工具
3.设置ps中的辅助线/刻度尺
- ctrl+r
4.量取设计图的宽高大小
- ps中默认的单位是cm 需要把cm换成像素 px
- ctrl+k 单位与标尺设置像素即可
- 选择左侧菜单栏的第二个矩形选框工具
- 拉取当前盒子大小 f8/fn
5.如何切图
- 左侧菜单栏的第五个按键
- 左键长按/右键单击选择切片工具
- 从左上角往右下角拉取即可
6.如何保存切片
- ps会默认生成一个images文件夹
- 注意:保存切片的时候要选择 '所有的用户切片'
7.清除切片赫尔参考线
- 视图下面找到响应的清除按钮
表情包的制作
- 选取相应的图片
- 利用橡皮擦工具抹去脸部表情
- 套索工具复制粘贴
- ctrl+t选择到表情 shift+鼠标拖动定比例控制大小
- 图像 -模式 - rgb(三原色)换成灰度 - 不拼合-扔掉
- 图片 - 调整 - 色阶
4 千锋首页的色块布局
1.title前的小图标
<head>
<link rel="icon" href="images/icon.ico">
</head>
2.
考虑用户的电脑 宽度不能设置成固定值 100%
样式表中margin: 0 auto;/* 上下为0 左右自动 */
div#banner <=> <div id="banner"></div>
div.name <=> <div class="name"></div>