使用 CSS3 设置字体

在网页设计中，字体的选择和设置对于提升用户体验起着至关重要的作用。CSS3 为我们提供了丰富且强大的功能来灵活设置字体，让网页呈现出独具特色的视觉效果。

首先是字体的基本选择。通过 font-family 属性，我们可以指定网页元素使用的字体。例如，p { font-family: Arial, sans-serif; } 表示段落文本优先使用 Arial 字体，如果用户设备上没有安装 Arial 字体，则会使用系统默认的无衬线字体 sans-serif。这里可以罗列多个字体名称，以确保在不同设备和浏览器上都能有合适的字体显示。

设置字体大小同样关键。CSS3 中常用的单位有像素（px）、百分比（%）、em 和 rem 等。以像素为单位设置字体大小，能精确控制文本尺寸，如 h1 { font-size: 36px; } 会使一级标题显示为 36 像素大小。百分比则是相对于父元素的字体大小，p { font-size: 120%; } 表示段落文本大小是父元素字体大小的 120%。em 单位相对父元素的字体大小，而 rem 是相对于根元素（html 元素）的字体大小，使用这些单位能实现更灵活的响应式字体布局。

字体的粗细也能通过 CSS3 轻松调整。font-weight 属性可以取值为 normal（正常粗细）、bold（加粗），也可以使用 100 - 900 的数字来更精确地设置，数字越大字体越粗。比如 strong { font-weight: 700; } 会让强调文本显示为更粗的效果。

为了增加文本的美观度，还能设置字体样式。font-style 属性有 normal（正常样式）、italic（斜体）、oblique（倾斜）等取值。例如 blockquote { font-style: italic; } 会使引用内容以斜体显示。

CSS3 中的 text-decoration 属性可用于设置文本的装饰线，如 a { text-decoration: none; } 可以去除链接的下划线，s { text-decoration: line-through; } 会给删除线文本添加效果。

通过合理运用 CSS3 的这些字体设置属性，网页设计师能够打造出风格各异、吸引用户的页面。无论是简洁现代的风格，还是复古华丽的风格，都能通过巧妙的字体设置得以实现，从而提升网站的整体品质和用户的浏览体验。