Jak pogrubić tekst w HTML?


153

Próbuję pogrubić tekst za pomocą HTML, ale staram się, aby to zadziałało.

Oto, czego próbuję:

Some <bold>text</bold> that I want emboldened.

Czy ktoś mógłby mi powiedzieć, co robię źle?


17
Zgadzam się, że należy najpierw wyszukać go w Google, ale myślę, że chodzi o to, że następnym razem, gdy ktoś będzie szukał google, zostanie skierowany do SO, co uważam za dobrą rzecz. Większy ruch i ludzie przychodzący na SO.
Andrija

@binfolder może chcieć powiedzieć, czy nauczył się <bold> od Google. Inna, bardziej ogólna możliwość: coraz więcej ludzi rozwija się bez szkoły i bez czytania książek. Nauczyliśmy się tego „pierwszego dnia” lub „drugiego dnia” „HTML 101”. Nie mają zaplanowanych zajęć.
John Saunders

2
@Andrija: Zgadzam się co do kierowania ich tutaj. Dlatego moja odpowiedź skierowała ich z powrotem do miejsca, w którym mogą nauczyć się odpowiedzi na następne pytanie: „jak używać kursywy?”
John Saunders,

Odpowiedzi:


222

użyj <strong>lub <b>tag

możesz też spróbować z css <span style="font-weight:bold">text</span>


53

HTML nie ma <bold>tagu, zamiast tego musiałbyś użyć <b>. Należy jednak pamiętać, że używanie <b>jest odradzane na rzecz CSS na chwilę teraz . Lepiej byłoby użyć CSS, aby to osiągnąć.

<strong>Tag jest semantyczny element silnym naciskiem która domyślnie na pogrubioną.


2
+1 b to HTML 4, nigdy nie powinno być mocne / CSS to najlepszy sposób
googletorp

<b> nigdy nie został wycofany. Zalecane przeciwko na rzecz <em>, <strong>, <h1..6> itp., Tak; przestarzałe, nie.
Noah Medling

Dlaczego warto <b>odradzać używanie CSS? To jakby powiedzieć, używając <h* n* >jest odradzane na rzecz CSS. Jest w standardzie, więc używaj go.
Gumbo,

Gumbo: z w3.org/TR/html4/present/graphics.html#h-15.2.1 - „Poniższe elementy HTML określają informacje o czcionkach. Chociaż nie wszystkie z nich są przestarzałe, odradza się ich używanie na rzecz arkuszy stylów”.
Joey

1
Właściwie te elementy powracają w HTML 5 jako „elementy frazowe” - na przykład <small> symbolizuje drobny druk, podczas gdy <b> ma być używane w tytułach książek.
DisgruntledGoat

21

Sposób oznaczania:

<strong>I'm Bold!</strong> and <b>I'm Bold Too!</b>

Sposób stylizacji:

.bold {
  font-weight:bold;
}

<span class="bold">I'm Bold!</span>

Od: http://www.december.com/html/x1/

<b>

Ten element zawiera tekst, który powinien być renderowany przez przeglądarkę jako pogrubiony. Ponieważ znaczenie elementu B definiuje wygląd zawartej w nim treści, element ten jest uważany za „fizyczny” element znacznika. W związku z tym nie przekazuje znaczenia semantycznego elementu znacznika, takiego jak strong.

<strong>

Opis Ten element zawiera tekst w nawiasach, który powinien być mocno podkreślony. Silniejszy niż element em.


3
strongto nie to samo co b.
Gumbo,

8
Nigdy nie powiedziałem, że tak.
Sampson

12

W HTML użyj:

  • Jakiś <b>tekst, </b>który chcę ośmielić.
  • Jakiś <strong>tekst, </strong>który chcę ośmielić.

W CSS użyj:

  • Jakiś <span style="font-weight:bold">tekst, </span>który chcę ośmielić.

7

Czy ktoś mógłby mi powiedzieć, co robię źle? ”

„Pogrubienie” nigdy nie było elementem HTML („b” jest najbliższym odpowiednikiem).

