使用Chrome修改任何WordPress主題的字體樣式和字體大小
  • 更新時間:2024-10-29 06:19:21
  • 網(wǎng)站建設(shè)
  • 發(fā)布時間:1年前
  • 327

很多網(wǎng)友都和Quicl一樣,默認(rèn)主題的字體不好看。為了美觀,他們在編輯文章時使用CSS制作字體樣式,卻不知道在文章中使用過多的CSS樣式對首頁的打開速度影響很大。根除這個問題的方法是修改Wordpress主題的默認(rèn)字體樣式和字體大小。雖然今天之前一直在使用修改文章css的方法,但是昨晚上網(wǎng)時間長了,看網(wǎng)站上的其他字體突然就不舒服了。轉(zhuǎn)念一想,算了,換個主題的字體吧!

上一篇說了,實(shí)在不想再用FireFox了,就用最近用的Chrome做元素審計。 Chrome 太人性化了,非常方便。在首頁選中任意一段文字——右鍵——檢查元素,就可以看到當(dāng)前內(nèi)容的CSS容器。檢查后發(fā)現(xiàn)我的子容器里沒有font-family:和font-size:好吧,既然沒有con,那我就去父容器里找吧。方便的ChromeDebug 顯示Font-family 和Font-size 都在Body 中。源CSS 代碼是;

font-family:Arial, Helvetica, sans-serif;

字體大?。?2px;顏色:#b8babb;文本對齊: 中心;

考慮到我總體上喜歡“微軟雅黑”,我會改成“微軟雅黑”,但是字體大小呢?在網(wǎng)上查了很多,文中說12px是最好的選擇,我覺得不是!使用Chrome的element inspection,發(fā)現(xiàn)我原來主題的Body字體大小只有12px,但是感覺很小。瀏覽博友的站點(diǎn)時,發(fā)現(xiàn)有好幾個都是13px的,就這樣吧。使用13px 的字體大小。提醒:對于廣大Wordpress玩家來說,修改主題前最好在本地確定合適的css樣式。其次,為避免出現(xiàn)不可預(yù)見的錯誤,請將代碼復(fù)制到“超級記事本”或“Dreamwaver”中進(jìn)行備份,使用系統(tǒng)自帶的記事本會出現(xiàn)莫名其妙的問題。此方法可用于任何主題。由于Wordpress主題的字體都在Body標(biāo)簽中,所以我們的修改思路是找到最頂層的Body容器,修改其字體。下面就帶大家一起修改主題:

在Wordprss后臺以管理員權(quán)限登錄——,在“外觀”欄選擇“編輯”選項(xiàng)卡,然后在調(diào)出的頁面右下方找到“Style.css”,點(diǎn)擊。

左邊編輯框最上方是Body欄,body代碼(相信大部分代碼和我的一樣)如下:

身體{ margin:0;填充:0; background:url(img/back1.gif);

font-family: Arial, Helvetica, sans-serif;

字體大?。?2px;顏色:#b8babb;文本對齊: 中心; }

在Arial 之前添加Microsoft 雅黑。請記住,這個逗號是英文逗號。請注意!在字體大小中,將12px 更改為13px??赡苡信笥褧f,這么簡單,那我也換個顏色吧!大量的事實(shí)證明,修改顏色是一個不明智的選擇。主題的創(chuàng)建者比你更了解網(wǎng)站的配色,你的修改可能會使主題顏色變得面目全非

下面是修改后的代碼,

身體{ margin:0;填充:0; background:url(img/back1.gif);

font-family: Microsoft Yahei, Arial, Arial, Helvetica, sans-serif;

字體大小:13px;顏色:#b8babb;文本對齊: 中心; }

保存修改后,回到任意頁面刷新,一般都能看到效果。如果看不到,請清除網(wǎng)絡(luò)緩存!

我們專注高端建站,小程序開發(fā)、軟件系統(tǒng)定制開發(fā)、BUG修復(fù)、物聯(lián)網(wǎng)開發(fā)、各類API接口對接開發(fā)等。十余年開發(fā)經(jīng)驗(yàn),每一個項(xiàng)目承諾做到滿意為止,多一次對比,一定讓您多一份收獲!

本文章出于推來客官網(wǎng),轉(zhuǎn)載請表明原文地址:https://www.tlkjt.com/web/13482.html
推薦文章

在線客服

掃碼聯(lián)系客服

3985758

回到頂部