时间戳

首页 > 解决方案 > scss 文件将占位符文本设置为粗体

css - scss 文件将占位符文本设置为粗体

问题描述

我有一个角前端，其中有一个带有 textarea 的表单：

<mat-form-field class="full-width">
      <textarea class="left-aligned" formcontrolname="x1" matInput placeholder="some text"/>
</mat-form-field>

我还有一个用于该组件的 scss 文件，其中包含：

mat-form-field{
margin-left:20px;
}

我试过按班级使用选择器

.s {
mat-palceholder:{
 font-weight: bold;
}
}

但这没有用...

如何使占位符文本加粗？如何使占位符文本的一部分加粗？

我也做了：添加了类名

<mat-form-field class="full-width">
          <textarea class="left-aligned x1" formcontrolname="x1" matInput placeholder="some text"/>
    </mat-form-field>

添加到scss文件

.x1::placeholder{
color: green;
font-weight: bold;
}

但这没有用..

谢谢

标签： cssangularhtml

解决方案

这是您如何更改占位符样式的方法

::placeholder { // *::placeholder 
  color: red;
  font-weight:bold
}

.class-name::placeholder {
  color: red;
  font-weight:bold
}

input::placeholder {
  color: red;
  font-weight:bold
}

据我所知，您不能将某些文本更改为粗体，而另一些则不是适用于所有占位符文本的样式

在角材料的情况下

样式.css

mat-form-field span.mat-form-field-label-wrapper label {
  color:red !important;
}


mat-form-field.mat-focused span.mat-form-field-label-wrapper label {
  color:blue !important;
}

演示

推荐阅读