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

CSS (Cascading Style Sheets), за да превежда на английски език като Cascading Style Sheets.

CSS се използва от създателите на уеб страници за задаване на цветове, шрифтове, оформление на отделните блокове и други аспекти на представянето на външния вид на тези уеб страници.
Изтеглете изходния код на тази статия може да бъде по-долу

Основната цел на развитието на CSS е разделянето на описанието на логическата структура на уеб страницата, от описанието на външния вид на уеб страницата.

С такова разделение на работата по оформлението и дизайна на сайта, може да се проведе паралелно.

Чрез използването на CSS:

- увеличава скоростта на изтегляне и намалява размера на кода на сайта

- ясен, лесен и бърз контрол на външния вид на сайта (това е достатъчно, за да редактирате един файл със стила и дизайна на необходимите документи ще се промени веднага, вместо модифициране десетки HTML, PHP уебсайт файлове)

- CSS стилове имат много повече възможности да проектират елементи на уеб страници.

За да добавите стил лист към уеб страница, има 4 начина, по които се различават по своите способности и цел.

WordPress на двигателя използва първия метод. а именно, свързани стилове - това е най-гъвкав и удобен метод за добавяне на стил към вашия сайт.

Но можете да използвате и други начини за добавяне на стилове за сайтове в WordPress.

Помислете за всички 4 начина:

С този метод се създава отделен файл с разширение обикновено CSS (като WordPress - това style.css), която описва всички параметри и външния вид на вашия сайт.

Този файл изглежда така:

След CSS файл е свързан с обекта по етикет , Този документ се намира в между маркерите и (В WordPress етикет се намира във файла header.php).

Тя изглежда по следния начин:

на сайта си, този ред изглежда така:

С този метод, можете да се свържете на CSS файла, който се намира на друго място.

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

Това означава, че там не се създава отделен файл с CSS, и цялото му съдържание се съхраняват между тагове и в кода на сайта (за сайтове с WordPress свойства стил ще се намира във файла header.php).

Ето как ще изглежда:

При този метод, имоти стил, намиращи се в тялото на индивидуален маркер (чрез своя стил атрибут). Всички правилата на този стил листове се прилагат само за съдържанието на този маркер.

При този метод, имоти стил, присъединени към мрежата на хартия с @import директиви, намиращ се в документа между таговете . което, от своя страна, са разположени в този документ между тагове и .

Този метод може да се използва заедно със съответната или глобален стил, но не и с вътрешните стилове.

Както е описано в стиловете CSS?

правила Style са написани на специален формат.

Основната идея на селектор действа - е име на стил, за които се добавят опциите за форматиране.

Общ метод за запис има следната форма (CSS не чувствителен, трансферни линии, интервали или раздели, така че формата на записа зависи от разработчика на желание):

или могат да бъдат написани на един ред:

Селектори са разделени на следните видове.

• Tag селектори (елементи)
• класове
• идентификатори
• контекстуални селектори
• Близки селектори
• селектори за деца
• атрибут селектори
• универсален селектор
• псевдо
• псевдо

Най-често използваният тип първите три селектори да ги погледнем по-подробно.

Като селектор може да бъде всеки етикет е HTML, чието форматиране се определят правила, като: цвят, фон, размер и др Правилата са посочени в следната форма.

Синтаксисът за класовете е както следва:

В първото изпълнение, клас може да се прилага на всеки маркер, а втората само до конкретна.

За да се насочи в правилното място, че маркерът трябва да се използват с определен клас до маркера в кода на сайта (PHP, HTML.) Се добавя към атрибут клас = "Името на класа."

Резултатът от този пример:

Първата алинея се подравнява спрямо ширината на текста в черно (цвят е зададен като браузър по подразбиране), и в непосредствена близост до която се прилага един клас с име цитирам - се показва в синьо и линията в ляво.

Този тип селектор е подобен на предишния, но идентификационните номера трябва да са уникални, с други думи, за да отговори на кода на даден документ само веднъж.

Синтаксисът за следващия приложен идентификатор.

В този пример, етикет, определен стил