好得很程序员自学网

<tfoot draggable='sEl'></tfoot>

PS网页设计教程XVI——在PS中创建一个摩登实验室风格的网页设计

作为编码者,美工基础是偏弱的。我们可以参考一些成熟的网页PS教程,提高自身的设计能力。套用一句话,“熟读唐诗三百首,不会作诗也会吟”。

In order to save some time later, we can save the layer style that we applied to the "services_bg" layer and use it again whenever we need it.

为了以后节省时间,我们可以保存给services_bg添加的图层样式,并在日后需要的时候直接调用。

Open the Styles Panel (Window > Styles). Make sure that the "services_bg" layer is selected and click on the Create new style button from the bottom of the Styles Panel. A new window will appear. Name this style "content area 1px stroke". Leave the Include Layer Effects option checked and click OK. Now, when we need to use this layer style, you can click it from the Styles Panel to apply it to any layer you want.

打开样式面板( 窗口 > 样式 )。确保services_bg图层选中,然后点击样式面板底部的 创建新样式 按钮。一个新的窗口出现。命名此样式为content area 1px stroke。勾选 包含图层效果 ,并点击确定。现在,当我们需要这个图层样式,你可以在样式面板中点击该样式添加到你需要的图层

Select the Rectangle Tool (U) and create a rectangle with the dimensions 300×60px and the color #c2c9cc. Name this layer "top bar" and put it at the top of the white rounded square. Double-click on this layer to open the Layer Style window and use the settings from the following image. For Stroke I used the color #a5adb1 and for Pattern Overlay I used the diagonal stripe pattern that we created in this tutorial.

选择 矩形工具 创建一个矩形 (130,520) ,尺寸:300px*60px,颜色: #c2c9cc。命名此图层为top bar并把它摆放到白色圆角矩形的顶部。双击打开图层样式窗口,并按照下图设置样式。描边的颜色: #a5adb1,图案叠加用的是本教程中创建的斜对角线图案

Right-click on the "top bar" layer and select Create Clipping Mask to make it visible only over the white square

在top bar图层上右键选择创建剪贴蒙版,只有在白色方块中的部分才显示出来

Again, save th

查看更多关于PS网页设计教程XVI——在PS中创建一个摩登实验室风格的网页设计的详细内容...

  阅读:46次