国产爽视频在线观看视频_国产手机在线αv片无码_偷拍视频无码专区_久久韩国三级日本三级-国产一区二区午夜啪啪啪-欧美成人黄色免费在线网站-久久久亚洲精品久久仙-

首頁(yè) 客戶案例 品牌營(yíng)銷網(wǎng)站建設(shè) 微信小程序開發(fā) 網(wǎng)絡(luò)營(yíng)銷 APP開發(fā) 終端形象 動(dòng)態(tài) 聯(lián)系

1對(duì)1定制服務(wù),PC端+手機(jī)端+小程序多端應(yīng)用

10個(gè)可以提升網(wǎng)頁(yè)設(shè)計(jì)視覺(jué)的谷歌字體

2017年09月05日瀏覽:

當(dāng)涉及到網(wǎng)站設(shè)計(jì)所使用的字體時(shí),設(shè)計(jì)師們往往會(huì)變得非常挑剔,這也是為什么我們?cè)诠ぷ髦薪?jīng)常碰到我們所不喜歡的或者經(jīng)常更換字體的原因。所以,在今天的這篇文章中,我們將推薦幾款谷歌字體中比較好的幾款手寫類型字體,作為你的參考以便你可以跳過(guò)繁雜的篩選工作,直接切入那些可讀的、吸引人的、完美的網(wǎng)站設(shè)計(jì)。


下面推薦的所有字體都使用了獨(dú)特的CSS處理,并為你提供了可以即時(shí)實(shí)現(xiàn)的代碼。同時(shí)也都提供了谷歌的網(wǎng)頁(yè)字體,這樣你就可以使用快速?gòu)?fù)制和粘貼,而不需要下載了!




1.Oleo Script


一個(gè)在視覺(jué)上看起來(lái)很厚重的字體腳本,它具有良好的可讀性和有趣的字母形狀。可以適用于標(biāo)題或主視覺(jué)圖的文句部分。


oleo-script.png


HTML


link href="http://fonts.googleapis.com/css?family=Oleo+Script" rel="stylesheet" type="text/css"/


CSS


h2 {


  font: 400 100px/1.3 'Oleo Script', Helvetica, sans-serif;


  color: #2b2b2b;


  text-shadow: 4px 4px 0px rgba(0,0,0,0.1);


}


2.Lobster Two


Lobster相信不需要過(guò)多的介紹了,它幾乎已經(jīng)成為過(guò)去幾年網(wǎng)站設(shè)計(jì)領(lǐng)域中最普遍的字體腳本之一。新的版本增加了粗體和細(xì)體,給你更多的選擇。


lobster-two.png


HTML


link href="http://fonts.googleapis.com/css?family=Lobster+Two" rel="stylesheet" type="text/css"/


CSS


h2 {


  font: 400 100px/1.3 'Lobster Two', Helvetica, sans-serif;


  color: #2b2b2b;


  text-shadow: 1px 1px 0px #ededed, 4px 4px 0px rgba(0,0,0,0.15);


}


3.Berkshire Swash


我覺(jué)得大多數(shù)的設(shè)計(jì)師會(huì)很喜歡這種字體的觀賞性。這款字體在字形上比較大,大膽,并且擁有漂亮的曲線。如果你想表達(dá)舊世界的感覺(jué),這款字體剛好可以提供。


berkshire.png


HTML


link href="http://fonts.googleapis.com/css?family=Berkshire+Swash" rel="stylesheet" type="text/css"/


CSS


h2 {


  font: 400 100px/1.3 'Berkshire Swash', Helvetica, sans-serif;


  color: #2b2b2b;


  text-shadow: 1px 1px 0px #ededed, 4px 4px 0px rgba(0,0,0,0.15);


}


4.Merienda One


盡管Merienda不算是我最愛的字體之一,但它確實(shí)有它獨(dú)特的用途。這些字母有一種強(qiáng)烈的方向感和拉絲感,能很好地表達(dá)運(yùn)動(dòng)的元素。


merienda.png


HTML


link href="http://fonts.googleapis.com/css?family=Merienda+One" rel="stylesheet" type="text/css"/


CSS


h2 {


  font: 400 100px/1.2 'Merienda One', Helvetica, sans-serif;


  color: rgba(0,0,0,0.7);


  text-shadow: 3px 3px 3px #fff;


}


5.Pacifico


Pacifico是一個(gè)在視覺(jué)上我認(rèn)為可以滿足很多需求的、圓潤(rùn)的字體,它真的可以給人一種獨(dú)特的感覺(jué)。很難找到一個(gè)有這么好的曲線和提供這么多字形版本的腳本字體,所以我建議一定要把它加入到你的備選字體庫(kù)中。


pacifico.png


HTML


