Jak korzystać z Selektora ID w CSS

Kwiecień 30, 2024

W ostatnich kilku samouczkach omówiliśmy dwa z trzech rodzajów reguł CSS. Pierwszy typ to selektor HTML oparty na stylu pasującego znacznika HTML i kontrolujący go. Drugi typ to selektor klasy, który działa jak ogólny styl, który można zastosować do dowolnego elementu na stronie internetowej.

Czas porozmawiać o trzecim typie reguły CSS, która nazywa się selektorem identyfikatorów. Podobnie jak w przypadku selektora klasy, selektor ID można zastosować do dowolnego elementu na stronie internetowej. Jednak należy go używać tylko raz na stronie. To sprawia, że selektor ID jest bardzo przydatny w przypadku dynamicznego HTML i JavaScript. Teoretycznie, jeśli używasz selektora ID więcej niż raz na stronie, kolejne powinny zostać zignorowane przez przeglądarkę internetową. Jednak nie zawsze tak jest. Bardzo trudno jest polegać na przewidywalności przeglądarek internetowych. Dlatego wybierając opcję wyboru identyfikatora, pamiętaj, aby użyć go tylko raz. Spójrzmy na przykład.

Kod podstawowy

. . .

Przykład

. . .

Selektor ID

Wewnątrz tagów zauważysz, że selektor ID zaczyna się od symbolu skrótu (#), a następnie następuje nazwa przypisana do selektora ID. Podobnie jak w przypadku selektora klasy, możesz użyć dowolnej nazwy, ale najlepiej, jeśli nazwa wskazuje, do czego będzie używany selektor ID. W tym przykładzie używamy go do identyfikowania specjalnej sekcji tekstu.

{wartość nieruchomości;}

Również wewnątrz znaczników po selektorze ID występuje jedna lub więcej par właściwości i wartości, które są umieszczone między nawiasami klamrowymi. Te pary właściwości i wartości określają cechy stylu. W tym przykładzie akapit z selektorem ID_tekstu specjalnego będzie miał tekst w kolorze czerwonym.

. . .

Gdy użyjesz selektora ID w treści strony, użyjesz atrybutu id w otwierającym tagu HTML. Wartością atrybutu id jest unikalna nazwa nadana selektorowi identyfikatora, w tym przypadku „tekst specjalny”. (id = „wartość”) W ten sposób selektor „łączy” styl z tym jednym znacznikiem HTML, do którego chcesz zastosować styl. W powyższym przykładzie selektor ID zostanie umieszczony tylko w jednym

tag na stronie internetowej. Wszelkie inne tagi HTML na stronie internetowej nie powinny zawierać selektora ID w tagu otwierającym.

Instrukcje Wideo: Frontend 006: Klasy w CSS (Kwiecień 2024).

Jak korzystać z Selektora identyfikatorów w CSS, HTML, typy reguł CSS, jak korzystać z Selektora identyfikatorów, Selektor identyfikatorów CSS

Poprzedni Artykuł

Następny Artykuł

Powiązane Artykuły

komputery

Wix Editor - wybory w tle

Kwiecień 2024

Podczas tworzenia strony internetowej za pomocą edytora Wix zaczniesz od gotowego szablonu lub pustego szablonu. Stamtąd zaczniesz dostosowywać, jak chcesz, za pomocą menu edytora po lewej stronie...

komputery

Instalowanie Java dla programowania

Kwiecień 2024

W tym artykule wyjaśniono, jak zainstalować narzędzia programistyczne Java. Jeśli chcesz korzystać z języka Java w celu uruchamiania programów i apletów Java, sprawdź Javę dla użytkowników -...