web-dev-qa-db-ja.com

ブートストラップクラスを使用してフォントの太さを設定する

font-weight: boldや他のfont-weightの値に対応するTwitter Bootstrapクラスはありますか？

これがすでにBootstrapに存在するのであれば、私は新しいものを作成しません。

htmlcsstwitter-bootstraptwitter-bootstrap-3
101
Ionică Bizău

私は Bootstrapウェブサイト でこれを見つけました、しかしそれは本当にBootstrapクラスではなく、それは単なるHTMLです。

<strong>rendered as bold text</strong>
89
Brett Merrifield

In Bootstrap 4：

class="font-weight-bold"

または

<strong>text</strong>
45
Jeremy Lynch

Site.css（または別の場所）に、たとえば.font-boldという名前の新しいクラスを作成し、それを自分の要素に設定します。

.font-bold {
  font-weight: bold;
}
35
Gurgen Hakobyan

EDIT 2（final）： ブートストラップ4のドキュメント によると、class="font-weight-bold"はあなたが探しているものです。

編集：class="font-weight-bold"を ここに表示 （ブートストラップ4アルファ）として使用できます。

わかりやすくするために、私は以下の元の答えを残しました。

このスレッドには多くの訪問者がいるようですが、この問題を解決するための適切な解決策はありませんでした。しかし、もうすぐBootstrap 4を使用する方法があります。

このGitHub pull request が示すように、あなたはtext-weight-normal、text-weight-boldそしてtext-weight-italicクラスを使う必要があるでしょう。

これは公式の安定版リリースまでに変わる可能性があります。これを書いている時点では、このpull requestはまだalphaブランチにマージされていません。

Bootstrap v4がリリースされたら、この記事を更新します。

14
Ilshidur

ブートストラップ4では、次のものを使用できます。

<p class="font-weight-bold">Bold text.</p>
<p class="font-weight-normal">Normal weight text.</p>
<p class="font-weight-light">Light weight text.</p>
7
Daniel RM

もっとカスタマイズされた値が欲しい場合や、繰り返す必要があるスキームに従っている場合は、bootstarpの変数を使用してフォントの太さを制御してください。変数は、色、間隔、フォントスタックなどの一般的に使用される値を一元管理し共有する方法として、プロジェクト全体で使用されます。

すべてのドキュメントは http://getbootstrap.com/css にあります。

1
maioman