整合營(yíng)銷服務(wù)商
電腦端+手機(jī)端+微信端=數(shù)據(jù)同步管理
免費(fèi)咨詢熱線：
電腦端+手機(jī)端+微信端=數(shù)據(jù)同步管理
免費(fèi)咨詢熱線：
們來(lái)先來(lái)分析一下這個(gè)案例。
標(biāo)題容器左對(duì)齊，有固定的寬高。標(biāo)題文字白色，水平垂直居中。
正文共四個(gè)段落，每個(gè)段落都有固定的寬度，右側(cè)邊界對(duì)齊。
前三個(gè)段落首行空兩個(gè)字。每個(gè)段落里都有一段高亮的文本，有顏色和下劃線修飾，也有文本斜體和加粗效果。
段落中的一些文字還有顏色、加粗、下劃線以及傾斜等修飾效果。
第四個(gè)段落起始有個(gè)吉他圖標(biāo)，英文字體有外發(fā)光效果。
下面我們來(lái)制作這個(gè)網(wǎng)頁(yè)。
創(chuàng)建 007-css-case-1 文件夾，在文件里創(chuàng)建一個(gè) case-text-fonts.html 頁(yè)面文件和 case-1.css 樣式文件。
在 html 文件內(nèi)創(chuàng)建基礎(chǔ)代碼，在 head 標(biāo)簽內(nèi)部引入外部樣式 case-1.css。
首先來(lái)制作標(biāo)題。
添加一個(gè) h1 元素，填入標(biāo)題文本。
在編寫標(biāo)題樣式之前，假設(shè) UI 設(shè)計(jì)師給你的是一篇文章的圖片，你可能就犯難了，如何獲得標(biāo)題的寬高、背景顏色和文字大小呢？
大家打開電腦里的QQ，登錄進(jìn)去，Mac電腦按下鍵盤 Control + Command + A，Windows電腦按下ctrl+alt+a，圈選頁(yè)面標(biāo)題，點(diǎn)擊對(duì)號(hào)按鈕，完成截屏。
在瀏覽器中輸入 ps.gaoding.com，打開在線版 PS。點(diǎn)擊文件，新建，再點(diǎn)擊創(chuàng)建按鈕。最后，Control + V，將截屏的圖片粘貼過(guò)來(lái)。
應(yīng)用選框工具，發(fā)現(xiàn)標(biāo)題選區(qū)的寬度和高度分別為 200 和 50 像素，文字的大小為 24 像素。
應(yīng)用吸管工具，點(diǎn)擊標(biāo)題框吸取背景色，點(diǎn)擊前景色按鈕，得到十六進(jìn)制顏色值 #a52a2a。
有了這三個(gè)值，就可以定義標(biāo)題的樣式了。
h1 {
width: 200px;
height: 50px;
background-color: #a52a2a;
color: white;
line-height: 50px;
font-size: 24px;
text-align: center;
}定義 h1 選擇器，聲明樣式 width: 200px，height: 50px，background-color: #a52a2a，color: white，font-size: 24px,text-align:center
在瀏覽器中查看頁(yè)面，標(biāo)題的效果基本上都實(shí)現(xiàn)了。接下來(lái)完成文本的垂直居中對(duì)齊。
可以通過(guò)給文本聲明 line-height 行高屬性，來(lái)間接實(shí)現(xiàn)文本的垂直居中，那行高的值設(shè)置為多少呢？根據(jù)前面學(xué)習(xí)的行高知識(shí)，將行高的值設(shè)置為 50px，也就是文本所在容器的高度。這樣，文本在容器中恰好就垂直居中了。
接下來(lái)制作四個(gè)段落。
在 HTML里添加四個(gè) p 元素，填入一些文本。下面給這些段落添加樣式。
p {
width: 500px;
text-indent: 2em;
text-align: justify;
word-spacing: 10px;
text-transform: capitalize;
line-height: 28px;
}定義 p 選擇器，聲明樣式：width: 500px，讓每一個(gè)段落都有固定的寬度。text-indent: 2em，每個(gè)段首空兩格。text-align: justify，實(shí)現(xiàn)段落右側(cè)邊界對(duì)齊。給最后一段英文添加樣式：word-spacing: 10px，添加單詞間距。text-transform: capitalize，每個(gè)單詞首字母大寫。最后再添加 line-height: 28px，給段落設(shè)置一個(gè)行間距。
四個(gè)段落基本上制作完畢了。接下來(lái)裝飾個(gè)別段落和文字。
分別使用三個(gè) span 元素將這三部分文字包裹起來(lái)。給第一個(gè)和第三個(gè) span 元素定義 class 屬性，值為 mark1。(第一個(gè)段落里面的帶有下滑劃線區(qū)域,和第三個(gè)段落中的下劃線區(qū)域)
在CSS中定義 mark1 選擇器，聲明樣式 color: red，text-decoration-line: underline，text-decoration-style: double。
我們看，這兩部分文本被紅色、雙下劃線修飾了。
實(shí)際效果第三部分文本還帶有一個(gè)波浪線。需要再定義一個(gè)樣式覆蓋一下。
給這個(gè) span 的樣式類再添加一個(gè) mark2。
定義選擇器 mark2，聲明樣式 text-decoration-style: wavy。
效果實(shí)現(xiàn)了。
給第二個(gè) span 添加 class 屬性，值為 mark3。
定義選擇器 mark3，聲明樣式 color: orange。
第二部分文本變成了橙色。
案例還要求這兩部分文字為傾斜效果。使用 span 元素把他們包裹起來(lái)，定義 class 等于 mark4。
定義選擇器 mark4，聲明樣式 font-style: italic。
文本傾斜效果實(shí)現(xiàn)了。
實(shí)際上，千鋒全部學(xué)科的名稱和被特殊修飾的文本都有加粗效果，給全部學(xué)科再添加一個(gè) span元素包裹在外層。給所有需要加粗的 span 都添加 mark0 樣式類名。
定義選擇器 mark0，聲明樣式 font-weight: bold。
文本加粗效果實(shí)現(xiàn)了。
.mark0 {
font-weight:bold
}
.mark1 {
color: red;
text-decoration-line: underline;
text-decoration-style: double;
}
.mark2 {
text-decoration-style: wavy;
}
.mark3 {
color:orange;
}
.mark4 {
font-style: italic;
}最后，給英文段落定義特殊字體并添加外發(fā)光的效果。
.p1 {
font-family: "Sofia", sans-serif;
text-indent: 0;
}在 head 里添加引用谷歌字體的 css 鏈接，和自定義 icon 圖標(biāo)的 js 地址。
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Sofia&effect=outline">
<script src="https://kit.fontawesome.com/772ccfd500.js" crossorigin="anonymous"></script>
給英文的段落元素定義 class 屬性，值為 p1 font-effect-outline。
添加 p1 選擇器，聲明樣式：font-family: "Sofia", sans-serif。
字體效果實(shí)現(xiàn)了！在段首還有一個(gè) icon 圖標(biāo)。
如何查找自己心儀的圖標(biāo)呢？大家可以訪問 fontawesome 官網(wǎng)這個(gè)地址，海量圖標(biāo)就任你選擇了。guitar 就在這里。 （https://fontawesome.com/search?p=2&favorites=staff）
在段落頭部添加 i 元素，定義 class屬性，值為 fas fa-guitar。 （注意中間有空格）。
我們發(fā)現(xiàn)，真正使用這個(gè)圖標(biāo)時(shí)，樣式類的值，要求在官網(wǎng)查找到的圖標(biāo)名字前，加上 fa- (讀作：fa杠)，并且還需要添加 fas。
圖標(biāo)添加好了！實(shí)際的效果，最后一行沒有縮進(jìn)。
在 .p1 (注意這里有點(diǎn)) 選擇器里添加 text-indent: 0，來(lái)覆蓋 p 元素的樣式。
為什么能覆蓋呢？答對(duì)了，因?yàn)樽饔玫膬?yōu)先級(jí)—— class 選擇器要大于元素選擇器。
這樣，就取消了最后一行的段首縮進(jìn)！
文章配套視頻鏈接：https://www.bilibili.com/video/BV1oU4y1278g?p=68
家好，我是 Echa。
今天來(lái)分享 50 個(gè)超實(shí)用的 Chrome 瀏覽器擴(kuò)展！
JSON Viewer Pro 用于可視化JSON文件。其核心功能包括：
輸入界面如下：
格式化之后：
JSONVue 是一個(gè)JSON數(shù)據(jù)查看器，主要用來(lái)格式化JSON數(shù)據(jù)：
Library Sniffer 是一款給開發(fā)者使用的工具，能夠探測(cè)當(dāng)前網(wǎng)頁(yè)所使用的類庫(kù)、框架和服務(wù)器環(huán)境，為開發(fā)者提供了方便。
Wappalyzer 擴(kuò)展可以用來(lái)識(shí)別網(wǎng)站背后的底層技術(shù)。通過(guò)此擴(kuò)展，可以了解特定應(yīng)用程序是否是用 React、Vue、Angular、PHP等編寫的。還可以訪問有關(guān) Web 服務(wù)器、編程語(yǔ)言、框架、內(nèi)容管理系統(tǒng)、分析的信息工具、數(shù)據(jù)庫(kù)等。
WhatRuns 擴(kuò)展程序只需單擊一下即可找到任何網(wǎng)站上使用的技術(shù)。
使用PerfectPixel插件可以將設(shè)計(jì)圖加載至網(wǎng)頁(yè)中，與已成型的網(wǎng)頁(yè)進(jìn)行重疊對(duì)比，以幫助開發(fā)和設(shè)計(jì)人員規(guī)范網(wǎng)頁(yè)像素精度。這是一款可以優(yōu)化前端頁(yè)面顯示的Chrome插件。
可以使用此擴(kuò)展程序快速清除緩存，無(wú)需任何確認(rèn)對(duì)話框、彈出窗口等。可以在選項(xiàng)頁(yè)面上自定義要清除的數(shù)據(jù)和數(shù)量，包括：應(yīng)用程序緩存、緩存、Cookie、下載、文件系統(tǒng)、表單數(shù)據(jù)、歷史記錄、索引數(shù)據(jù)庫(kù)、本地存儲(chǔ)、插件數(shù)據(jù)、密碼和 WebSQL。
VisBug 是一個(gè)使用 JavaScript 構(gòu)建的開源網(wǎng)頁(yè)設(shè)計(jì)調(diào)試工具，它可以讓用戶使用點(diǎn)擊式和拖放式界面來(lái)查看網(wǎng)站的元素。
Debug CSS 是一個(gè)幫助調(diào)試CSS的插件。他可以顯示出頁(yè)面元素的輪播，按住Ctrl，并將鼠標(biāo)懸浮在元素上，即可查看其信息：
CSS Viewer 是一款適用于 Web 開發(fā)人員的高效 Chrome 擴(kuò)展。顧名思義，CSS 查看器可以顯示將鼠標(biāo)懸停在任何網(wǎng)頁(yè)上的元素的 CSS 屬性。
EditThisCookie 是一個(gè) cookie 管理器。可以添加，刪除，編輯，搜索，鎖定和屏蔽cookies。
React Developer Tools 是開源 JavaScript 庫(kù) React 的 Chrome DevTools 擴(kuò)展。它允許我們?cè)?Chrome 開發(fā)者工具中檢查 React 組件層次結(jié)構(gòu)。安裝此插件之后，將在 Chrome DevTools 中獲得兩個(gè)新選項(xiàng)卡："?? Components" 和 "?? Profiler"：
Vue.js devtools 是一款基于chrome瀏覽器的用于調(diào)試Vue.js應(yīng)用程序的插件，可以使得開發(fā)人員大大提高調(diào)試效率。支持用戶對(duì)DOM結(jié)構(gòu)數(shù)據(jù)結(jié)構(gòu)進(jìn)行解析和調(diào)試功能。
Augury 可以幫助開發(fā)人員在 Google Chrome 瀏覽器中調(diào)試和分析 Angular 應(yīng)用程序。
Firebug Lite是火狐瀏覽器中著名的開發(fā)者工具firebug插件移植到Chrome中的插件，在Chrome中安裝了Firebug Lite插件以后，開發(fā)人員可以像在火狐瀏覽器中使用firebug一樣熟悉的方式來(lái)調(diào)試網(wǎng)頁(yè)內(nèi)容，其包含了基本的HTML、CSS以及Javascript的調(diào)試功能，用于幫助網(wǎng)頁(yè)前端開發(fā)工程師快速地調(diào)試網(wǎng)頁(yè)，以便及時(shí)地找到網(wǎng)頁(yè)中的BUG并及時(shí)修復(fù)。
HTML Validator 在 Chrome 的開發(fā)者工具中添加了 HTML Validator。HTML 頁(yè)面的錯(cuò)誤數(shù)通過(guò)瀏覽器狀態(tài)欄中的圖標(biāo)顯示，詳細(xì)信息可以在瀏覽器的開發(fā)者工具中查看。
Web Developer 擴(kuò)展為帶有各種 Web 開發(fā)工具的瀏覽器添加了一個(gè)工具欄按鈕。該擴(kuò)展適用于 Chrome 和 Firefox，并且可以在這些瀏覽器支持的任何平臺(tái)上運(yùn)行，包括 Windows、macOS 和 Linux。
Requestly 是一款Chrome和Firefox瀏覽器插件，提供URL轉(zhuǎn)發(fā)、修改HTTP請(qǐng)求和結(jié)果、插入腳本等功能。
Window Resizer 主要用來(lái)調(diào)整瀏覽器窗口的大小以模擬各種屏幕分辨率。
Responsive Viewer 是在一個(gè)視圖中顯示多個(gè)屏幕的 Chrome 擴(kuò)展程序。該擴(kuò)展將幫助前端開發(fā)人員在開發(fā)響應(yīng)式網(wǎng)站/應(yīng)用程序時(shí)測(cè)試多個(gè)屏幕。
此插件允許直接從瀏覽器發(fā)送跨域請(qǐng)求，而不會(huì)收到跨域錯(cuò)誤。可以使用此插件覆蓋 Request Origin 標(biāo)頭，并將 Access-Control-Allow-Origin 設(shè)置為 *.
ColorPick Eyedropper 是一個(gè)放大的吸管和顏色選擇器工具，可讓從網(wǎng)頁(yè)等中選擇顏色值。
CSS Peeper 用于檢查和復(fù)制元素樣式的優(yōu)秀工具，使用 CSSPeeper 可以將鼠標(biāo)懸停在網(wǎng)頁(yè)中的任何元素上，然后單擊鼠標(biāo)即可復(fù)制元素的樣式。
24. Dimensions
Dimensions是一款能幫助使用者對(duì)網(wǎng)頁(yè)上各種元素屬性之間的距離進(jìn)行測(cè)量的Chrome頁(yè)面元素測(cè)量插件，該插件在點(diǎn)擊啟動(dòng)插件圖標(biāo)后，可以對(duì)頁(yè)面中圖像、輸入字段、按鈕以及視頻等頁(yè)面元素之間上下左右的方位尺寸進(jìn)行測(cè)量，同時(shí)還可以通過(guò)使用快捷鍵來(lái)快速啟用或關(guān)閉該插件的功能，簡(jiǎn)單實(shí)用。
Site Palette 用于生成調(diào)色板。設(shè)計(jì)師和前端開發(fā)人員必備的工具。可以通過(guò)這款插件輕松獲取網(wǎng)站的配色方案。
ColorZilla 是一款功能強(qiáng)大地提取網(wǎng)頁(yè)色彩的工具；也是個(gè)快速的對(duì)顏色進(jìn)行調(diào)節(jié)的Chrome插件，許多的用戶將這款軟件稱呼為顏色吸取插件，它提取的顏色是非常的多樣化，還可生產(chǎn)css顏色的代碼等。
當(dāng)我們想查看網(wǎng)頁(yè)中文字的字體時(shí)，最常用的方法就是在控制臺(tái)查看文字的字體樣式。那還有沒有更簡(jiǎn)單的方法呢？WhatFont 就是一個(gè)查看網(wǎng)頁(yè)字體的Chrome擴(kuò)展。只需要的點(diǎn)擊擴(kuò)展圖標(biāo)，再點(diǎn)需要查看為文字即可：
Fonts Ninja 可以從任何網(wǎng)站識(shí)別字體、添加書簽、試用并購(gòu)買它們。
使用 BrowserStack 快速啟動(dòng)擴(kuò)展在任何瀏覽器中啟動(dòng)一個(gè)新的測(cè)試會(huì)話。最多可設(shè)置 12 個(gè)瀏覽器以實(shí)現(xiàn)快速訪問并最大限度地減少切換瀏覽器所花費(fèi)的時(shí)間。
Toby 是一款 Chrome 新標(biāo)簽頁(yè)工具，能夠?qū)⑽醋x的標(biāo)簽頁(yè)分組顯示在新標(biāo)簽頁(yè)中，這樣就能把所有未看完的標(biāo)簽頁(yè)都關(guān)閉了。分組相當(dāng)于多個(gè) Chrome 窗口，將你的標(biāo)簽頁(yè)都拖進(jìn) Toby 中，就不需要實(shí)時(shí)開著占地方了。
該擴(kuò)展提供了每日熱門開發(fā)者新聞，不需要再浪費(fèi)時(shí)間搜索高質(zhì)量的文章了。
Momentum 擁有漂亮的新標(biāo)簽頁(yè)面，每日更新精彩背景壁紙圖片，可設(shè)置每日新鮮事焦點(diǎn)以及跟蹤待辦事項(xiàng)，無(wú)廣告，無(wú)彈窗。
The Great Suspender 是一個(gè)輕量級(jí)的擴(kuò)展用來(lái)減少 Chrome 的內(nèi)存占用。如果同時(shí)打開許多選項(xiàng)卡，在可配置的時(shí)間之后未查看的選項(xiàng)卡將在后臺(tái)自動(dòng)掛起，從而釋放該選項(xiàng)卡消耗的內(nèi)存和 CPU。
Session Buddy是一個(gè)可以幫助用戶查看、新增、編輯當(dāng)前網(wǎng)站Session狀態(tài)的Chrome插件。用戶可以利用該插件保存網(wǎng)站當(dāng)前的狀態(tài)以便在關(guān)閉Chrome或關(guān)閉計(jì)算機(jī)后恢復(fù)，從而達(dá)到節(jié)省內(nèi)存的作用。
Octotree 旨在讓 GitHub 體驗(yàn)更好。通常，為了檢查 Github 中的子文件夾，需要手動(dòng)單擊文件夾并導(dǎo)航。Octotree 擴(kuò)展解決了這個(gè)問題。此擴(kuò)展在項(xiàng)目的左側(cè)顯示存儲(chǔ)庫(kù)的目錄結(jié)構(gòu)，這有助于更好地理解文件夾結(jié)構(gòu)。
1_EKF88oqIyX6FzgueCKdtXg.gif
File Icons for GitHub and GitLab 可以將 GitHub 和 GitLab 上的原始文件圖標(biāo)替換為特定文件類型的圖標(biāo)。
ax DevTools 是一個(gè)快速、輕量級(jí)但功能強(qiáng)大的測(cè)試工具，由 Deque 開發(fā)的世界上最值得信賴的可訪問性測(cè)試引擎 axe-core 驅(qū)動(dòng)。使用 ax DevTools 在網(wǎng)站開發(fā)過(guò)程中查找并修復(fù)更多可訪問性問題。
OctoLinker 可以將特定語(yǔ)言的語(yǔ)句（如 include、require 或 import）轉(zhuǎn)換為鏈接。當(dāng)打開一個(gè)包含多個(gè)導(dǎo)入語(yǔ)句的文件并且想要快速打開它時(shí)，只需將鼠標(biāo)懸停在鏈接的文件上并單擊即可打開。
此擴(kuò)展可幫助 Web 開發(fā)人員分析網(wǎng)頁(yè)是否違反最佳實(shí)踐。
Check My Links 是一個(gè)鏈接檢查器，它可以抓取網(wǎng)頁(yè)并查找損壞的鏈接。
Checkbot 是用于驗(yàn)證一組HTML頁(yè)面上的鏈接的工具。Checkbot可以檢查一個(gè)或多個(gè)服務(wù)器上的單個(gè)文檔或一組文檔。它會(huì)創(chuàng)建一個(gè)報(bào)告，該報(bào)告匯總了引起某種警告或錯(cuò)誤的所有鏈接。
Google Page Speed Insighs 是一款旨在優(yōu)化所有設(shè)備上的網(wǎng)頁(yè)、提高網(wǎng)頁(yè)加載速度的工具。
META SEO inspector是一款可以幫助用戶分析網(wǎng)頁(yè)的meta信息并得到SEO評(píng)估的谷歌瀏覽器插件。
Ghostery 是強(qiáng)大的隱私保護(hù)擴(kuò)展程序。其主要有以下功能：
AdBlock 用來(lái)在YouTube、Facebook、Twitch和其他你喜愛的網(wǎng)站上攔截廣告和彈窗。
番茄工作法（Pomodoro?）時(shí)間管理助理。? 長(zhǎng)短兩種休息時(shí)間 ? 帶有倒計(jì)時(shí)顯示的工具欄圖標(biāo) ? 追蹤Pomodoro歷史和統(tǒng)計(jì)訊息 ? 可配置的長(zhǎng)休間隔 ? 可配置的定時(shí)器時(shí)長(zhǎng) ? 桌面與新標(biāo)簽頁(yè)通知 ? 超過(guò)20種音效可選的聲音通知 ? 計(jì)時(shí)器秒針走動(dòng)音效
Loom 可以用來(lái)快速錄制視頻，并且能夠?qū)浿频囊曨l上傳到指定的網(wǎng)頁(yè)中，Loom還支持在用戶點(diǎn)擊啟動(dòng)插件時(shí)，立即捕捉屏幕圖像，同時(shí)開始視頻錄制操作，還可以將錄制好的視頻復(fù)制到粘貼板中存儲(chǔ)。
GoFullPage 是一款全屏截圖插件（整個(gè)網(wǎng)頁(yè)截圖），完整捕獲您當(dāng)前頁(yè)面的屏幕，進(jìn)行滾動(dòng)截圖，而無(wú)需任何額外的權(quán)限。單擊擴(kuò)展程序圖標(biāo)，然后將其傳輸?shù)狡聊豢煺盏男聵?biāo)簽頁(yè)中，可以在其中將其下載為圖像或PDF，甚至只需拖動(dòng)即可，保存到桌面。
BetterViewer 可以提供更好的圖像查看體驗(yàn)，旨在替代基于 Chrome 瀏覽器中內(nèi)置的圖像查看模式。使用時(shí)，只需在頁(yè)面右鍵點(diǎn)擊圖片，選擇“在新標(biāo)簽頁(yè)中打開圖片”即可。
svg-grabber 是一個(gè)快速預(yù)覽并從網(wǎng)站獲取所有 svg 的工具。可以用來(lái)預(yù)覽、下載和復(fù)制網(wǎng)站中所有 SVG 圖標(biāo)和插圖的代碼。
天設(shè)計(jì)達(dá)人網(wǎng)小編為大家分享的是Material Design圖標(biāo)字體版，有了這個(gè)Web端上使用圖標(biāo)就更加方便了。
除了多出圖標(biāo)字體素材外 ，還推薦了圖標(biāo)下載專題頁(yè)，用戶可以通過(guò)這個(gè)頁(yè)面對(duì)圖標(biāo)單個(gè)下載，包括SVG、PNG、圖標(biāo)字體，相當(dāng)方便。
1. 打開Material icons下載頁(yè)
2. 選擇要下載的圖標(biāo) （目前不能多選>_<）
3.選擇要下載的格式即可
【方法一】
STEP 1: 引入字體文件和樣式文件，下面這個(gè)是直接引用google的字體托管文件，如果國(guó)內(nèi)使用建議不要用托管的，會(huì)訪問慢，把字體下載到自己的服務(wù)器上，詳細(xì)看【方法二】
<link href=”https://fonts.googleapis.com/icon?family=Material+Icons” rel=”stylesheet”>
STEP 2: HTML代碼，在HTML標(biāo)簽上加入class=”material-icons”以及寫上圖標(biāo)名稱即可，如下：
<i class=”material-icons”>face</i>
【方法二】
如果你不想使用Google托管的CSS文件和圖標(biāo)字體，可以下載到本地。
STEP 1: 下載字體文件到本地
STEP 2 : 為你的CSS引入字體
@font-face { font-family: 'Material Icons'; font-style: normal; font-weight: 400; src: url(https://example.com/MaterialIcons-Regular.eot); /* For IE6-8 */ src: local('Material Icons'), local('MaterialIcons-Regular'), url(https://example.com/MaterialIcons-Regular.woff2) format('woff2'), url(https://example.com/MaterialIcons-Regular.woff) format('woff'), url(https://example.com/MaterialIcons-Regular.ttf) format('truetype'); } .material-icons { font-family: 'Material Icons'; font-weight: normal; font-style: normal; font-size: 24px; /* Preferred icon size */ display: inline-block; width: 1em; height: 1em; line-height: 1; text-transform: none; /* Support for all WebKit browsers. */ -webkit-font-smoothing: antialiased; /* Support for Safari and Chrome. */ text-rendering: optimizeLegibility; /* Support for Firefox. */ -moz-osx-font-smoothing: grayscale; /* Support for IE. */ font-feature-settings: 'liga'; } STEP 3: HTML代碼
*請(qǐng)認(rèn)真填寫需求信息，我們會(huì)在24小時(shí)內(nèi)與您取得聯(lián)系。
