Как да използвате ID Selector в CSS

Може 4, 2024

В последните няколко урока обсъдихме два от трите типа CSS правила. Първият тип е HTML селекторът, който се основава и контролира стила за съвпадащия HTML таг. Вторият тип е селекторът на класове, който работи като общ стил, който може да се приложи към всеки елемент от уеб страницата.

Сега е време да обсъдим третия тип CSS правило, което се нарича ID селектор. Както при селектора на класове, селекторът на ID може да бъде приложен към всеки елемент на уеб страницата. Въпреки това, той е предназначен да се използва само веднъж на страница. Това прави ID селектора много полезен за динамични HTML и JavaScript. Теоретично, ако използвате селектора на ID повече от веднъж на страница, следващите трябва да бъдат игнорирани от уеб браузъра. Това обаче не винаги е така. Много е трудно да разчитаме на предсказуемостта на уеб браузърите. Ето защо, когато решите да използвате ID селектора, внимавайте да го използвате само веднъж. Нека да разгледаме един пример.

Основен код

. . .

пример

. . .

Селектор на ID

Вътре в маркерите ще забележите, че селекторът на ID започва със символа на хеш (#) и това е последвано от името, което сте присвоили на селектора на ID. Както при селектора на класове, можете да използвате всяко име, което искате, но най-добре е, ако името посочва за какво ще се използва селекторът на ID. В примера ние го използваме за идентифициране на специален раздел от текст.

{свойство: стойност;}

Също така вътре в маркерите, селекторът на ID е последван от една или повече двойки със стойност на свойствата, които са поставени между къдрави скоби. Тези двойки стойност-стойност задават характеристиките на стила. В примера, абзацът със селектора за специален идентификатор special_text ще има текст в червен цвят.

. . .

Когато използвате ID селектора в тялото на уеб страницата, ще използвате атрибута id в началния HTML маркер. Стойността за атрибута id е уникалното име, дадено на селектора на ID, в този случай "special_text". (id = "value") Ето как селекторът "свързва" стила с онзи HTML таг, към който искате да приложите стила. В горния пример, ID селекторът ще бъде поставен вътре само в един

маркер на уеб страницата. Всички други HTML маркери на уеб страницата не трябва да съдържат селектора на ID вътре в началния маркер.

Инструкции Видео: How to save inspect element changes permanent (Може 2024).

Как да използвате ID Selector в CSS, HTML, типове CSS правила, как да използвате ID селектора, CSS ID селектора

Предишна Статия

Следваща Статия

Свързани Статии

компютри

Социален маркетинг приложението ви за книги

Може 2024

От уста на уста е най-добрият начин да разберете думата за приложението или марката си за книги. Крос маркетинга във Facebook, Twitter, Pinterest, Flickr и YouTube е чудесен начин за изграждане на...

компютри

Център за обучение на Adobe KnowHow

Може 2024

кирпичR Знаеш какTM е уебсайт за видео обучение от Adobe, който стартира през 2013 г. Какво ми харесва най-много? Можете да закупите по един курс наведнъж вместо месечна такса за вашия акаунт, дори...