如何在css中的angular-dart中更改材质抽屉组件的颜色和宽度? [英] How do I change the color and width of material drawer component in angular-dart in css?
问题描述
我的第一个问题 - 如果我不够具体,请见谅.如何在css中的angular-dart中更改材质抽屉组件的颜色和宽度?我在 CSS 中尝试了几种方法,包括如下:
My first question ever - so apologies if I am not specific enough. How do I change the color and width of material drawer component in angular-dart in css? I have tried it several ways in the CSS, including as below:
::ng-deep material-drawer {
color: #9437FF;
width: 200px;
}
.material-drawer {
color: #9437FF;
width: 200px;
}
仅供参考,以下内容与位于标题标签内的材料标题一起使用:
FYI, the following worked with the material-header, which is inside a header tag:
::ng-deep header.material-header.material-header {
background-color: white;
color: #9437FF;
}
我的材质抽屉不在一个 div 或任何东西中,它只是一个单独的 HTML 元素.
My material-drawer is not in a div or anything, just directly an HTML element on its own.
感谢任何指点!
推荐答案
设置抽屉的宽度有点复杂.它涉及设置大量值,因此最好使用 mixin.您可以看到一个示例 noreferr">一个>
Setting the width of the drawer is a bit complicated. It involves setting a good amount of values as such it is best to use the mixin. You can see an example here
至于稍微硬一点的颜色.你想改变什么颜色?背景色?
As for the color that is a little bit harder. What color are you trying to change? The background color?
对于背景颜色,您可以在抽屉上设置背景颜色.问题将是内容本身将覆盖该颜色.在这种情况下,材料列表具有与其相关联的自己的白色.删除该颜色可能会导致分隔线颜色出现问题.
For the background color you can set the background-color on the drawer. The problem is going to be that the content itself is going to override that color. In this case the material-list has it's own white color associated with it. Removing that color you could have problems with the divider colors.
这篇关于如何在css中的angular-dart中更改材质抽屉组件的颜色和宽度?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!