css - 向 CSS 添加自定义按钮 - Ionic 3 无法加载字体

标签 css ionic-framework sass

我正在尝试为我的 Ionic 应用程序添加自定义按钮样式。

这是我的文件夹结构的图像,其中字体不起作用:

folder structure

这是我的 Sass 文件:

page-login {
  @font-face {
    font-family: 'Minecraft';
    src: url('../../assets/Minecraft.ttf')
  }
  .button-login {
    height: 40px;
    width: 200px;
    text-decoration: none;
    text-align: center;
    color: white;
    background: url('https://i.hizliresim.com/QpVGbg.png') no-repeat;
    font-family: Minecraft;
    line-height: 26px;
    padding-top: 6px;
  }
}

最佳答案

你必须将字体源设置为此

 src: url('../assets/Minecraft.ttf')

因为当 scr 文件夹得到构建并且所有内容都被编译并放入 www 文件夹中时,所有 css 文件都被编译到 main.css 中。

结构

--index.html

--assets
----fonts
------MineCraft.tff

--build
----main.css

关于css - 向 CSS 添加自定义按钮 - Ionic 3 无法加载字体,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47005839/

相关文章:

html - 在 h1 中居中 div

html - 让右边的div填充剩余空间,但首先在HTML代码中

javascript - 具有名称属性的 ionic 导航 View 不起作用

angular - ionic 3 EmailValidator 用法

javascript - 如何根据数据库 [ ionic ] 中的值打开/关闭切换按钮

css - 带有 Webpack 的白标 sass/css

ruby-on-rails - 每次生成脚手架时,Rails 脚手架 scss 都会重置

html - 使用 native html 元素与 css

html - 2 个左浮动 div,具有固定大小和自动宽度

html - 使用 Bourbon Neat 删除 span 列上的边距