html5自定義字型

2021-07-26 21:54:48 字數 720 閱讀 4453

我在做移動端web開發的時候,遇到過設計師設計的特殊字型,而且很容易用肉眼識別的一種字型-方正

輕刻簡體,平時他們使用方正蘭亭黑我就用預設的字型helvetica顯示,還湊合,但是這種字型,很難用預設字

體取代,於是想著使用自定義字型來滿足設計師的要求。

先看一眼效果:

接下來介紹如何自定義字型。

自定義字型思路很簡單,先定義乙個字型(myfirstfont),同時這裡還需要指定乙個字型檔案,就是設計師

在設計時的字型檔案,可以向設計師索要(既然人家能使用這樣的字型,人家機器上肯定有這種字型檔案),也

定義字型的語法:   

@font-face
使用字型:  

展示的效果即和文章開頭的效果一樣。

題外話:因為涉及到字型檔案需要載入,而且一般字型檔案會相對較大,我這個自定義字型檔案有3m多。為了流量和載入速度

考慮,可以讓設計師盡量不要使用特殊字型。

HTML5自定義屬性

你可以去讀一下html5的詳細規範,但這個自定義data屬性的用法非常的簡單,就是你可以往html標籤上新增任意以 data 開頭的屬性,這些屬性頁面上是不顯示的,它不會影響到你的頁面布局和風格,但它卻是可讀可寫的。下面的乙個 片段是乙個有效的html5標記 some awesome data 可是...

HTML5自定義屬性

自定義屬性的出現並非始於html5,但html5將 data 真正合法化。data自定義屬性如何操作?有何用途?首先給定一段html this is a div elem this is a div elem,too 注意 1.自定義屬性用來儲存或運算元據,可讀可寫,但不會在頁面顯示 2.屬性值可以...

HTML5自定義data屬性

可能大家在使用jquery mobile時,經常會看到data role data theme等的使用,比如 通過如下 即可實現頁首的效果 通過手機瀏覽,效果如下 為什麼寫乙個data role header 就能實現底部為黑色 文字居中顯示的效果呢?我們寫乙個html頁面,自定義乙個data ch...