網(wǎng)頁(yè)設(shè)計(jì)技巧之如何在Photoshop里畫(huà)虛線？

Photoshop里虛線怎么畫(huà)啊，ps里怎么畫(huà)虛線？ "每次我都是在Illustrator里畫(huà)好然后再轉(zhuǎn)到PS里，弄得不好虛線還朦朦朧朧的，看著一點(diǎn)也不精致，有沒(méi)有簡(jiǎn)單點(diǎn)的一勞永逸的辦法?。?quot;

面對(duì)這種情況，李胖紙一般都很明智的讓他去百度了，不過(guò)問(wèn)的多了，我還是在這介紹下我是咋做的吧。

度娘的結(jié)果中也提供了很多畫(huà)虛線的辦法，有激情的同學(xué)可以去搜搜看。但是對(duì)于精細(xì)的網(wǎng)頁(yè)設(shè)計(jì)來(lái)講，如果用到了虛線，那么它的精細(xì)度對(duì)效果影響很大，做的好了，就能帶來(lái)意想不到的效果，廢話不多說(shuō)了，下面介紹幾種網(wǎng)頁(yè)設(shè)計(jì)中用得到的虛線畫(huà)法。

1、直線

在網(wǎng)頁(yè)building中，直線型的虛線用的很多，例如橫向分割和豎向分割，大致分為點(diǎn)劃線（dotted）和虛線（dashed），如下圖：



做這樣的線非常簡(jiǎn)單，我們只用到PS中的文字工具即可模擬出來(lái)，設(shè)置如下：



如果你的線是豎著的，只需要把圖層旋轉(zhuǎn)90度即可，我一直是這么做的。

2、直角矩形邊框

如果你不僅僅畫(huà)直線，還需要對(duì)矩形的邊框添加虛線，可以這么做。

首先，是點(diǎn)劃線（dotted），需要新建一個(gè)2×2像素的白底文件，按Ctrl+0把畫(huà)布放到最大，不用新建圖層，直接在畫(huà)布中錯(cuò)格填充，如下圖：



接著，按Ctrl+A全選此圖案，點(diǎn)擊PS的頂部菜單 編輯->定義圖案 命令，將此圖定義為一個(gè)圖案。



接著，在你需要添加點(diǎn)劃線的直角方框（注意：一定是直角，不是圓角矩形也不是圓形）的圖層雙擊，調(diào)出來(lái)圖層樣式窗口，選擇最后一項(xiàng)描邊，按下圖設(shè)置：



這個(gè)時(shí)候，邊線是黑白交替的，你肯定有的時(shí)候需要白色，有的時(shí)候需要黑色，你可以這么干：

需要黑色時(shí)，將描邊的混合模式設(shè)置為正片疊底，白色就被濾掉了。
需要白色時(shí)，描邊的混合模式設(shè)置為濾色，過(guò)濾掉黑色。
這樣一個(gè)1px的點(diǎn)劃線邊框就做好了，可以很方便的進(jìn)行多次復(fù)用，ps留個(gè)這樣的圖案非常方便。

如果你需要虛線，那么很簡(jiǎn)單，你只需要把描邊的圖案做的尺寸大點(diǎn)即可，我一般是做個(gè)4×4的圖案

如果還需要更大的虛線，各位同學(xué)自行調(diào)整圖案尺寸即可。

3、圓角矩形的虛線邊框

新的css3標(biāo)準(zhǔn)是支持矩形圓角的，如果模擬這樣的圓角矩形虛線邊框，那么上面的方法就不太適用了，怎么辦呢，其實(shí)很簡(jiǎn)單，你只需要把填充的圖案改為圓形格子即可，最小的尺寸為4×4像素，如下圖：



基本模擬的八九不離十，嘿嘿~

4、異形的虛線邊框

各位同學(xué)，如果你需要給異形的圖形添加虛線邊框，那么我建議你還是在Illustrator里畫(huà)好再導(dǎo)入Photoshop吧，因?yàn)樯线叺姆椒ㄖ贿m用于網(wǎng)頁(yè)設(shè)計(jì)中的結(jié)構(gòu)圖形設(shè)計(jì)，而不是做專題或者banner之類的造型設(shè)計(jì)了