CSS 如何自動調(diào)整字體大小

我們可以使用CSS給我們的 “font-size-adjust “屬性來調(diào)整文本的字體大小。font-size-adjust “屬性允許我們調(diào)整到一個共同的字體大小，而不考慮文檔中使用的不同字體家族（如果有的話）。有了這個屬性，我們就可以根據(jù)文檔中大寫字母的字體大小來調(diào)整文檔中使用的小寫字母的字體大小。

語法

font-size-adjust: number | initial | none | inherit | revert | revert-layer | unset

HTML

“font-size-adjust “可以采用上面列出的許多值。這些值可以幫助我們調(diào)整到一個共同的字體大小，而不管使用的是哪種字體家族。

注意 --在進行示例之前，請確保使用Firefox，因為 “font-size-adjust “屬性目前只適用于Firefox這個主要瀏覽器。

例子1

在這個例子中，我們將把小寫字母的字體大小調(diào)整為所使用的不同字體家族的默認(rèn)字體大小的一半。

<!DOCTYPE html>
<html>
<head>
   <title>How to auto adjust font size using CSS?</title>
   <style>
      p {
         font-size-adjust: 0.5;
      }
      .a {
         font-family: 'Times New Roman', Times, serif;
      }
      .b {
         font-family: Helvetica;
      }
   </style>
</head>
<body>
   <h3>How to auto adjust font size using CSS?</h3>
   <p>
      Lorem ipsum dolor, sit amet consectetur adipisicing elit. Minus ipsa maiores ratione dolores consectetur soluta a hic recusandae fugiat quibusdam beatae voluptatum, repudiandae ipsam ex fuga nobis numquam corporis magnam?
   </p>
   <p>
      Lorem ipsum dolor, sit amet consectetur adipisicing elit. Minus ipsa maiores ratione dolores consectetur soluta a hic recusandae fugiat quibusdam beatae voluptatum, repudiandae ipsam ex fuga nobis numquam corporis magnam?
   </p>
</body>
</html>

HTML

例2

在這個例子中，我們將把小寫字母的字體大小調(diào)整為所使用的默認(rèn)字體家族默認(rèn)字體大小的一半。

<!DOCTYPE html>
<html>
<head>
   <title>How to auto adjust font size using CSS?</title>
   <style>
      p {
         font-size-adjust: 0.5;
      }
   </style>
</head>
<body>
   <h3>How to auto adjust font size using CSS?</h3>
   <p>
      Lorem ipsum dolor, sit amet consectetur adipisicing elit. Minus ipsa maiores ratione dolores consectetur soluta a hic recusandae fugiat quibusdam beatae voluptatum, repudiandae ipsam ex fuga nobis numquam corporis magnam?
   </p>
   <p>
      Lorem ipsum dolor, sit amet consectetur adipisicing elit. Minus ipsa maiores ratione dolores consectetur soluta a hic recusandae fugiat quibusdam beatae voluptatum, repudiandae ipsam ex fuga nobis numquam corporis magnam?
   </p>
</body>
</html>

HTML

總結(jié)

在這篇文章中，我們學(xué)習(xí)了什么是 “font-size-adjust “屬性，并在兩個不同例子的幫助下，用它來自動調(diào)整文檔中的文字字體大小。在第一個例子中，我們將小寫字母的字體大小調(diào)整為自定義字體默認(rèn)字體大小的一半；在第二個例子中，我們將小寫字母的字體大小調(diào)整為默認(rèn)字體的一半。

該文章在 2023/8/24 22:37:53 編輯過

關(guān)鍵字查詢

相關(guān)文章

正在查詢...

點晴ERP是一款針對中小制造業(yè)的專業(yè)生產(chǎn)管理軟件系統(tǒng),系統(tǒng)成熟度和易用性得到了國內(nèi)大量中小企業(yè)的青睞。

點晴PMS碼頭管理系統(tǒng)主要針對港口碼頭集裝箱與散貨日常運作、調(diào)度、堆場、車隊、財務(wù)費用、相關(guān)報表等業(yè)務(wù)管理，結(jié)合碼頭的業(yè)務(wù)特點，圍繞調(diào)度、堆場作業(yè)而開發(fā)的。集技術(shù)的先進性、管理的有效性于一體，是物流碼頭及其他港口類企業(yè)的高效ERP管理信息系統(tǒng)。

點晴WMS倉儲管理系統(tǒng)提供了貨物產(chǎn)品管理,銷售管理,采購管理,倉儲管理,倉庫管理,保質(zhì)期管理,貨位管理,庫位管理,生產(chǎn)管理,WMS管理系統(tǒng),標(biāo)簽打印,條形碼,二維碼管理,批號管理軟件。

點晴免費OA是一款軟件和通用服務(wù)都免費，不限功能、不限時間、不限用戶的免費OA協(xié)同辦公管理系統(tǒng)。