Change language
Python.Engineering Wiki JavaScript Pobierz element podrzędny według tagu

JavaScript Pobierz element podrzędny według tagu

__main__ Python module | base64 Python module | code Python module | COM PHP module | dis Python module | Ev PHP module | exp | html Python module | http Python module | imp Python module | io Python module | JavaScript | keyword Python module | numbers Python module | os Python module | PS PHP module | Python functions | re Python module | site Python module | SPL PHP module | StackOverflow | struct Python module | test Python module | time Python module | UI PHP module
Michael Zippo Michael Zippo

Aby utworzyć efekt pogrubienia tekstu CSS , musisz użyć właściwości font-weight. Właściwość font-weight określa „wagę” czcionki lub to, jak pogrubiona jest ta czcionka. Możesz użyć słów kluczowych lub wartości liczbowych, aby poinstruować CSS, jak pogrubiony powinien być fragment tekstu.

Jako programiści, projektując stronę internetową, czasami chcemy zwrócić na coś uwagę . Możemy to zrobić na kilka sposobów. Najprostszym sposobem jest zwiększenie wagi znaków tekstu, który chcesz wyróżnić. Odnosi się to do pogrubienia tekstu.

W tym artykule omówimy czcionkę wagi, jak ją zdefiniować i przedstawimy ilustrację różnych możliwych wartości właściwości.

CSS Fat: przewodnik

Zestawy właściwości font-weight określają, jak pogrubiony tekst powinien być wyświetlany na ekranie. Możesz użyć słów - kluczy lub wartości liczbowych, aby powiedzieć CSS, jak pogrubiony tekst powinien wyglądać razem

Składnia właściwości CSS font-weight jest następująca:.

Wartość weightOfFont jest wagą czcionki, której chcesz użyć dla elementu, do którego zastosowano styl.

Właściwość font-weight akceptuje kilka różnych wartości, w zależności od grubości czcionki, którą chcesz ustawić dla konkretnego elementu.

Pogrubienie w skali CSS

Pomyśl o swojej rodzinie czcionek jako pogrubionej w skali od 100 do 1000. Im wyższa liczba, tym pogrubiony znak

Poszukaj informacji na temat swojej ulubionej rodziny czcionek. Dzięki temu będziesz mieć pewność, że wynik będzie tak lekki lub odważny, jak chcesz na swojej stronie. Niektóre rodziny czcionek nie używają pełnej skali.

Poniższy kod pokazuje, jak jasną i jak ciemną może osiągnąć popularna czcionka „Arial” przy użyciu liczb i słów — klucz:

i pogrubienie, jaśniej: co one właściwie oznaczają?

Najważniejszą rzeczą, na którą należy zwrócić uwagę, jest to, że „jaśniej i odważniej” nie jest dosłownym tłumaczeniem. Pogrubienie nie oznacza „grubszego niż pogrubienie”

Pogrubione i bardziej przejrzyste oznacza w tym kontekście, jak odważne są lub jak jasne są w stosunku do elementu nadrzędnego.Więc gdy zrobimy bardziej śmiały element potomny, będą one miały ciemniejszą czcionkę względną niż ich rodzice - to samo dotyczy jaśniejszego.

Względne wagi znaków są następujące:

td> < td> 400
Względna waga znaku < td> rzeczywista grubość czcionki
cienka 100
normalna
pogrubiony 700
ciężki 900

Możemy więc użyć czcionki weight: bold, aby ustawić th e waga czcionki akapitu tekstu do 800. Kiedy dziecko ma większą wagę względną rodzica, skorzystaj z powyższej tabeli, aby zrozumieć, jak jest gruby.

Załóżmy na przykład, że mam dziecko, które ma rodzica z czcionką o grubości 400. Jeśli umieszczę wartość czcionki dla pogrubionego dziecka, czcionka o wadze dziecka zmieni się na 700.

Dzieje się tak dlatego, że w porównaniu z dzieckiem czcionka potomna jest ciemniejsza do wagi niż rodzic. Jeśli rodzic jest już tak ciemny lub tak jasny, jak to możliwe, te wartości właściwości ‚Ęã‚Ęãnic.

przykładowa waga czcionki CSS

Powiedzmy, że projektujesz stronę internetową dla The Seattle Stamp Club, lokalnej firmy wydawniczej. Firma znacząca, o którą poprosiliśmy, Kim jesteśmy — my, jest pogrubiona na stronie A About. To zwróci uwagę odwiedzającego na tytuł.

Klub znaczków poprosił nas o dodanie bloku tekstu do swojej strony internetowej z historią klubu. Ten blok tekstu powinien mieć normalną grubość czcionki. Niektóre frazy, na które klub chce zwrócić uwagę widza, powinny być pogrubione

Moglibyśmy użyć następującego kodu do utworzenia tego bloku tekstu, z kilkoma zalecanymi frazami:

Styl kliknięcia obraz przycisku przycisk w edytorze kodu powyżej, aby zobaczyć wynik naszego kodu HTML/CSS.

w naszym pliku HTML zdefiniowaliśmy akapit w tekście

; . tag zawarliśmy również kilka zdań w . tagi, do których zachęcamy w naszym CSS

Następnie w naszym pliku CSS zdefiniowaliśmy regułę stylu, która określa wagę stylu czcionki każdego < /a> tag pogrubiony. Oznacza to, że tekst zawarty w znaczniku jest pogrubiony niż element nadrzędny.

Kiedy uruchamiamy nasz kod, nasz akapit pojawia się z normalną szerokością czcionki, a zdania zawarte w znacznikach są wyświetlane jako pogrubione . W tym przykładzie wyrażenia witamy wszystkich i 250 członków są ujęte w tagi .

Pogrubiony tekst CSS ze zmiennymi znakami

Udostępniliśmy nam kilka nowych czcionek na najnowszym poziomie czcionek CSS. Są one nazywane znakami zmiennymi i mogą przyjmować liczbę od 1 do 1000 jako szerokość znaku. Obsługa przeglądarek nie została w pełni zaimplementowana do maja 2020 r., więc są one całkiem nowe. Jeśli chcesz uzyskać więcej informacji na temat czcionek zmiennych , zapoznaj się z tym rel = "noopener"> l ` wprowadzeniem.

Wnioski

W tym samouczku omówiliśmy Właściwość CSS font -weight i jej wpływ na pogrubienie naszych czcionek.

Nauczyliśmy się, że grubsza i lżejsza waga oznacza względną wagę czcionki w stosunku do wagi czcionki elementu nadrzędnego. Zasadniczo przyjrzeliśmy się zakres wag znaków, aby zobaczyć, jak wygląda tekst. W mgnieniu oka będziesz profesjonalistą w zakresie ważenia czcionek

Aby dowiedzieć się więcej o kodowaniu w CSS, przeczytaj nasz przewodnik jak uczyć się CSS . Możesz przeczytać nasz przewodnik na jak zrobić pogrubiony tekst w HTML, jeśli chcesz pogrubić tekst bez polegania na CSS.