當前位置：首頁 > 编程资源 > 编程问答 >内容正文

编程问答

手把手教你如何下载大厂页面的字体——开发

發布時間：2025/3/15 编程问答 25 豆豆

生活随笔收集整理的這篇文章主要介紹了手把手教你如何下载大厂页面的字体——开发小編覺得挺不錯的,現在分享給大家,幫大家做個參考.

在個人學習的商城開發中，有些網上比較好看的字體想要下載該怎么辦呢？接下來詳細介紹一下
拿小米商城舉例：https://www.mi.com/
這個搜素框中的搜索符號其實是一種字體，那么如何來下載這種字體呢？
步驟：
右鍵——》點擊檢查——》Network——》Font——》點擊一下你要下載的字體——》點擊一下date:application

復制這段文字。注意：方框中的不要，連逗號都不能要

到這里結束

接下來將base64格式的字體信息解碼成可用的字體文件
進入這個網址解碼：https://www.motobit.com/util/base64-decoder-encoder.asp

https://blog.csdn.net/hanhanwanghaha寶藏女孩歡迎您的關注！
歡迎關注微信公眾號：寶藏女孩的成長日記
如有轉載，請注明出處（如不注明，盜者必究）

選擇以上三個選項，就會自動下載一個叫base64.bin的文件，再命名為.otf格式，例如：

這樣我們的字體也就算下載好了。

然后，在你的project（工程）里面可以新建一個font，將上面的文件復制粘貼到里面去，如

我們去到小米商城頁面去拿這個搜索框。

復制引號里面的東西（這個特殊字體就是剛剛的搜索框）

測試代碼：

<!DOCTYPE html> <html><head><meta charset="UTF-8"><title></title><style type="text/css">@font-face {font-family:"xiaomiziti";src:url("font/xiaomiziti.otf");}#Jay{font-family: "xiaomiziti";}</style></head><body><div id="Jay"><label for="search">你想搜什么?</label></div></body> </html>

注意：我在這行代碼

<label for="search">你想搜什么?</label>

下面有這個符號

運行效果：

這樣就算是測試成功啦，希望此小文可以對你有幫助！歡迎一鍵三聯哈哈哈

注意：不可商用，否則侵權。

https://blog.csdn.net/hanhanwanghaha寶藏女孩歡迎您的關注！
歡迎關注微信公眾號：寶藏女孩的成長日記
如有轉載，請注明出處（如不注明，盜者必究）

總結

以上是生活随笔為你收集整理的手把手教你如何下载大厂页面的字体——开发的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。