CSS2

Background
Background Background-attachment Background-color Background-image Background-position Background-repeat
Border
Border Border-bottom Border-bottom-color Border-bottom-style Border-bottom-width Border-color Border-left Border-left-color Border-left-style Border-left-width Border-right Border-right-color Border-right-style Border-right-width Border-style Border-top Border-top-color Border-top-style Border-top-width Border-width
Classification
Classification Clear Cursor Display Float Positon Visibility
Dimension
Dimension Height Line-height Max-height Max-width Min-height Min-width Width
Font
Font Font-family Font-size Font-size-adjust Font-stretch Font-style Font-variant Font-weight
Generated Content
Generated Content Content Counter-increment Counter-reset Quotes
List and Marker
List List-style List-style-image List-style-position List-style-type
Margin
Margin Margin-bottom Margin-left Margin-right Margin-top
Outline
Outline Outline-color Outline-style Outline-width
Padding
Padding Padding-bottom Padding-left Padding-right Padding-top
Positioning
Positioning Bottom Clip Left Overflow Position Right Top Vertical-align Z-index
Table
Table Border-collapse Border-spacing Caption-side Empty-cells Table-layout
Text
Text Color Direction Line-height Letter-spacing Text-align Text-decoration Text-indent Text-transform White-space Word-spacing
Pseudo-classes
Pseudo-classes Active Focus Hover Link Visited First-child Lang
Pseudo-elements
Pseudo-elements First-letter First-line Before After
!important

## CSS 2

### Типове CSS правила

HTML селектор. Текстовата част на HTML тага се нарича селектор. Например h1 е селектор за тага <h1>. HTML селекторът се използва в CSS правилото за предефиниране на начина на визуализиране на тага.

Клас. Класът представлява "свободно" правило, което може да бъде приложено към всеки HTML таг и към множество HTML тагове.

ID индификатор. Правилата за идентификатори се могат да бъдат прилагани към всеки HTML таг, обаче, обикновено се прилагат еднократно.

### Части на CSS правилата

CSS синтаксисът е съставен от 3 части: селектори, свойства и стойности.
selector {property: value}

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

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

Стойностите се присвояват на свойство за дефениране на неговата същност.

body {color: black}
Бележка: Ако стойността е няколко думи се загражда в кавички.
p {font-family: "sans serif"}
Бележка: Ако искаме да зададем повече от едно свойство, трябва да ги разделим със точка и запетая.
p {text-align:center; color:red;}
За да се направи дефиницията по четлива, поставяме всяко свойство на отделен ред.
p { text-align: center; color: black; font-family: arial; }

### Групиране

Селекторите могат да се групират. Всеки селектор се отделя със запетая.
h1,h2,h3,h4,h5,h6 { color: green; }

### Селектор CLASS

С класа селектор може да се дефинират различни стилове за едни и същи HTML елементи.
p.right {text-align: right} p.center {text-align: center}
<p class="right"> This paragraph will be right-aligned. </p> <p class="center"> This paragraph will be center-aligned. </p>
За да се зададат няколко класа на един елемент, синтаксиса е следният:
<p class="center bold"> This is a paragraph. </p>
Може също да се пропусне името на тага в селектора, за да се дефинира стил, който може да бъде използван от всички HTML елементи.
.center {text-align: center}
<h1 class="center"> This heading will be center-aligned </h1> <p class="center"> This paragraph will also be center-aligned. </p>
Не започвайте име на клас с число. Няма да работи в Mozilla/Firefox.

### Добавяне на стилове на елементи с индивидуални атрибути

Стилът по долу ще се свърже с всички елементи, които имат type атрибут със стойтост text.
input[type="text"] {background-color: blue}

### Селектор ID

Може да се дефинира стил за HTML елемент със селектор ID. Селекторът ID се определя с #.
#green {color: green}
p#para1 { text-align: center; color: red }
Не започвайте ID селектор с число. Няма да работи в Mozilla/Firefox.

### CSS коментари

/* This is a comment */ p { text-align: center; /* This is another comment */ color: black; font-family: arial }
Back To Top

Copyright © 2007 RARO Design & Develop