Ако предлагате частни уроци, може да рекламирате услугите си напълно безплатно!
Урок за начинаещите в CSS
В css може да предифинирате оригиналните тагове като body, td, h1, texarea, select, div, span и всички други. Удобно е за да зададете стила на текста в целия html документ например:
body {
css стилове определящи размер, шриф, цвят на текста.
}
Може също така да дефинирате собствени стилове. Например искаме да направим отделен стил за менюто със специфичните css стилове. Избираме си име "main_menu" примерно. В html кода е class="main_menu" там където искате да се приложи стила.
съдържание на менюто
А css кода трябва да изглежда така:
.main_menu {
css стилове за менюто
}
Ето таблица с някой от основните css стилове.
|
Име |
Тип |
Обяснение |
Стойност |
|
Font-size |
шрифт |
С тази команда контролирате размера на текста. |
Числена стойност за да определяте размера. |
|
Font-weight |
шрифт |
С тази команда може да направите текста нормален, дебел или тънък. |
Normal, Bold, Bolder, Lighter |
|
Font-style |
шрифт |
Може да използвате това, това за да направите текста наклонен. |
Normal, italic, oblique |
|
Font-Family |
шрифт |
Наглася шрифта на текста |
Arial, Veranda или други стандартни шрифтове |
|
Color |
текст |
Определя цвета на текста |
16тичен код: #FFFFFF (бяло) |
|
Text-decoration |
текст |
Добавя подчертаване на текст |
none, underline, blink, overline |
|
Word-spacing |
текст |
Контролира разстоянието м/у буквите |
normal, или цифрена стойност |
|
Text-transform |
текст |
Може да преобразува буквите в главни или малки |
none, capitalize, uppercase, lowercase |
|
text-align |
текст |
Определя на къде да е подреден текста. |
Left, Right, Center, Justify |
|
Text-indent |
текст |
Колко на вътре е отместен текста от първия ред. |
0 или някаква числена стойност |
|
Background-color |
фон |
Цвят на фона |
16тичен код: #FFFFFF (бяло) |
|
background-image |
фон |
Наглася картинка за фон |
none, url(път/до/картинката) |
|
background-repeat |
фон |
Контролира как се повтаря фоновата картинка |
repeat, repeat-x, repeat-y, no-repeat |
За пример ще направим class а име "background".
.background {
background: #ffffff; - цвета на фона ще е бял
border-color: #F9F9F9; -цвета на контура ще е светло сив.
border-style: solid; - контура ще е непрекъсната линия
boder-width: 2px; - ширината на контура ще е 2пиксела
color: #000000; - цвета на текста ще е черен
text-decoration: blink; - текста ще мига
font-family: veranda; - за шрифт ще се използва "Verdana"
}
CSS е доста прост, прочетете няколко урока още, опитайте сами и много бързо ще се научите.
Коментари