加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 综合聚焦 > 服务器 > 安全 > 正文

angular-material – 使用Angular Material Design的主题按钮文

发布时间:2020-12-17 18:08:21 所属栏目:安全 来源:网络整理
导读:我想使用$mdThemingProvider通过自定义调色板来普遍配置我网站上的所有按钮.我可以通过在调色板中配置A200和A700来操纵按钮的背景颜色.我还想更改默认文本颜色.我已经使用了contrastDefaultColor,contrastLightColors和contrastDarkColors,但我能做的最好的
我想使用$mdThemingProvider通过自定义调色板来普遍配置我网站上的所有按钮.我可以通过在调色板中配置A200和A700来操纵按钮的背景颜色.我还想更改默认文本颜色.我已经使用了contrastDefaultColor,contrastLightColors和contrastDarkColors,但我能做的最好的就是获得黑色或白色文本.

以下snippit将生成带有深色文本的白色按钮:

var lightGrey = $mdThemingProvider.extendPalette('grey',{
  'A200': '#fefefe',// Element background color (default)
  'A700': '#fefefe',// Element hover background color (default)
  'contrastDefaultColor': 'dark','contrastLightColors': '600 700 800 900'
});
$mdThemingProvider.definePalette('light-grey',lightGrey);

$mdThemingProvider.theme('default')
  // Accent palette controls buttons,links,etc
  .accentPalette('light-grey');

将contrastDefaultColor更改为“light”会导致文本变为白色.

我可以通过覆盖生成的样式表的规则来手动实现我想要的效果:

.md-button.md-default-theme.md-fab {
  color: #bdc3c7;
}

…但我正在尝试使用库中提供的工具.

解决方法

我不知道你为什么要面对这个问题但是给了A200& A700你想要的颜色将解决问题.像这样:

var lightGrey = $mdThemingProvider.extendPalette('grey',{
  'A200': '#bdc3c7',// Element background color (default)
  'A700': '#bdc3c7','contrastLightColors': ['600','700','800','900']
});

注意:尝试以阵列形式提供对比色调.

如果您遇到一些不同的问题,请更新或者您可以参考这个link

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读