CSS селектори в HTML5

Съдържание
Селекторите CSS се използват за идентифициране на кои елементи HTML върху тях ще бъде поставен определен стил, за това можем да използваме етикета стил или външен стилов лист. Нека си представим за момент, че искаме да поставим определен аспект в нашия документ, за това трябва да разработим стилове, но за да не повтаряме кода, идеалното нещо е да използваме стиловете за селекторите, например ако искаме всички връзки към елемента да се са с определен цвят, бихме използвали стиловете със селектора по тип.
Този селектор засяга всички елементи на документа, въпреки че е най -фундаменталният селектор, той не се използва широко, тъй като обхватът му е много широк.
Нека да видим малък пример за това как работи:
 Пример

Обичам ябълки и портокали.

Посетете уебсайта на W3C

Както можем да видим в примера, ние казваме на стила с универсалния селектор, че всички елементи ще имат черна рамка тънко твърдо вещество, това дава следния резултат:

Виждаме, че стилът е приложен към всички елементи, това не е много приятно за разглеждане в момента, но върши работата.
С този тип селекция можем да избираме и прилагаме стил към всички елементи от определен тип, по този начин можем да бъдем общи, без да сме толкова широки, колкото с универсалния селектор, който видяхме по -рано.
Нека работим със следния пример:
 Пример

Обичам ябълки и портокали.

Посетете уебсайта на W3C

Както виждаме, използваме типа елемент да се Към което ще добавим черната граница, върху която работихме в урока, нека видим как изглежда на екрана:

Резултатът е малко по -добър от този, генериран с универсалния селектор, тъй като в този случай само връзките имат черна рамка.
Ами ако сега искаме да приложим стил, но само към определени елементи, независимо от техния тип, но не можем да го приложим към целия документ, за това можем да използваме селектора по класове, със селектора по клас можем да постигнем малко повече изключване при прилагане на стил.
Нека да видим кода:
 Пример Посетете уебсайта

Обичам ябълки и портокали.

Посетете уебсайта на W3C

В този случай решихме да приложим стила към всички елементи на класа клас 2 можем да видим в кода елемент, който има два класа, но наличието на класа, който посочваме, също ще вземе стила. С това приключваме този урок относно селекторите, препоръчваме да продължите да практикувате, комбинирайки наученото, за да можем да обогатим външния вид на нашите сайтове и да увеличим стандартите им за използване по възможно най -ефективния и опростен начин.

Така ще помогнете за развитието на сайта, сподели с приятелите си

wave wave wave wave wave