Font

font-family(字體原理)

  • 使用瀏覽器打開頁面時(shí)驶冒,瀏覽器會(huì)讀取 HTML 文件進(jìn)行解析渲染策州。當(dāng)讀到文字時(shí)會(huì)轉(zhuǎn)換成對應(yīng)的 unicode碼(可以認(rèn)為是世界上任意一種文字的特定編號)串述。再根據(jù)HTML 里設(shè)置的 font-family (如果沒設(shè)置則使用瀏覽器默認(rèn)設(shè)置)去查找電腦里(如果有自定義字體@font-face 酬姆,則加載對應(yīng)字體文件)對應(yīng)字體的字體文件芥玉。找到文件后根據(jù) unicode 碼去查找繪制外形发绢,找到后繪制到頁面上

  • 在 CSS 中設(shè)置字體時(shí),直接寫字體中文或英文名稱瀏覽器都能識(shí)別匿值,直接寫中文的情況下編碼(GB2312赠制、UTF-8 等)不匹配時(shí)會(huì)產(chǎn)生亂碼。保險(xiǎn)的方式是將字體名稱用Unicode來表示
    宋體 | SimSun | \5B8B\4F53 黑體 | SimHei | \9ED1\4F53 微軟雅黑 | Microsoft YaHei | \5FAE\8F6F\96C5\9ED1

  • 查詢unicode編碼:打開控制臺(tái) escape('微軟雅黑')挟憔,把 %u替換成 \

字體圖標(biāo)的實(shí)現(xiàn)原理

chrome最小字體解決方案

文本

  • text-align:文本對其方式 left钟些、center、right绊谭、justify
  • text-indent:文案第一行縮進(jìn)距離
  • text-decoration: none厘唾、underline、line-through龙誊、overline
  • color:文字顏色
  • text-transform:改變文字大小寫none抚垃、uppercase、lowercase、capitalize
  • word-spacing:可以改變字(單詞)之間的標(biāo)準(zhǔn)間隔
  • letter-spacing:字母間隔修改的是字符或字母之間的間隔
范例
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末鹤树,一起剝皮案震驚了整個(gè)濱河市铣焊,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌罕伯,老刑警劉巖曲伊,帶你破解...
    沈念sama閱讀 218,204評論 6 506
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場離奇詭異追他,居然都是意外死亡坟募,警方通過查閱死者的電腦和手機(jī),發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 93,091評論 3 395
  • 文/潘曉璐 我一進(jìn)店門邑狸,熙熙樓的掌柜王于貴愁眉苦臉地迎上來懈糯,“玉大人,你說我怎么就攤上這事单雾∽” “怎么了?”我有些...
    開封第一講書人閱讀 164,548評論 0 354
  • 文/不壞的土叔 我叫張陵硅堆,是天一觀的道長屿储。 經(jīng)常有香客問我,道長渐逃,這世上最難降的妖魔是什么够掠? 我笑而不...
    開封第一講書人閱讀 58,657評論 1 293
  • 正文 為了忘掉前任,我火速辦了婚禮茄菊,結(jié)果婚禮上疯潭,老公的妹妹穿的比我還像新娘。我一直安慰自己买羞,他們只是感情好袁勺,可當(dāng)我...
    茶點(diǎn)故事閱讀 67,689評論 6 392
  • 文/花漫 我一把揭開白布雹食。 她就那樣靜靜地躺著畜普,像睡著了一般。 火紅的嫁衣襯著肌膚如雪群叶。 梳的紋絲不亂的頭發(fā)上吃挑,一...
    開封第一講書人閱讀 51,554評論 1 305
  • 那天,我揣著相機(jī)與錄音街立,去河邊找鬼舶衬。 笑死,一個(gè)胖子當(dāng)著我的面吹牛赎离,可吹牛的內(nèi)容都是我干的逛犹。 我是一名探鬼主播,決...
    沈念sama閱讀 40,302評論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼虽画!你這毒婦竟也來了舞蔽?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 39,216評論 0 276
  • 序言:老撾萬榮一對情侶失蹤码撰,失蹤者是張志新(化名)和其女友劉穎渗柿,沒想到半個(gè)月后,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體脖岛,經(jīng)...
    沈念sama閱讀 45,661評論 1 314
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡朵栖,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 37,851評論 3 336
  • 正文 我和宋清朗相戀三年,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了柴梆。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片陨溅。...
    茶點(diǎn)故事閱讀 39,977評論 1 348
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡,死狀恐怖轩性,靈堂內(nèi)的尸體忽然破棺而出声登,到底是詐尸還是另有隱情,我是刑警寧澤揣苏,帶...
    沈念sama閱讀 35,697評論 5 347
  • 正文 年R本政府宣布悯嗓,位于F島的核電站,受9級特大地震影響卸察,放射性物質(zhì)發(fā)生泄漏脯厨。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,306評論 3 330
  • 文/蒙蒙 一坑质、第九天 我趴在偏房一處隱蔽的房頂上張望合武。 院中可真熱鬧,春花似錦涡扼、人聲如沸稼跳。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,898評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽汤善。三九已至,卻和暖如春票彪,著一層夾襖步出監(jiān)牢的瞬間红淡,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 33,019評論 1 270
  • 我被黑心中介騙來泰國打工降铸, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留在旱,地道東北人。 一個(gè)月前我還...
    沈念sama閱讀 48,138評論 3 370
  • 正文 我出身青樓推掸,卻偏偏與公主長得像桶蝎,于是被迫代替她去往敵國和親驻仅。 傳聞我的和親對象是個(gè)殘疾皇子,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 44,927評論 2 355

推薦閱讀更多精彩內(nèi)容

  • 問答題47 /72 常見瀏覽器兼容性問題與解決方案登渣? 參考答案 (1)瀏覽器兼容問題一:不同瀏覽器的標(biāo)簽?zāi)J(rèn)的外補(bǔ)...
    _Yfling閱讀 13,754評論 1 92
  • 1.塊級元素和行內(nèi)元素 塊級(block-level)元素雾家;行內(nèi)(內(nèi)聯(lián)、inline-level)元素绍豁。 塊元素的...
    饑人谷_小侯閱讀 2,006評論 1 4
  • 對于字體的認(rèn)識(shí)一直有一個(gè)誤區(qū):我們可能一直認(rèn)為font-family是某一種字體芯咧,實(shí)際上,它指的是一個(gè)字體的系列竹揍。...
    SuperSnail閱讀 3,492評論 6 32
  • 學(xué)習(xí)CSS的最佳網(wǎng)站沒有之一 http://www.w3school.com.cn/tags/index.asp ...
    Amyyy_閱讀 1,056評論 0 1
  • 摘要:本篇文章包括(1)介紹@font-face(2)如何在網(wǎng)頁中使用@font-face插入特殊字體(3)中文在...
    Masukio閱讀 16,460評論 0 17