Ustaw grubość czcionki za pomocą klas Bootstrap

129

Czy jest jakaś klasa Twitter Bootstrap dla font-weight: boldi inne wartości font-weight?

Nie utworzyłbym nowego, gdyby ten już istniał w Bootstrap.

— Ionică Bizău
źródło

5

Nie ma klasy, musisz dostosować własną.

— Manoz

2

tak, nie ma osobnej klasy dla wagi czcionki: pogrubienie

— Dinesh Kanivu

54

EDYCJA 2 (wersja ostateczna): Zgodnie z dokumentacją bootstrap 4 , class="font-weight-bold"to jest to, czego szukasz.

EDYCJA: Możesz użyć, class="font-weight-bold"jak pokazano tutaj (Bootstrap 4 alpha).

Zachowałem pierwotną odpowiedź poniżej dla jasności.

Publikuję tę odpowiedź, ponieważ wydaje się, że ten wątek ma wielu odwiedzających, ale nie ma odpowiedniego rozwiązania, aby rozwiązać ten problem. Ale wkrótce będzie sposób z Bootstrap 4:

Jak tego GitHub żądanie ciągnąć pokazy, po prostu trzeba użyć text-weight-normal, text-weight-boldi text-weight-italicklas.

Może się to zmienić aż do oficjalnego wydania stabilnego. W tej chwili to żądanie ściągnięcia nie jest jeszcze scalone w gałęzi alfa.

Zaktualizuję ten post po wydaniu Bootstrap v4.

— Ilshidur
źródło

Och, to słodkie! Czy możesz poprawić swoją odpowiedź, aby wspomnieć, że stanie się to w Bootstrap 4, i dodać rozwiązanie dla bieżących wersji (używając lub po prostu tworząc własną klasę)? W takim razie zaznaczę twoją odpowiedź.

— Ionică Bizău

Również (w Bootstrap 4) możesz dodać sugerowaną klasę ("font-weight-bold") do <input/>pól, a tekst w środku stanie się pogrubiony. Używamy tego z polami tytułu, aby je podkreślić, gdy jest to konieczne. Testowane w systemie Windows x64 w przeglądarce Chrome w wersji 76 i IE11.

— timmi4sa

Fajny, fajny człowiek. To działa!!! Próbowałem pogrubić treść, dodając styl ręcznie do pliku css, ale tak się nie stało. Wtedy znalazłem twoją odpowiedź: D

— Travis Le

93

Znalazłem to na stronie Bootstrap , ale tak naprawdę nie jest to klasa Bootstrap, to tylko HTML.

<strong>rendered as bold text</strong>

— Brett Merrifield
źródło

3

Co więcej strong, niekoniecznie oznacza pogrubienie. Z developer.mozilla.org/en-US/docs/Web/HTML/Element/strong : „Zazwyczaj ten element jest renderowany domyślnie przy użyciu pogrubionej czcionki. Nie należy go jednak używać po prostu do stosowania pogrubionego stylu; użyj W tym celu właściwość CSS font-weight. "

Mocne jest mocne, pogrubione to pogrubione :( Odpowiedź @GurgenHakobyan powinna być zdecydowanie preferowana.

— MattAllegro

To pochodzi z dawnych czasów, kiedy nie było CSS. Ze względu na rozdzielenie wzorców projektowych, CSS został wymyślony, aby uniknąć mieszania treści i prezentacji zarówno w HTML. Chociaż przeglądarki internetowe nadal obsługują tę funkcję w celu zapewnienia kompatybilności wstecznej, zdecydowanie odradza się używanie i , i itp. En.wikipedia.org/wiki/Cascading_Style_Sheets

— Wildhammer

49

W Bootstrap 4 :

class="font-weight-bold"

Lub:

<strong>text</strong>

— Jeremy Lynch
źródło

39

Utwórz w swoim Site.css (lub w innym miejscu) nową klasę o nazwie na przykład .font-bold i ustaw ją na swój element

.font-bold {
  font-weight: bold;
}

— Gurgen Hakobyan
źródło

8

Odradzałbym to, znaczniki mają być semantyczne, w ten sposób: .some-funkcjonalny-opis-elementu {font-weight: bold}. Zamiast po prostu używać klasy o nazwie jak kawałek css, po prostu użyj style = "font-weight: bold;", bardziej uczciwie jest być szybkim i brudnym.

— cmc

23

Jest to idealne rozwiązanie i tak samo semantyczne, jak wiele innych klas Bootstrap, takich jak .text-uppercase lub .list-unstyled. Style wbudowane mogą stać się koszmarem zarządzania, na przykład jeśli później zdecydujesz, że wszystkie pogrubione elementy powinny mieć inny kolor lub mieć efekt tekstowy. Zajęcia ułatwiają to zadanie i to jest najlepsza odpowiedź.

— Andy Mehalick

Zgadzam się z Andym tutaj. To poprawnie odpowiada na pytanie. Istnieją ważne przypadki użycia, w których użycie uogólnionych klas zapewniłoby najczystsze wyjście HTML, gdy używane są generatory, zestawy narzędzi i szablony.

— dperish

To jest właściwe rozwiązanie dla bootstrap <4. Celem strong nie jest pogrubianie tekstu , przeglądarki robią to, ponieważ konwencja to pogrubiony tekst z silnym naciskiem. Znacznik HTML musi mieć znaczenie semantyczne, a nie tylko istnieć do celów projektowych. W rzeczywistości nie jest cytowany w rekomendacji W3, a nawet b nie należy ufać, że jest odważny .

— Andre Figueiredo

1

To jest nieaktualne w bootstrap 4

— toddmo

8

W Bootstrap 4 możesz użyć:

<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>

— danramzdev
źródło

2

Powinieneś użyć zmiennych bootstarp, aby kontrolować grubość czcionki, jeśli chcesz bardziej dostosowaną wartość i / lub postępujesz zgodnie ze schematem, który należy powtórzyć; Zmienne są używane w całym projekcie jako sposób na centralizację i udostępnianie powszechnie używanych wartości, takich jak kolory, odstępy lub stosy czcionek;

całą dokumentację można znaleźć pod adresem http://getbootstrap.com/css .

— maioman
źródło