Office UI Fabric React:下拉组件

时间:2018-10-15 09:29:35

标签: office-ui-fabric

如何更改Dropdown标签的CSS?标记如下:

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.9/angular.min.js"></script>
</head>
<body>
<div ng-app="myApp" ng-controller="myCtrl">
  <button class="button" ng-class="{'active': isActive}" ng-click="activeButton()" type="button">Click Me</button> 
</div>

</body>
</html>

我要使“部门”标签加粗。

1 个答案:

答案 0 :(得分:1)

您可以通过使用styles上的<Dropdown/>道具来设置标签样式。这是一个代码示例,将标签显示为粗体:

<Fabric.Dropdown
  placeHolder="Select Department"
  label="Department:"
  id="Basicdrop1"
  ariaLabel="Department"
  options={[

    { key: 'A', text: 'Option a' },
    { key: 'B', text: 'Option b' },
    { key: 'C', text: 'Option c'},
    { key: 'D', text: 'Option d' },
    { key: 'E', text: 'Option e' },
  ]}
  onFocus={() =>console.log('onFocus called')}
  onBlur={() =>console.log('onBlur called')}
  componentRef={this._basicDropdown}
  styles={{ label: { fontWeight: 'bold' }}}
/>

参考