Jak používat selektor ID v CSS

Duben 25, 2024

V několika posledních tutoriálech jsme diskutovali dva ze tří typů pravidel CSS. Prvním typem je selektor HTML, který je založen na a řídí styl odpovídající značky HTML. Druhým typem je selektor třídy, který funguje jako obecný styl, který lze použít na jakýkoli prvek na webové stránce.

Nyní je čas diskutovat o třetím typu pravidla CSS, které se nazývá selektor ID. Stejně jako u voliče třídy lze volič ID použít na jakýkoli prvek na webové stránce. Měl by se však na stránce použít pouze jednou. Díky tomu je selektor ID velmi užitečný pro dynamické HTML a JavaScript. Teoreticky, pokud používáte selektor ID více než jednou na stránce, by měl následující prohlížeč webový prohlížeč ignorovat. To však není vždy pravda. Je velmi obtížné spoléhat se na předvídatelnost webových prohlížečů. Proto, pokud se rozhodnete použít selektor ID, buďte opatrní, abyste jej použili pouze jednou. Pojďme se podívat na příklad.

Základní kód

. . .

Příklad

. . .

Selektor ID

Uvnitř značek si všimnete, že volič ID začíná symbolem hash (#), a za ním následuje jméno, které přiřadíte voliči ID. Stejně jako u selektoru třídy můžete použít libovolný název, ale nejlepší je, pokud název označuje, pro který bude selektor ID použit. V tomto příkladu jej používáme k identifikaci speciální části textu.

{hodnota majetku;}

Uvnitř značek za selektorem ID následuje jeden nebo více párů hodnot vlastností, které jsou umístěny mezi složenými závorkami. Tyto páry vlastností a vlastností nastavují vlastnosti stylu. V příkladu bude mít odstavec s voličem speciálního_textového ID červený text.

. . .

Při použití selektoru ID v těle webové stránky použijete atribut id v úvodní značce HTML. Hodnota atributu id je jedinečný název přidělený selektoru ID, v tomto případě „special_text“. (id = "value") Takto volič „připojuje“ styl k jedné značce HTML, na kterou chcete styl použít. Ve výše uvedeném příkladu bude selektor ID umístěn uvnitř pouze jednoho

na webové stránce. Jakékoli jiné značky HTML na webové stránce by neměly obsahovat selektor ID uvnitř úvodní značky.

Video Návody: CSS font-size property | Intro to HTML/CSS: Making webpages | Computer Programming | Khan Academy (Duben 2024).

Jak používat selektor ID v CSS, HTML, typy pravidel CSS, jak používat selektor ID, selektor ID CSS

Předchozí Článek

Následující Článek

Související Články

počítače

Štítky produktů Avery® Marketing Solutions

Duben 2024

Miluji kancelářské potřeby, papír a umělecké a řemeslné obchody. Když jsem nakupoval poštovní štítky v jednom z kancelářských supermarketů druhý den, rozhlédl jsem se po tom, co je nového. Našel jsem...

počítače

Přizpůsobení značek HTML pomocí pravidel CSS - selektor HTML

Duben 2024

Jedním z důvodů, proč je CSS tak populární, je univerzálnost, kterou dává značkám HTML. Ačkoli nemůžete "vypnout" vestavěné ovládací prvky značky, můžete do značek HTML přidat další ovládací prvky,...