HTML powinien zawierać ustrukturyzowaną treść; CSS wydawcy powinien sugerować style dla tej treści. W ten sposób oprogramowanie klienckie może udostępniać ustrukturyzowaną treść za pomocą przydatnych stylów i elementów sterujących nawigacją użytkownikom, którzy nie widzą sugerowanego przez Ciebie odważnego stylu (np. Użytkownicy wyszukiwarek, całkowicie niewidomi użytkownicy korzystający z czytników ekranu, słabo widzący użytkownicy używający własnych kolorów i czcionek, doświadczeni użytkownicy korzystający z przeglądarek tekstowych, użytkownicy przeglądarek sterowanych głosem, takich jak Opera na Windows). Dlatego właściwy sposób pogrubienia tekstu zależy od tego , dlaczego chcesz nadać mu styl pogrubiony. Na przykład:

  • Chcesz odróżnić nagłówki od innego tekstu? Użyj elementów nagłówka (od „h1” do „h6”) i zasugeruj ich pogrubiony styl w swoim CSS („h1, h2, h3, h4, h5, h6 {font-weight: bold;}”.

  • Chcesz odświeżyć etykiety dla pól formularza? Użyj elementu „label”, powiąż go programowo z odpowiednim elementem „select”, „input” lub „textarea”, nadając mu atrybut „for” pasujący do atrybutu „id” w miejscu docelowym, i zasugeruj pogrubiony styl dla to w swoim CSS ("label {font-weight: bold;"}).

  • Chcesz ośmielić nagłówek dla grupy powiązanych pól w formularzu, na przykład grupy opcji radiowych? Otocz je elementem „fieldset”, nadaj mu element „legend” i zasugeruj pogrubiony styl w swoim CSS („legend {font-weight: bold;}”).

  • Chcesz odróżnić podpis tabeli od podpisów tabeli? Użyj elementu „caption” i zasugeruj jego pogrubiony styl w swoim CSS („caption {font-weight: bold;}”).

  • Chcesz odróżnić nagłówki tabeli od komórek danych tabeli? Użyj elementu „th” i zasugeruj jego pogrubiony styl w swoim CSS („th {font-weight: bold;}”).

  • Chcesz odróżnić tytuł filmu lub albumu, do którego są odniesienia, od otaczającego go tekstu? Użyj elementu „cite” z klasą („cite class =„ movie-title ”) i zasugeruj jego pogrubiony styl w swoim CSS („ .movie-title {font-weight: bold;} ”).

  • Chcesz odróżnić zdefiniowane słowo kluczowe od otaczającego go tekstu, definiując je lub wyjaśniając? Użyj elementu „dfn” i zasugeruj jego pogrubiony styl w swoim CSS („dfn {font-weight: bold;}”).

  • Chcesz odróżnić kod komputerowy od otaczającego go tekstu? Użyj elementu „code” i zaproponuj jego pogrubiony styl w swoim CSS („code {font-weight: bold;}”).

  • Chcesz odróżnić nazwę zmiennej od otaczającego tekstu? Użyj elementu „var” i zaproponuj jego pogrubiony styl w swoim CSS („var {font-weight: bold;}”).

  • Chcesz wskazać, że jakiś tekst został dodany jako aktualizacja? Użyj elementu „ins” i zaproponuj jego pogrubiony styl w swoim CSS („ins {font-weight: bold;}”).

  • Chcesz lekko podkreślić tekst („ Kocham kocięta!”)? Użyj elementu „em” i zasugeruj jego pogrubiony styl w swoim CSS (np. „Em {font-weight: bold;}”).

  • Chcesz mocno podkreślić jakiś tekst, na przykład jako ostrzeżenie („ Strzeż się psa! ”)? Użyj elementu „strong” i zasugeruj jego pogrubiony styl w swoim CSS (np. „Strong {font-weight: bold;}”).

… Masz pomysł (miejmy nadzieję).

Nie możesz znaleźć elementu HTML z odpowiednią semantyką, aby wyrazić / dlaczego / chcesz pogrubić ten konkretny tekst? Umieść go w ogólnym elemencie „span” i nadaj mu zrozumiałą nazwę klasy, która będzie wyrażać Twoje uzasadnienie dla odróżnienia tego tekstu („<span class =" lede "> Zacznę ten artykuł od zdania podsumowującego. </ Span >) i zasugeruj pogrubiony styl w swoim CSS (".lede {font-weight: bold;"}. Przed utworzeniem własnych nazw klas możesz sprawdzić, czy istnieje mikroformat (microformats.org) lub wspólna konwencja tego, co chcesz wyrazić.


Podsumowując {link_to_HTML_element {font-weight: bold; }}
James H

6

Element HTML definiuje pogrubiony tekst, bez dodatkowego znaczenia.

<b>This text is bold</b>

Element HTML definiuje mocny tekst, z dodanym semantycznym „silnym” znaczeniem.

<strong>This text is strong</strong>

5

Inną opcją jest zrobienie tego przez CSS ...

Np. 1

<span style="font-weight: bold;">Hello stackoverflow!</span>

Np. 2

<style type="text/css">
    #text
    {
        font-weight: bold;
    }
</style>

<div id="text">
    Hello again!
</div>

4

Już prawie koniec!

Aby uzyskać pogrubiony tekst, powinieneś mieć to: <b> bold text</b>lub <strong>bold text</strong>Mają ten sam wynik.

Przykład roboczy - JSfiddle


2
To pytanie zostało faktycznie zadane siedem lat temu i ma już rozwiązanie (poprawna odpowiedź została zamieszczona 3 minuty po jej zadaniu). Twoja odpowiedź tak naprawdę nie dodaje niczego pożytecznego. Jeśli chcesz znaleźć problemy, które nie zostały jeszcze rozwiązane, wpisz answers:0w pole wyszukiwania u góry, które wyświetli listę wszystkich pytań, na które nie ma odpowiedzi.
Pan Lister,

1
@MrLister IMO link do JSfiddle jest całkiem przydatny.
Χpẘ

3

Po prostu <b>zamiast <bold>:

Some <b>text</b> that I want bolded.

Zwróć uwagę, że <b>zmienia tylko wygląd tekstu. Jeśli chcesz uczynić go pogrubionym, ponieważ chcesz wyrazić silny nacisk, lepiej użyj tego <strong>elementu .


2

Myślę, że prawdziwa odpowiedź to http://www.w3schools.com/HTML/default.asp .


2
Dokładnie. Jeśli nie wiesz, jak pogrubić tekst w HTML i nie wiesz, jak się tego dowiedzieć, musisz zacząć od lekcji 1.
myplacedk

2
@Gareth: Co uważasz za niewłaściwe w w3schools i co uważasz za właściwą odpowiedź dla kogoś, kto nie zna HTML-a dnia pierwszego? Ok, może drugi dzień, jeśli są krótkie.
John Saunders

To był jeden z nielicznych przypadków, kiedy poleciłem w3schools. Żyj i ucz się.
John Saunders,
Korzystając z naszej strony potwierdzasz, że przeczytałeś(-aś) i rozumiesz nasze zasady używania plików cookie i zasady ochrony prywatności.
Licensed under cc by-sa 3.0 with attribution required.