2、选择大唐素材图层,添加剪贴蒙版(Ctrl+alt+G)。
3、我看到中心的图标上还有一圈白边,可以在圆角矩形图层上双击,添加图层样式,设置描边即可。
圆角矩形工具(U)是矢量工具,使用时勾选对齐边缘选项,这样边缘更锐利。另外你使用剪贴蒙版,不删除任何像素,方便以后更改。
1、打开,依次选择选框工具-矩形选框工具。
2、全选矩形照片。
3、依次点击选择-修改-平滑。
4、输入取样半径(取样半径根据像素而定,如果不确定请输入一个数值后观察半径大小再自行进行增减调整),然后点击确定。
5、依次按ctrl+c-ctrl+v,新建选区图层。再设置背景图层不可见(关闭背景图层前面的小眼睛)。
6、依次点击文件-储存为。
7、输入文件名-选择保存格式为PNG。
第一步:插入--形状--圆角矩形
第二步:选中圆角矩形--绘图工具--其他--清冽效果,强调效果6
第三步:形状填充--渐变--角度辐射
第四步:复制制作的圆角矩形(按住ctrl,鼠标拖动)--选中全部圆角矩形--左对齐
第五步:选中第二个圆角矩形,设置如下图
第六步:格式刷,把其他三个图都刷成渐变浅色,第七步:插入--形状--圆角矩形--选中圆角矩形--形状填充(浅蓝色)--形状轮廓(粗细45磅)--排列设置为置于底层
第八步:把浅色矩形(即左下三个小矩形)格式设置为置于底层
第九步:输入文字即可
如果浏览器支持的话, 直接一个 radius 样式就可以了;
border-radius:4px;
-webkit-border-radius: 4px;
新建一个html文件,在html内写新建一个button标签:
<input type="button" name="button" value="设置圆角" class="btn">;同时给button先加上样式:
btn{width: 200px;height: 30px;background: #ccc;border: 1px solid #eee;};
预览html文件,可以看到现在button按钮暂时还没有圆角;
css样式设置圆角有专门的样式(border-radius),因此button按钮设置圆角可以加上:border-radius: 15px;
特别注意,border-radius样式目前只有高版本的浏览器才支持,例如谷歌浏览器,火狐,ie9+等浏览器;
如果你想兼容所有的浏览器,就可以考虑用背景图的形式设置,首先切出一张圆角按钮,然后用background样式设置背景图,而且设置合适的宽高,并去掉默认的边框;
再次预览html,button按钮圆角设置成功了,可以查看所有浏览器,均能正常显示。
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)