CSS 字体搭配
优秀的字体搭配是优秀设计的关键。
字体搭配规则
以下是一些创建优秀字体搭配的基本规则
1. 互补
找到相互补充的字体搭配总是安全的。
一个优秀的字体组合应该和谐一致,不要太相似也不要太不同。
2. 使用字体超级家族
字体超级家族是一组设计为可以很好地协同工作的字体。因此,使用同一超级家族中的不同字体是安全的。
例如,Lucida 超级家族包含以下字体:Lucida Sans、Lucida Serif、Lucida Typewriter Sans、Lucida Typewriter Serif 和 Lucida Math。
3. 对比是关键
两个过于相似的字体往往会冲突。但是,对比,以正确的方式,可以发挥每种字体的最佳效果。
示例:将衬线字体与无衬线字体结合是一种众所周知的组合。
一个强大的超级家族包括同一字体的衬线和无衬线变体(例如 Lucida 和 Lucida Sans)。
4. 只选择一个“老大”
应该有一款字体是“老大”。这为页面上的字体建立了层次结构。这可以通过改变大小、粗细和颜色来实现。
示例
毫无疑问,“Georgia”在这里是“老大”
body {
background-color: black;
font-family: Verdana, sans-serif;
font-size: 16px;
color: gray;
}
h1 {
font-family: Georgia, serif;
font-size: 60px;
color: white;
}
自己尝试一下 »
下面,我们展示了一些流行的字体搭配,适合许多品牌和场景。
Georgia 和 Verdana
Georgia 和 Verdana 是一个经典的组合。它也遵循网页安全字体的标准
示例
使用“Georgia”字体作为标题,使用“Verdana”字体作为正文
美丽的挪威
挪威总面积为 385,252 平方公里,人口为 5,438,657(2020 年 12 月)。挪威与东北部的瑞典、芬兰和俄罗斯接壤,南部与斯卡格拉克海峡接壤,丹麦位于海峡的另一侧。
挪威拥有美丽的山脉、冰川和迷人的峡湾。首都奥斯陆是一座拥有绿色空间和博物馆的城市。伯根拥有色彩鲜艳的木制房屋,是前往壮丽的松恩峡湾的游轮出发点。挪威也以钓鱼、徒步旅行和滑雪而闻名。
自己尝试一下 »
Helvetica 和 Garamond
Helvetica 和 Garamond 是另一个经典的组合,使用网页安全字体
示例
使用“Helvetica”字体作为标题,使用“Garamond”字体作为正文
美丽的挪威
挪威总面积为 385,252 平方公里,人口为 5,438,657(2020 年 12 月)。挪威与东北部的瑞典、芬兰和俄罗斯接壤,南部与斯卡格拉克海峡接壤,丹麦位于海峡的另一侧。
挪威拥有美丽的山脉、冰川和迷人的峡湾。首都奥斯陆是一座拥有绿色空间和博物馆的城市。伯根拥有色彩鲜艳的木制房屋,是前往壮丽的松恩峡湾的游轮出发点。挪威也以钓鱼、徒步旅行和滑雪而闻名。
自己尝试一下 »
流行的 Google 字体搭配
如果您不想在 HTML 中使用标准字体,可以使用 Google 字体。
Google 字体免费使用,拥有超过 1000 种字体可供选择。
以下是 一些流行的 Google 网页字体搭配。
Merriweather 和 Open Sans
示例
使用“Merriweather”字体作为标题,使用“Open Sans”字体作为正文
美丽的挪威
挪威总面积为 385,252 平方公里,人口为 5,438,657(2020 年 12 月)。挪威与东北部的瑞典、芬兰和俄罗斯接壤,南部与斯卡格拉克海峡接壤,丹麦位于海峡的另一侧。
挪威拥有美丽的山脉、冰川和迷人的峡湾。首都奥斯陆是一座拥有绿色空间和博物馆的城市。伯根拥有色彩鲜艳的木制房屋,是前往壮丽的松恩峡湾的游轮出发点。挪威也以钓鱼、徒步旅行和滑雪而闻名。
自己尝试一下 »
Ubuntu 和 Lora
示例
使用“Ubuntu”字体作为标题,使用“Lora”字体作为正文
美丽的挪威
挪威总面积为 385,252 平方公里,人口为 5,438,657(2020 年 12 月)。挪威与东北部的瑞典、芬兰和俄罗斯接壤,南部与斯卡格拉克海峡接壤,丹麦位于海峡的另一侧。
挪威拥有美丽的山脉、冰川和迷人的峡湾。首都奥斯陆是一座拥有绿色空间和博物馆的城市。伯根拥有色彩鲜艳的木制房屋,是前往壮丽的松恩峡湾的游轮出发点。挪威也以钓鱼、徒步旅行和滑雪而闻名。
自己尝试一下 »
Abril Fatface 和 Poppins
示例
使用“Abril Fatface”字体作为标题,使用“Poppins”字体作为正文
美丽的挪威
挪威总面积为 385,252 平方公里,人口为 5,438,657(2020 年 12 月)。挪威与东北部的瑞典、芬兰和俄罗斯接壤,南部与斯卡格拉克海峡接壤,丹麦位于海峡的另一侧。
挪威拥有美丽的山脉、冰川和迷人的峡湾。首都奥斯陆是一座拥有绿色空间和博物馆的城市。伯根拥有色彩鲜艳的木制房屋,是前往壮丽的松恩峡湾的游轮出发点。挪威也以钓鱼、徒步旅行和滑雪而闻名。
自己尝试一下 »
Cinzel 和 Fauna One
示例
使用“Cinzel”字体作为标题,使用“Fauna One”字体作为正文
美丽的挪威
挪威总面积为 385,252 平方公里,人口为 5,438,657(2020 年 12 月)。挪威与东北部的瑞典、芬兰和俄罗斯接壤,南部与斯卡格拉克海峡接壤,丹麦位于海峡的另一侧。
挪威拥有美丽的山脉、冰川和迷人的峡湾。首都奥斯陆是一座拥有绿色空间和博物馆的城市。伯根拥有色彩鲜艳的木制房屋,是前往壮丽的松恩峡湾的游轮出发点。挪威也以钓鱼、徒步旅行和滑雪而闻名。
自己尝试一下 »
Fjalla One 和 Libre Baskerville
示例
使用“Fjalla One”字体作为标题,使用“Libre Baskerville”字体作为正文
美丽的挪威
挪威总面积为 385,252 平方公里,人口为 5,438,657(2020 年 12 月)。挪威与东北部的瑞典、芬兰和俄罗斯接壤,南部与斯卡格拉克海峡接壤,丹麦位于海峡的另一侧。
挪威拥有美丽的山脉、冰川和迷人的峡湾。首都奥斯陆是一座拥有绿色空间和博物馆的城市。伯根拥有色彩鲜艳的木制房屋,是前往壮丽的松恩峡湾的游轮出发点。挪威也以钓鱼、徒步旅行和滑雪而闻名。
自己尝试一下 »
Space Mono 和 Muli
示例
使用“Space Mono”字体作为标题,使用“Muli”字体作为正文
美丽的挪威
挪威总面积为 385,252 平方公里,人口为 5,438,657(2020 年 12 月)。挪威与东北部的瑞典、芬兰和俄罗斯接壤,南部与斯卡格拉克海峡接壤,丹麦位于海峡的另一侧。
挪威拥有美丽的山脉、冰川和迷人的峡湾。首都奥斯陆是一座拥有绿色空间和博物馆的城市。伯根拥有色彩鲜艳的木制房屋,是前往壮丽的松恩峡湾的游轮出发点。挪威也以钓鱼、徒步旅行和滑雪而闻名。
自己尝试一下 »
Spectral 和 Rubik
示例
使用“Spectral”字体作为标题,使用“Rubik”字体作为正文
美丽的挪威
挪威总面积为 385,252 平方公里,人口为 5,438,657(2020 年 12 月)。挪威与东北部的瑞典、芬兰和俄罗斯接壤,南部与斯卡格拉克海峡接壤,丹麦位于海峡的另一侧。
挪威拥有美丽的山脉、冰川和迷人的峡湾。首都奥斯陆是一座拥有绿色空间和博物馆的城市。伯根拥有色彩鲜艳的木制房屋,是前往壮丽的松恩峡湾的游轮出发点。挪威也以钓鱼、徒步旅行和滑雪而闻名。
自己尝试一下 »
Oswald 和 Noto Sans
示例
使用“Oswald”字体作为标题,使用“Noto Sans”字体作为正文
美丽的挪威
挪威总面积为 385,252 平方公里,人口为 5,438,657(2020 年 12 月)。挪威与东北部的瑞典、芬兰和俄罗斯接壤,南部与斯卡格拉克海峡接壤,丹麦位于海峡的另一侧。
挪威拥有美丽的山脉、冰川和迷人的峡湾。首都奥斯陆是一座拥有绿色空间和博物馆的城市。伯根拥有色彩鲜艳的木制房屋,是前往壮丽的松恩峡湾的游轮出发点。挪威也以钓鱼、徒步旅行和滑雪而闻名。
自己尝试一下 »
要查看所有免费的 Google 字体,请访问我们的 如何使用 - Google 字体教程。