Невозможно отобразить fontSize метки в семантической реакции

Question

Если у меня есть форма ввода, какая метка -> я не могу уменьшить размер метки.

В этом примере fontSize не будет применяться:

<Form.Input label="Username" style={{fontSize: '10px'}}  />

Есть ли у кого-тоИдея о том, как решить проблему?

Answer 1

Я думаю, вам нужно разделить метку и ввести данные ниже, чем вы можете использовать встроенный стиль:

<Form.Input label='Enter Password' type='password' />
vs

<Form.Field>
  <label style={{fontSize: '10px'}}>Enter Password</label>
  <Input type='password' style={{fontSize: '10px'}} />
</Form.Field>

Answer 2

Если вы не можете создавать внешние CSS файлы и правила, вы не можете переопределить стиль Label с помощью Form.Input.

Но это только «сокращенная» (составная) версия для:

<Form.Field>
  <label>Enter text</label>
  <Input type='text' />
</Form.Field>

. И с этим подходом вы можете переопределить стиль Label:

<Form.Field>
  <label style={{fontSize: '15px'}}>Enter text</label>
  <Input type='text' />
</Form.Field>

См. документы

Answer 3

Можете ли вы попробовать этот простой способ применить CSS к любому компоненту.

.inputCls {
  font-size: 10px !important;
}

<Form.Input label="Username" className="inputCls"  />