|
而不是绝对单
Dec 3, 2023 3:57:01 GMT
Post by account_disabled on Dec 3, 2023 3:57:01 GMT
示例取自 Google Fonts 注意:使用较粗的权重来突出显示某些部分或增加戏剧效果,并避免在大屏幕设置之外使用较细的权重。对于网页设计,您需要谨慎选择使用的权重:加载所有九个 Exo 2 权重会严重减慢您的页面速度。 横幅广告:吸引注意力的技巧 您可能感兴趣 横幅广告:吸引注意力的技巧 正确设置您的单位 在打印应用程序中,人们通常将字体大小称为“点”,但在网络上,他们倾向于使用像素 (px)。这实际上是一个类似的概念。 但对于响应式设计,实际上最好使用相对单位(如 em 和百分比)而不是绝对单位(如像素)来设置所有大小和间距属性。 em 是相对测量单位,等于相关 HTML 元素的当前字体大小(段落默认为 16px)。 像素时,24 像素的行高可能效果很好,但在 32 像素高时,该高度会太局促。 版式特征 左:16px 字体大小,25px 行高。右:字体大小 32 像素,行高 25 像素。间距要求因字体大小而异。 其次,相对单元使 电话号码清单 响应式设计(更改布局和样式以适应各种设备)变得更加容易。如果您围绕基本字体大小设计所有内容,则可以更改该基本字体大小,并且网站的其余部分将自动调整,从而使您需要进行大量手动调整。 您肯定需要对其进行调整,因为不同设备的像素大小差异很大。 例如,iPhone 可以显示的 16 像素字体大约是 Macbook 上 16 像素字体大小的 60%;这使得阅读变得非常困难。 在网页排版中使用空格 适当的间距可以使内容更容易阅读。空间不足可能会导致线条、字母或单词模糊在一起,产生局促的感觉。为了最大限度地提高可读性,您需要关注的三种间距类型是字母间距(跟踪)、行高(行间距)和字间距(对此没有什么花哨的术语)。 字母间距(跟踪) 字母间距(或印刷设计中的字母间距)定义单词中每个字母之间的距离,可以增加或减少文本的可读性。请注意,跟踪与字距调整的不同之处在于,它设置所有字母之间的单个距离,而字距调整可以设置不同字母之间的特定间距。 字母间距 左:默认跟踪。
|
|