栏目分类:
子分类:
返回
名师互学网用户登录
快速导航关闭
当前搜索
当前分类
子分类
实用工具
热门搜索
名师互学网 > IT > 软件开发 > Web开发 > Html/CSS

手把手教你做超酷的条形码效果

Html/CSS 更新时间: 发布时间: IT归档 最新发布 模块sitemap 名妆网 法律咨询 聚返吧 英语巴士网 伯小乐 网商动力

声明
    这篇文章教你在web页面上实现条形码效果,体现的是利用网页制作技术综合解决问题的思路。旨在使对HTML, Javascript,PhotoShop具有入门级水平的人巩固入门级水平。 若有问题不能及时回复,麻烦请担待,不胜感激。 高手免进。

制作条形码总共分几步?
第一步,把冰箱门儿打开——使用PhotoShop绘制小图片
我们需要制作出一个含有16个元素的条形码图片。
首先打开Photoshop,本篇教程中使用的是CS 简体中文 版本,仅就本教程所涉及的方面来看,操作都大同小异,只要认真阅读,应该不会遇到问题。
打开以后首先按Ctrl N,建一个 8像素 X 8像素的图片,背景选择透明,如图所示:

手把手教你做超酷的条形码效果_考高分网jb51.net转载

为了看清楚,可以把图片缩放到最大 1600%。
按一下D,再按一下X,确保前景色为白色背景色为黑色。
使用Ctrl Delele,填充背景色,黑色。
使用铅笔笔工具,参数做如下设置:

手把手教你做超酷的条形码效果_考高分网jb51.net转载

刻画线条,隔一列画一个。画成下面这种效果:

手把手教你做超酷的条形码效果_考高分网jb51.net转载

将图层1拖动到下面的新建按钮上复制一下:

手把手教你做超酷的条形码效果_考高分网jb51.net转载

选择 图层1 副本,将左边第一道白色用铅笔工具涂成黑色(可以按 X 将前景色变成黑色)。如下图所示:

手把手教你做超酷的条形码效果_考高分网jb51.net转载

上一页12 3 4 5 6 下一页 阅读全文
转载请注明:文章转载自 www.mshxw.com
本文地址:https://www.mshxw.com/it/218483.html
我们一直用心在做
关于我们 文章归档 网站地图 联系我们

版权所有 (c)2021-2022 MSHXW.COM

ICP备案号:晋ICP备2021003244-6号