前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >Safari浏览器自定义CSS样式表

Safari浏览器自定义CSS样式表

原创
作者头像
QinAi
发布2024-02-17 18:18:13
1630
发布2024-02-17 18:18:13

这段CSS的主要目的是针对Safari浏览器自定义的样式表,实现:非英文内容进行全局样式的统一设定,同时优化了文字排版与显示效果。对于图标和其他特殊元素,则保持原有样式不变。

代码语言:css
复制
/* 以下CSS代码段针对非英语环境下的所有元素(除了包含特定类名或标签的元素)设置字体和字间距样式 */

:not(:lang(en)) *:not([class*="icon"], .fa, .fab, .far, .fal, .fad, .fas, .mi, .ion, .bi, .feather, i, button, svg) {
  /* 设置非英语环境下,不包含特定图标类名或其他指定标签的所有元素的字体为系统默认(如Mac系统的San Francisco字体) */
  font-family: -apple-system !important;
  /* 设置这些元素的字间距为负0.26像素,以优化排版效果 */
  letter-spacing: -0.26px !important;
}

/* 下面的CSS代码应用于整个body以及所有的后代元素,开启特定的OpenType特性支持以改善字体渲染效果 */

body,
* {
  /* 启用"大小写替换"、"数字标记"、"局部化形变"及"连字符连接"等OpenType特性,以增强文本排版质量 */
  font-feature-settings: "case", "tnum", "locl", "calt" !important;
}

原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。

如有侵权,请联系 cloudcommunity@tencent.com 删除。

原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。

如有侵权,请联系 cloudcommunity@tencent.com 删除。

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档