今天要講的東西,其實還滿重要的,可能你設計網頁會寫一堆語法,很會寫程式,組織架構力很強等等的,可是在這邊卻發現到一個問題,那就是整體網頁的美感好不好看,配色正不正確,這一點其實對單純寫程式的人來說,真得是一個比較需要克服的問題,畢竟美感需要培養的,今天介紹三個好用的配色網站,來幫助大家看別人的案例快速上手配色,一起來看看!

這邊介紹三個好用的網站配色給大家,

kuler

這邊有幾萬的配色讓你選擇,當然你也可以自己來配色,只要輸入英文像"brown"咖啡色,這個網站就會幫你搜尋關於人家之前做的咖啡色配色,讓你在這個網站配色上面更加得心應手!

colorspire

  • 網站名稱:colorspire
  • 網址:按這裡

這個網站我覺得還不錯的,這邊它提供整體網頁區塊的配色,比如你橫幅想要配紅色,底色是酒紅色等等,這邊它有區塊選項讓你自由調配,還滿方便的一個網站。

colorotate

  • 網站名稱:colorotate
  • 網址:按這裡

這個網站也滿方便的,對於一些要做3D的人來說,這個網站也是不錯的選擇,它會讓你從各個角度去看配色,網站的部分,也是一樣,在搜尋框框打入你想要的顏色就可以了,今天分享這三個好用的網站,幫助大家配色能更加迅速!

 

熱門相關文章

網頁設計教學系列-兩個好用的CSS字型和漸層背景製造器
今天要分享的東西也滿好用的,因為自己在在做網頁的時候,因為有時候做一些東西比較趕,所以想要用一些資源可以複製貼上比較快的方式,所以就找到兩款還不錯用的CSS語法製造器,在這邊分享給大家。 csstypeset 網站名稱:csstypeset 網址:按這裡 這是一個還不錯用產生CSS字型的網站,官網它整體介面像這樣, 下面有一些介面可以去操控,比如你可以調一些字體,以及字體大小顏色、段落距離等等,算是還滿方便的,像這邊我就打上測試用的文字,調了藍色,然後右邊就會出現CSS代碼,之後就可以運用在比如像WORDPRESS style.css,或者是像其它無名、疲克邦等等可以使用CSS的地方,這邊只有字型和簡單背景色,所以這邊還要介紹另外一個產生背景的CSS語法產生器, colorzilla 網站名稱:colorzilla 網址:按這裡 這邊有相當方便產生CSS漸層語法的介面,之前有介紹一款用gradient creator產生CSS3漸層色碼,不過現在要介紹的這款,也是相當的方便,首先我們看到它的介面, 像左中下方那邊就是可以去調它的漸層色碼,右上方就是整個背景色塊的SIZE,右下方當然就是產生的CSS3語法,你可透過調不同區塊顏色,就很簡單達到漸層的效果,比如我調像下面這樣, 變成橘色的漸層,之後我在把右下方的CSS代碼複製起來之後使用就可以,以上這兩個網站就分享給大家啦!
繼續閱讀
網頁設計教學系列-兩款好用的CSS3產生器幫你快速上手CSS3
今天要講的東西,是最近比較流行的CSS3,平常我們會說做一個網頁是透過HTML+CSS來完成,但CSS的部分,它有分成CSS1、CSS2、以及最近流行的CSS3,不過大家也一直很好奇CSS3到底是什麼,所以今天要講兩個網站,可以幫大家快速上手一些CSS3語法,讓你在使用CSS3上面可以更加得心應手! 最近有看DOUBLE冠網站的人應該有發現,我的框框是長這樣子的, 這邊我是用一些CSS3語法去產生出來的,但CSS3的語法能在那些瀏覽器使用又是個問題,所以這邊先介紹第一個超好用的網站, CSS3.0 MAKER 網站名稱:CSS3.0 MAKER 網址:按這裡 這款是我覺得很好用的一個網站,它主要可以透過一些簡單介面來產生CSS3語法以外,還會告訴你這個CSS3語法可以在那些版本以上的瀏覽器使用,左邊區塊介面為調整,右邊就是CSS3語法,中間那一區塊就是產生出來的樣子,讓我們一一用它不同功能做測試! 我們按到上方的”BORDER RADIUS”,這就像DOUBLE冠上面的框框語法一樣,比如我用一個段落來做測試,做得效果像以下這張圖一樣,瀏覽器版本的話,中間產生樣子的下面都是支援的瀏覽器版本喔,IE基本一定要IE9,也就是WIN7才能用IE9,這個要注意一下! 測試用 HELLO 您好 接下來我們用到TEXT-SHADOW那邊,我想要用像下圖這樣的效果,"TEXT SHADOW"代表著是文字陰影,也就是文字會產生陰影的效果,以往都是用PHOTOSHOP產生陰影,不過用圖多少會拖網站速度,所以CSS3有增加這樣的功能! 測試用二 HELLO 您好 我們再移到"BOX-SHADOW"那邊,這是整個區塊產生陰影,就像圖所似一樣, 測試用三 之後再為大家講解所謂的翻轉,這邊為大家介紹第二個網站, border-radius 網站名稱:border-radius 網址:按這裡 這邊介紹詳細的框框語法,像這個是可以快速產生各個框框的部分,原理也很簡單,只要調數字就可以了,比如像下圖這樣, 為大家講一下語法意思, -webkit-border-radius: CHROME能看得圓角框。 -moz-border-radius: 12px;:火狐能看得圓角框格式。 border-radius: 12px;;IE能看到的圓角框模式,通用於CHEOME! 像上圖一樣的效果, 測試用四 以上分享到這邊,有問題再問吧!
繼續閱讀
網頁設計教學系列-兩個好用的CSS字型和漸層背景製造器
網頁設計教學系列-兩款好用的CSS3產生器幫你快速上手CSS3

DOUBLE冠就是愛升級

  • ※一起訂閱本站:按這裡
  • ※訂閱DOUBLE冠手機版本站:按這裡下載
  • ※引用網址:
  • ※如有發現圖檔無法預覽,請麻煩告知告知,將會盡速處理!謝謝~
  • ※請勿全文轉貼本站文章,歡迎「部份引用」與介紹,並註明出處~謝謝~~
  • 日期:2012/03/31

    隨機文章

    FACEBOOK留言

    0 留言

    發表留言 »

    (姓名)
    (信箱)
    (網站)

    網站搜尋

    2015-DOUBLE冠就是愛升級 引用-Theme Sco v5.0 By:Scorpio

    本站不支援IE6以下的版本