制作文章特色图片鼠标悬停效果图片教程

今天分享的就是如标题教大家如何自己动手制作一张属于自己的独一无二的:鼠标悬停到文章特色图片效果图片教程 

代码教程

1.通过修改 css 样式让图片上层添加一层虚化的蒙版:css 样式如下,

2.子比主题设置—>自定义代码—>自定义 CSS 样式:,添加以下 CSS 代码:

这之前就分享过,今天主要说下如何制作这个图片

图片教程

尺寸:45*45 px

背景:透明

字体:江西楷体(自行更换自己喜欢的字体)

制作工具:稿定设计或者能力强点的 PS(下放稿定设计演示)

稿定设计进入之后按照上面的尺寸规格创建相同尺寸的画板记得背景效果透明

之后再画板上添加一个字,比如:科

图片[1]-制作文章特色图片鼠标悬停效果图片教程-科德博客

注意:此处文字颜色必须调整为 #ffffff 

到这里就完事了,自己再导出一下图片记得一定要 PNG 格式的图片(很小,才1kb多),上传到你的服务器即可

之后再修改上面的 CSS 样式种的图片路径

图片[2]-制作文章特色图片鼠标悬停效果图片教程-科德博客

------本页内容已结束,喜欢请分享------

感谢您的来访,获取更多精彩文章请收藏本站。


点此收藏本站
© 版权声明
THE END
喜欢就支持一下吧
点赞14 分享
评论 共4条

请登录后发表评论