CSS学习笔记2-CSS字体样式

最新推荐文章于 2025-05-23 21:14:30 发布

原创最新推荐文章于 2025-05-23 21:14:30 发布 · 198 阅读

0 ·

本内容遵循CC 4.0 BY-SA版权协议

标签

#css

收录于

CSS 专栏收录该内容

12 篇文章

订阅专栏

本文介绍了CSS字体样式的基础要素，如font-family选择字体类型、font-size设置字号、font-style改变字体风格和font-weight调整粗细。通过实例演示了如何在HTML中使用这些属性，并展示了如何应用到实际文本中，包括颜色、特定元素的样式修改。

CSS学习笔记2——CSS字体样式

字体样式

font-family：字体类型
font-size：字体大小
font-style：字体风格
font-weight：字体粗细
font：在申明中设置所有的字体属性

代码演示

为了方便，采用内联样式演示

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>css字体样式</title>
</head>
<body>
	<center>
		<p style="font-size: 28px;font-weight: bolder">静夜思</p>
		<p style="color: red; font-family: '华文行楷';font-size:18px">唐&nbsp;李白</p>
		<!-- 
			修改p标签里的一小部分文字的字体，可以将这部分文字放入span标签里。
		 -->
		<p style="color: green;font-family:'华文行楷';font-size: 22px ">床前<span style="font-style: italic;color: red">明月光</span>，疑是地上霜。</p>
		<p style="color: green;font-family:'华文行楷';font-size: 22px">举头望明月，低头思故乡。</p>
		
	</center>
</body>
</html>