ИнтернетУеб дизайн

CSS-селектор, и ролята му в форматиране на HTML документ

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

Видове селектори в CSS

В зависимост от това, към които се прилага HTML форматирани елемента, CSS-селектор може да се отнася към една от следните групи:

  • селектор етикет;
  • селектор клас;
  • ID-селектор;
  • атрибут селектор.

селектор Tag

Тя се нарича още "селектор тип" или "елемент", това е най-простите и често. Както си CSS-документ са имената на елементите на HTML-файл, който ще опишем. Например, ако ние трябва да зададете стил на абзац, ние уточни свойствата и техните стойности за п елемент {фон: X; цвят: Y; площ: Z}. В този случай, всички точки на уеб страницата, ще имат същия формат (цвета на фона, размера на текста, и така нататък. Г.).

селектор клас

И какво, ако трябва да попитате всеки си точка се различава от другите стилове? За да направите това, има селектор клас.

CSS-документ в този случай ще съдържа запис на следната форма: p.first {цвят: X; шрифта: у}. По този начин, ние определяме качествата на "цвят" и "размер" само за първа класа параграф.

В HTML-документ в този случай навлезе в клас атрибут на името на стила на първо място. Уроци могат да бъдат толкова, колкото и стила, който искате да кандидатствате за дадена уеб страница елементи.

Selector идентификатор

Често е необходимо да се определи по-точно стил, например на всеки един от елементите на страницата, или да ги опитате. В тази ситуация, помощта идва ID-селектор. Файлът с HTML зададете желаното име на елемент, който го идентифицира сред останалите. Например, елементите, които искаме да зададете различно от друг стил ще бъде заглавието на статията.

След това в HTML-документ задаване на идентификатора h1 глава, като articlename. И в CSS-файл, уточни стил, добавяйки към решетката на име ID: #articlename {цвят: син; текст-приравни: център}. Сега нашата заглавие ще има син цвят и центрира.

Всеки един от посочените по-горе видове може да бъде описан като "прост CSS-селектор". Те определят форматирането за определен параметър на HTML-документ: заедно подобни елементи (например, всички точки от статията), един клас (например, само първия параграф) или определена точка (например заглавието на статията).

атрибут селектори

В допълнение към по-горе, има CSS-селектори атрибути - по-сложен метод за стилове на приложения. Тя позволява на HTML елементи формат на избрания атрибут или стойност. Има няколко разновидности на този селектор:

  • от наличието на атрибута;
  • в точното му стойност;
  • чрез частична стойност атрибут;
  • на своята конкретна стойност.

Нека разгледаме всеки един от тези видове:

  1. Първият случай. Форматиране се прилага, ако присъства в определен атрибут HTML-код (тя може да бъде р, DIV, глава и т.н.). Ако не е, тя използва общ за всички елементи на стил. Например, за елементите с заглавието (инструмент върха).
  2. Вторият случай. Стилът се отнася само за HTML-елементи, които имат съвпадение на стойностите на атрибутите. Например, за да вход елементите, където стойността на атрибута тип равнява на бутона.
  3. Третият случай. Под формата ще включва само елементи от списъка на ценностите, които има определена дума. Например, Sidebar атрибут "клас" за елементи DIV.
  4. Четвъртият случай. Стил се определя само за тези елементи на HTML-документ, чийто конкретен атрибут има определена стойност, и започва с него. Например, използването на определен цвят на всички елементи, които език атрибут на английски (който може да ен, ан-Rus, ен-о и т. Г.).

По този начин, с помощта на една или друга страна, за избор на CSS, може най-добре да се посочи като една цяла уеб страница, и да опише някои от нейните елементи.

Similar articles

 

 

 

 

Trending Now

 

 

 

 

Newest

Copyright © 2018 bg.birmiss.com. Theme powered by WordPress.