一、今日所学内容1.元素的显示和隐藏
(1)display显示与隐藏(常用的隐藏元素属性)
display:block; 除了转化为块元素的功能外,还能将元素显示出来;
display:none;
display来隐藏元素时,隐藏的元素不再占有原来的位置;
(2)visibility显示与隐藏
visibility:visible;元素可视;
visibility:hidden;元素隐藏;
用visibility隐藏元素之后,继续占有原来的位置;
如果隐藏元素之后不占用位置就用display,如果要占有位置就用visibility;
(3)overflow显示与隐藏
overflow:visible;不剪切内容,也不添加滚动条;
overflow:hidden;将超出盒子的内容给隐藏掉;
overflow:scroll;不管盒子里的内容有没有超出盒子的范围,都显示滚动条;
overflow:auto;超出盒子的话,就显示滚动条;不超出盒子,就不显示滚动条;
2.CSS的其他技巧
(1) 精灵图:将多张小图片整合到一张大的图片中返回给浏览器,可以减少对服务器的重复请求,以减轻服务器的压力
(2)鼠标样式:cursor
default 默认的样式
pointer 小手的鼠标样式
text 文本的鼠标样式
move 拖动时的样式
not-allowed 禁止的鼠标样式
(3)输入框删除外框 outline:none;
(4)文本域取消拖拽 resize:none;
(5)行内元素的对齐方式: vertical-align:
baseline 默认值:基线对齐
bottom 底线对齐
middle 中线对齐
top 顶线对齐
(6)CSS的三角制作
原理:盒子的四个边框的连接处是分别平分的样式;将盒子的宽度设置为0,直接利用边框可产生四个三角形状;将边框的颜色设置为透明,需要哪个角,就单独设置哪个边框的颜色即可
(7) CSS省略号制作
步骤:让文字一行显示;将多余的文字隐藏掉;将隐藏的文字用省略号代替
(8)CSS字体图标的使用
从相关网站下载,再进行解压后进行使用
2.PS的基本操作
(1)常规操作:
1、文件里打开相应的psd图片
2、Ctrl+R 可以打开标尺,右击标尺可以选择单位
3、Ctrl+加号:放大图片;Ctrl+减号:缩小图片
5、用选框工具可以测量大小
(2)切图
1、先选择切片工具
2、选择要切片的区域
3、点击文件进行保存
4、选择jpeg格式点击存储
5、将切片选项选择为选中的切片导出即可
(3)手动合并图层导出:
1、选中所需合并的图层
2、ctrl+e合并图层,右键点击图层导出即可
(4)cutterman插件的使用:
1、先安装cutterman插件
2、重启ps,找到cutterman插件
3、使用cutterman进行图层合并导出
二、今日问题 无 三、解决方案 无
|