2021-05-12 14:32:11
[ps教學]如何在Photoshop裡畫虛線？
2019-12-15 09:05:56
度娘的結果中也提供了很多畫虛線的辦法，有激情的同學可以去搜搜看。但是對於精細的網頁設計來講，如果用到了虛線，那麼它的精細度對效果影響很大，做的好了，就能帶來意想不到的效果，廢話不多說了，下面介紹幾種網頁設計中用得到的虛線畫法。
1
?2
1、直線3
在網頁building中，直線型的虛線用的很多，例如橫向分割和豎向分割，大致分為點劃線（dotted）和虛線（dashed），如下圖：4
5
做這樣的線非常簡單，我們只用到PS中的文字工具即可模擬出來，設定如下：6
7
如果你的線是豎著的，只需要把圖層旋轉90度即可，我一直是這麼做的。8
2、直角矩形邊框9
如果你不僅僅畫直線，還需要對矩形的邊框新增虛線，可以這麼做。10
首先，是點劃線（dotted），需要新建一個2×2畫素的白底檔案，按Ctrl+0把畫布放到最大，不用新建圖層，直接在畫布中錯格填充，如下圖：11
12
接著，按Ctrl+A全選此圖案，點選PS的頂部選單 編輯->定義圖案 命令，將此圖定義為一個圖案。13
14
接著，在你需要新增點劃線的直角方框（注意：一定是直角，不是圓角矩形也不是圓形）的圖層雙擊，調出來圖層樣式視窗，選擇最後一項描邊，按下圖設定：15
16
這個時候，邊線是黑白交替的，你肯定有的時候需要白色，有的時候需要黑色，你可以這麼乾：17
需要黑色時，將描邊的混合模式設定為正片疊底，白色就被濾掉了。18
需要白色時，描邊的混合模式設定為濾色，過濾掉黑色。19
這樣一個1px的點劃線邊框就做好了，可以很方便的進行多次複用，ps留個這樣的圖案非常方便。20
如果你需要虛線，那麼很簡單，你只需要把描邊的圖案做的尺寸大點即可，我一般是做個4×4的圖案，效果如下：21
22
如果還需要更大的虛線，各位同學自行調整圖案尺寸即可。23
3、圓角矩形的虛線邊框24
新的css3標準是支援矩形圓角的，如果模擬這樣的圓角矩形虛線邊框，那麼上面的方法就不太適用了，怎麼辦呢，其實很簡單，你只需要把填充的圖案改為圓形格子即可，最小的尺寸為4×4畫素，如下圖：25
26
基本模擬的八九不離十，嘿嘿~27
4、異形的虛線邊框28
各位同學，如果你需要給異形的圖形新增虛線邊框，那麼我建議你還是在Illustrator裡畫好再匯入Photoshop吧，因為上邊的方法只適用於網頁設計中的結構圖形設計，而不是做專題或者banner之類的造型設計了，正所謂術業有專攻哇！相關文章