Как изменить вес шрифта для модального заголовка Bootstrap 4? - PullRequest
Новая
       15

Как изменить вес шрифта для модального заголовка Bootstrap 4?

1 голос
/ 01 апреля 2020

Как увеличить вес шрифта в следующем Bootstrap 4 модальном «заголовке»?

Бонусные баллы: я также хотел бы сделать шрифт color = "# 7f7f7f" ... 

<div class="modal" tabindex="-1" role="dialog">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title">Modal title</h5>
      </div>
      <div class="modal-body">
        <p>Modal body text goes here.</p>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-primary">Save changes</button>
        <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
      </div>
    </div>
  </div>
</div>

Спасибо! Шон

1 Ответ

1 голос
/ 01 апреля 2020

Добавьте селектор CSS к modal-title или modal-header, а свойства color, font-size и font-weight к заголовку. 

.modal-title {
  font-size: 60px;
  color: #7f7f7f;
  font-weight: bolder;
}
<div class="modal" tabindex="-1" role="dialog">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title">Modal title</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
        <p>Modal body text goes here.</p>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-primary">Save changes</button>
        <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
      </div>
    </div>
  </div>
</div>
...