link href="http://fonts.googleapis.com/css?family=Pacifico" rel="stylesheet" type="text/css"/


CSS


h2 {


  font: 400 100px/1.5 'Pacifico', Helvetica, sans-serif;


  color: #2b2b2b;


  text-shadow: 3px 3px 0px rgba(0,0,0,0.1), 7px 7px 0px rgba(0,0,0,0.05);


}


6.Just Another Hand


如果你正在尋找一種看起來(lái)像是真的手寫的字體,那么Just Another Hand是一個(gè)不錯(cuò)的選擇。為了表現(xiàn)出一種視覺(jué)曲線,你可以像我給的案例圖一樣,使用陰影來(lái)給它一個(gè)更3D化的效果。當(dāng)然,這款字體本身看起來(lái)就很棒(甚至更好)。


just-another-hand.png


HTML


link href="http://fonts.googleapis.com/css?family=Just+Another+Hand" rel="stylesheet" type="text/css"/


CSS


h2 {


  font: 400 100px/1.0 'Just Another Hand', Helvetica, sans-serif;


  color: #969595;


  text-shadow: 0px 3px 0px #5e5e5e, 0px 5px 0px #4d4d4d, 0px 7px 0px #3c3c3c, 0px 9px 0px #2b2b2b, 3px 8px 15px rgba(0,0,0,0.1), 3px 8px 5px rgba(0,0,0,0.3);


}


7.Arizonia


Arizonia有一種讓人覺(jué)得很舒服的流動(dòng)感,有寬闊的弧線和流暢的筆觸。這是一個(gè)很棒的經(jīng)常使用于Logo的字體,真的不像你想要的那種“活”的網(wǎng)絡(luò)字體。


arizona.png


HTML


link href="http://fonts.googleapis.com/css?family=Arizonia" rel="stylesheet" type="text/css"/


CSS


h2 {


  font: 400 100px/1.3 'Arizonia', Helvetica, sans-serif;


  color: #2b2b2b;


  text-shadow: 4px 4px 0px rgba(0,0,0,0.1); 


}


8.Cookie


Cookie有一種貼合女性的魅力,這使它成為頭條新聞和類似信息的標(biāo)題的常用字體。如果你的網(wǎng)站設(shè)計(jì)項(xiàng)目剛好需要一種給人一種異想天開的感覺(jué)的話,你應(yīng)該嘗試一下。


cookie.png


HTML


link href="http://fonts.googleapis.com/css?family=Cookie" rel="stylesheet" type="text/css"/


CSS


h2 {


  font: 400 130px/0.8 'Cookie', Helvetica, sans-serif;


  color: #fff;


  text-shadow: 4px 4px 3px rgba(0,0,0,0.1); 


}


9.Great Vibes


Vibes是一個(gè)非常華麗的字體,就像Arizonia,但它更薄更復(fù)雜。字體再形態(tài)上面非常漂亮,肯定會(huì)引起用戶的注意。


great-vibes.png


HTML


link href="http://fonts.googleapis.com/css?family=Great+Vibes" rel="stylesheet" type="text/css"/


CSS


h2 {


  font: 400 130px/0.8 'Great Vibes', Helvetica, sans-serif;


  color: #fff;


  text-shadow: 4px 4px 3px rgba(0,0,0,0.1); 


}


10.Leckerli One


Leckerli One是一個(gè)字形偏“胖”的字體。就字體而言,這是相當(dāng)男性化的,所以對(duì)于那些需要體現(xiàn)大膽或者冒險(xiǎn)主題的網(wǎng)站設(shè)計(jì)來(lái)說(shuō),這個(gè)字體是完美的。


leckerli.png


HTML


link href="http://fonts.googleapis.com/css?family=Leckerli+One" rel="stylesheet" type="text/css"/


CSS


h2 {


  font: 400 100px/1.2 'Leckerli One', Helvetica, sans-serif;


  color: #000;


  text-shadow: 2px 2px 0px rgba(0,0,0,0.2), 4px 4px 8px rgba(0,0,0,0.2); 


}


總結(jié)


哪個(gè)種字體是你最喜歡的呢?


如果你還沒(méi)有的話,那么上面推薦的十個(gè)很棒的腳本和手寫字體可以先暫時(shí)滿足你的需要,準(zhǔn)備好實(shí)施。谷歌的Web字體庫(kù)有上百個(gè)這樣的字體庫(kù),但其中很多都并不適用于網(wǎng)站建設(shè)領(lǐng)域,希望這篇文章能幫助你縮減一下挑選字體的范圍。

在線提交您的需求

*我們會(huì)在24小時(shí)內(nèi)回復(fù)您,節(jié)假日除外。
線上服務(wù)咨詢微信二維碼 13880656240獲取解決方案