帮助:字体

发条狐狸 于1年前修改了此页面。
帮助
版权信息(CC BY-SA)编辑摘要版权信息(CC BY-NC)FAQHuiji缓存建站评估快速指南吐槽与讨论邀请新用户维基化页面图片站点等级站点评分编辑冲突保护页面创建新页面Bot表格编辑页面短域名选择恶意编辑公告模板重定向页面封禁灰机workshop历史与回退命名常规快速插入项链接视频教程上传媒体文件/1添加引用修改站点页脚学习地图Wiki标记语言修改站点导航图片教程消歧义移动页面用户权限页面分类章节站长指南BOOTSTRAP变量AWB机器人CSS样式库ExcelHTML灰机Wiki数据更新器建站心得魔术字简繁处理解析器扩展标签命名空间解析器函数模板参数模板素材库Tab切换SMongo使用CSS变量灰机停机坪图像处理工具文本处理工具XnView预设模板用户组限定的CSS/JSTailwind CSS参考主题编辑器站点CSS编辑折叠站点JS编辑搜索器与检索工具数学公式字体使用cockpit组件自动翻译在灰机使用Less可配置的站点功能灰机Json编辑器API复杂模板狗头人APP机器人灰机Wiki数据更新器\使用VS Code维护代码开发者101零件PythonMongoDB支持Semantic Forms模块Semantic Result Formats/echartsMustache模板Semantic MediaWiki使用SPA提升访问速度推土机架构用Git管理MediaWiki在灰机使用Vue.js
简单
入门
进阶
复杂
开发
灰机帮助中心
该部分内容仅在HuijiWiki的维基平台生效，请注意该部分代码的兼容性。

选择合适的字体能让维基更加美观和个性化，为此灰机提供了一些基础字体可供选用。

灰机wiki提供的字体

灰机wiki提供了一些基础字体，无需上传即可使用，这些字体全部使用开放的免费版权协议。

如需引用，可以在MediaWiki:Common.css中加入 

@font-face {
    font-family: BebasNeue【替换要使用的字体名称】;
    src: url('https://fs.huijiwiki.com/www/resources/font/BebasNeue.otf【替换要使用的字体文件名】');
}

将该字体应用于某个元素时，可以在MediaWiki:Common.css中加入 

<需要改变字体的元素选择器>{
     font-family: BebasNeue;
}

西文字体

Font preview.jpg

目前支持的西文字体有：

  • BebasNeue.otf
  • boston.ttf
  • Cinzel-Regular.otf
  • Constantine.ttf
  • coolvetica rg.ttf
  • DeutscheZierschrift.ttf
  • exmouth_.ttf
  • LCDPHONE.ttf
  • LinLibertine_R.ttf
  • Livingst.ttf
  • Minecraft.ttf
  • Moyko.ttf
  • nasalization-rg.ttf
  • Overdrive Sunset.otf
  • Roman SD.ttf
  • Sansation_Regular.ttf
  • Sloppy-Hand.otf

中文字体

Font preview zh.png

灰机使用Service worker服务提供中文字体资源。用户无需上传庞大的字体文件，也无需担心字体的版权风险，这里我们提供的字体都是完全免费授权的。

引用这些字体时请使用英文的字体文件名。

  • Zcool-kuhei.ttf（站酷酷黑）
  • Zcool-gaoduanhei.ttf（站酷高端黑）
  • Zcool-kuaileti.ttf（站酷快乐体）
  • 思源黑体
    • SourceHanSansSC-ExtraLight.otf
    • SourceHanSansSC-Light.otf
    • SourceHanSansSC-Normal.otf
    • SourceHanSansSC-Regular.otf
    • SourceHanSansSC-Medium.otf
    • SourceHanSansSC-Bold.otf
    • SourceHanSansSC-Heavy.otf
  • 思源宋体
    • SourceHanSerifCN-ExtraLight.otf
    • SourceHanSerifCN-Light.otf
    • SourceHanSerifCN-Normal.otf
    • SourceHanSerifCN-Regular.otf
    • SourceHanSerifCN-Medium.otf
    • SourceHanSerifCN-Bold.otf
    • SourceHanSerifCN-Heavy.otf

上传字体

请不要上传中文字体，这将极大拖慢维基的访问速度，消耗不必要的系统资源和用户的网络流量。

  • 第一步：使用“上传文件”功能来上传字体文件
  • 第二步：与引用灰机提供的字体一样，在Common.css中用@font-face声明上传的字体的以备调用
    • 获取url，上传字体完毕后，在文件页中通过开发者模式或者“检查页面”（F12）来查取字体文件的url地址，通常是由cdn开头，以字体文件扩展名结尾（otf，ttf）

  • 【1】开启检查/开发者模式

  • 【2】找到url（红色方框圈出）

    • 在Common.css中声明你的自定义字体
@font-face
{
 	font-family: <你的字体名字>;
 	src:url('https://cdn.huiji.wiki/....<刚才取得的url地址>');
 }
  • 第三步： 在你想用字体的地方通过css的font-family参数来引用你刚才命名的新字体，可以是某个元素，也可以是整个站点的class
    • 可以是inline的style，也可以在common.css针对某个元素或者类进行一并修改
    • 推荐使用font-family来书写，将您的自定义字体提至最前，但是也保证其他的安全字体存在。
<选择器>{
  font-family: "<你的字体名字>","Lantinghei SC","Open Sans",Arial,"Hiragino Sans GB","Microsoft YaHei","微软雅黑","STHeiti","WenQuanYi Micro Hei",SimSun,sans-serif；
}