在網頁設計中,CSS 文字跟隨頁面縮小是一個非常重要的特性。它打破了傳統網站的固定寬度布局,使得網頁可以根據設備和屏幕的大小進行自適應。
下面是一個實現 CSS 文字跟隨頁面縮小的示例代碼:
body { font-size: 16px; } @media (max-width: 768px) { body { font-size: 14px; } } @media (max-width: 576px) { body { font-size: 12px; } }
在上面的代碼中,我們首先設置了 16px 的默認字體大小。然后,我們使用 @media 查詢來根據屏幕的大小設置不同的字體大小。在這個示例中,如果屏幕的最大寬度小于 768px,我們就將字體大小設置為 14px。如果屏幕的最大寬度小于 576px,則將字體大小設置為 12px。
通過這種方式,我們可以確保在不同的設備和屏幕上,網頁的文字都可以跟隨頁面的縮小或放大而自動調整大小,從而使網頁更加適合不同的用戶和設備。