網(wǎng)頁常用小按鈕一

　　雖然越來越多的人開始使用寬帶，速度已經(jīng)不象早些年那樣限制著網(wǎng)絡(luò)，但近年來的網(wǎng)頁卻沒有越來越繁雜，正相反，以簡約為風(fēng)尚的網(wǎng)頁設(shè)計正悄悄流行在網(wǎng)絡(luò)世界中。這種風(fēng)格不但節(jié)約了帶寬，更重要的是，大多數(shù)人更喜歡在清新的環(huán)境中尋找他們所需的信息，簡單精巧的設(shè)計，使獲取信息變得更加方便快捷。今天，我們就來設(shè)計幾款最常用的網(wǎng)頁小巧按鈕。

　　第一款：像素按鈕

　　這是目前最為流行的一種按鈕，在每個以像素為主題的網(wǎng)站上幾乎都能看到它的身影。想要最大程度的減小網(wǎng)頁大小，這種按鈕可是不二法門。這種按鈕簡單大方，除了個性化的網(wǎng)站之外，用于公司網(wǎng)頁也非常合適。

　　新建一個ps文檔，RGB模式，白色背景。

　　新建一層，復(fù)位色板，將前景色設(shè)為一種淺灰色，如例子中的RGB（239，239，239），用矩形選框工具選擇一個小矩形，填充前景色后取消選擇。

　　下面我們來制作按鈕的立體效果。這里，我們完全用添加圖層樣式的方法，雙擊圖層，打開圖層樣式對話框，我們來依次添加：

　　首先選擇斜面和浮雕樣式，設(shè)置結(jié)構(gòu)為內(nèi)斜面，方法為平滑，深度為1％，方向在上，大小和軟化均為2像素，陰影角度為146度，使用全局光，高度為30度，光澤保持默認(rèn)，高光和暗調(diào)的混合模式與顏色都不變，不過不透明度分別設(shè)為100％和43％；

　　其次是內(nèi)陰影模式，模式為正常，顏色為白色，不透明度為100％，角度為146度，使用全局光，距離為1像素，阻塞為100％，大小為0，品質(zhì)不變；

　　接下來是描邊，將描邊大小設(shè)為1像素，位置在外部，混合模式為正常，不透明度為100％，填充類型為顏色，描邊顏色設(shè)為黑色；

　　最后是投影樣式，將陰影顏色設(shè)為黑色，不透明度為22％，角度為120度，取消全局光，距離為3像素，擴(kuò)展為0，大小為0，品質(zhì)保持默認(rèn)不變。

　　好了，現(xiàn)在你可以選擇細(xì)一些的字體，最好是專門的像素字體，在按鈕上寫上文字。在設(shè)置文字選項(xiàng)的時候，有一項(xiàng)需要特別注意，那就是要將文字消除鋸齒的方式設(shè)為無，否則字體會出現(xiàn)模糊。整個制作過程如圖1所示。

圖1

　　如果覺得灰色太單調(diào)，你也可以為按鈕添加各種顏色，過程和前面的大致相同，但有些地方有些細(xì)微差別。

　　在新建圖層、設(shè)置選區(qū)后，設(shè)置你的前景色，如這里我們將前景色設(shè)為RGB（106，175，5），填充選區(qū)后取消選擇。然后開始設(shè)定圖層樣式。在斜面和浮雕樣式中，將深度設(shè)為100％，大小和軟化為1像素，注意要將陰影的高光模式設(shè)為顏色減淡，不透明度為65％，暗調(diào)的不透明度也要減低一些；和剛才不同，我們?nèi)∠藘?nèi)陰影樣式，在描邊樣式中，將描邊顏色設(shè)為一種較深的灰色，如RGB（132，132，132），當(dāng)然，你也可以用黑色描邊；對于投影樣式，由于按鈕本身的顏色較深，相對的，我們可以將陰影的不透明度設(shè)的稍微高一些，40％即可。最后，寫上文字。

　　第二款：漸變按鈕

　　相對于第一款按鈕來說，接下來我們要介紹的這種類型的按鈕實(shí)用性更強(qiáng)，而且顏色也更豐富。你在許多網(wǎng)站上都會看到它。

　　首先，仍是新建RGB模式的ps文檔，白色背景。

　　這次我們新建一層，用矩形選框工具選擇一個小矩形，然后點(diǎn)擊“選擇->修改->平滑”，設(shè)為5像素。選擇漸變工具的由黑到白漸變，在選框內(nèi)由下往上拉。效果如圖2。

圖2

　　雙擊圖層，進(jìn)入圖層樣式，我們?yōu)榘醇~添加立體感，選擇斜面和浮雕樣式，在樣式中選擇內(nèi)斜面，方法為平滑，深度為1％，方向?yàn)樯希笮?像素，軟化為0像素，陰影的角度為120度，使用全局光，高度為30度，保持高光和暗調(diào)的默認(rèn)混合模式及顏色不變，高光的不透明度為75％，暗調(diào)為36％；

圖3

　　最后，我們再用描邊的方式修飾按紐，設(shè)置描邊大小為1像素，位置在外部，混合模式為正常，不透明度為100％，填充類型為顏色，將顏色設(shè)為灰色。

圖4

由Ci222編寫,轉(zhuǎn)裁請保留作者