在mat-Input区域聚焦时,可以通过CSS样式来改变mat-icon的颜色。可以使用Angular Material提供的伪类选择器:focus来选择聚焦状态下的mat-Input,并通过CSS选择器来选择其内部的mat-icon元素,然后设置其颜色属性即可。
以下是一个示例的CSS样式代码:
.mat-input-element:focus + .mat-icon {
color: red; /* 设置聚焦时mat-icon的颜色为红色 */
}
在上述代码中,.mat-input-element是mat-Input元素的类名,.mat-icon是mat-icon元素的类名。通过+选择器选择紧邻.mat-input-element元素后的.mat-icon元素,然后设置其颜色属性为所需的颜色。
这样,在mat-Input区域聚焦时,mat-icon的颜色就会改变为红色。你可以根据需要修改颜色值或者使用其他CSS属性来改变mat-icon的样式。
推荐的腾讯云相关产品:腾讯云云服务器(CVM)
产品介绍链接地址:https://cloud.tencent.com/product/cvm
领取专属 10元无门槛券
手把手带您无忧上云