Встановлюйте шрифт за допомогою класів Bootstrap


129

Чи існує який-небудь клас завантаження Twitter font-weight: boldта інші значення font-weight?

Я б не створив нову, якщо це вже існує в Bootstrap.


5
Класу немає, потрібно налаштувати власний.
— Маноз

2
так, немає окремого класу для
— Шрифтової

Відповіді:


54

EDIT 2 (остаточний): Відповідно до документації завантажувальної програми 4 , class="font-weight-bold"це те, що ви шукаєте.


РЕДАКТУВАННЯ: Ви можете використовувати, class="font-weight-bold"як показано тут (Bootstrap 4 alpha).

Оригінальну відповідь я зберігав нижче для наочності.


Я публікую цю відповідь, оскільки ця тема, мабуть, має багато відвідувачів, але вона не мала належного рішення для вирішення цього питання. Але скоро з'явиться спосіб із Bootstrap 4:

У цьому GitHub запиту тягнути шоу, ви просто повинні використовувати text-weight-normal, text-weight-boldі text-weight-italicкласи.

Це може змінитися до офіційного стабільного випуску. На цю дату написання цього запиту на виклик ще не об'єднано в альфа-гілці.

Я оновлю цю посаду, як тільки Bootstrap v4 буде випущений.


О, це мило! Чи можете ви покращити свою відповідь, щоб зазначити, що це відбудеться у Bootstrap 4, і додати рішення для поточних версій (або використовуючи, <strong>і просто створюючи власний клас)? Тоді я відзначу вашу відповідь.
— Ionică Bizău

Також (у Bootstrap 4) ви можете додати запропонований клас ("шрифт-вага-жирний") у <input/>поля, і текст всередині стане жирним. Ми використовуємо це з полями Title, щоб підкреслити їх, коли це необхідно. Тестовано в Windows x64, в Chrome ver76 та IE11.
— timmi4sa

Класна, класна людина. Це працює!!! Я намагався зробити вміст жирним, додавши стиль вручну до файлу css, але цього просто не сталося. Тоді я знайшов вашу відповідь: D
— Тревіс Ле

93

Я знайшов це на веб-сайті Bootstrap , але це дійсно не клас Bootstrap, це лише HTML.

<strong>rendered as bold text</strong>

3
Крім того strong, не означає напівжирного. Від developer.mozilla.org/en-US/docs/Web/HTML/Element/strong : "Зазвичай цей елемент відображається за замовчуванням із використанням жирної ваги шрифту. Однак його не слід використовувати просто для застосування жирного стилю; використовуйте Властивість шрифту CSS для цієї мети. "

Сильний сильний, сміливий - сміливий :( Відповідь @GurgenHakobyan має бути набагато кращим.
— MattAllegro

Це з старих часів, коли не було CSS. Через розмежування питань дизайну, CSS був винайдений, щоб уникнути змішування вмісту та презентації в HTML. Хоча веб - браузери до сих пір підтримують це для забезпечення сумісності, настійно рекомендується не використовувати <б> і <сильний>, <я> і <EM> і т.д. en.wikipedia.org/wiki/Cascading_Style_Sheets
— Wildhammer


39

Створіть у своєму Site.css (або в іншому місці) новий клас, названий, наприклад, .font-bold і встановіть його на свій елемент

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

8
Я б радив проти цього, розмітка повинна бути семантичною, як це: .some-function-description-of-the element {font-weight: bold}. Замість того, щоб просто використовувати клас, названий як трохи css, просто використовуйте style = "font-weight: bold;", це чесніше про те, що швидко n брудно.
— cmc

23
Це ідеальне рішення і настільки ж семантичне, як і багато інших класи Bootstrap, такі як .text-верхній регістр або .list-unstyled. Вбудовані стилі можуть стати кошмаром управління, наприклад, якщо згодом ви вирішите, що всі жирні елементи мають бути іншого кольору або мати текстовий ефект. Навчання класу полегшує це, і це найкраща відповідь.
— Енді Мехалік

Я згоден з Енді тут. Це правильно відповідає на питання. Існують дійсні випадки використання, коли використання узагальнених класів забезпечить найчистіший вихід HTML, де використовуються генератори, набори інструментів та шаблони.
— dperish

Це правильне рішення для завантажувальної програми <4. Мета strong - не робити текст жирним , браузери роблять це, оскільки умовно - це жирний текст із сильним наголосом. HTML-тег повинен мати смислове значення, а не просто існує для цілей дизайну. Насправді вона не цитується у рекомендації W3, і навіть b не слід покладатися на її сміливість .
— Andre Figueiredo

1
Це застаріло в завантажувальній програмі 4
— вдруге

8

На Bootstrap 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>

2

Ви повинні використовувати змінні bootstarp для керування вагою шрифту, якщо ви хочете отримати більше налаштоване значення та / або дотримуєтесь схеми, яку потрібно повторити; Змінні використовуються у всьому проекті як спосіб централізації та обміну загальновживаними значеннями, такими як кольори, пробіли або стеки шрифту;

Ви можете знайти всю документацію на веб- сайті http://getbootstrap.com/css .

Використовуючи наш веб-сайт, ви визнаєте, що прочитали та зрозуміли наші Політику щодо файлів cookie та Політику конфіденційності.
Licensed under cc by-sa 3.0 with attribution required.