Модели за начинаещи

Всички обекти се съхраняват в продължение на най-малко два стълба: HTML и CSS. Основите на HTML, ние вече обсъждат, сега е ред и на CSS. Какво е това "животно" и за какво се яде?

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

След това излезе с да използвате HTML само за описание на структурата и как да се направи по - направи отделна единица - CSS.

Защо просто живот стил?

Тук е валиден: в други учебници HTML тагове изследвани Огромен брой часове. Но аз вярвам, че таговете могат спокойно да учат пътя без да натоварва. Аз ще кажа повече: в HTML кодиране, ние трябва буквално десетки етикети, които се запаметяват в курса. -)

Важен момент - не всички браузъри са еднакво полезни. Е, ако не точно, а след това има само един проблематичен браузър - това е Internet Explorer (IE). Днес има HTML5 и CSS3 стандарт. Но IE наистина няма поддръжка за тях, така че уебмастъри трябва да отидат до различни трикове, или да се откаже от новите функции на ограничения на IE. За щастие, IE дял се намалява малко по малко, а ако изведнъж за някои големи недоразумения използвате IE браузър, незабавно изтегляне всеки модерен браузър Firefox, Chrome или Opera!

атрибут STYLE

Достатъчно представяния, отиват направо в стил!

В почти всички HTML тагове има STYLE атрибута. , в която и двете публикувал с CSS стилове.

Виждаме един нормален етикет и приписват стил. Стилове имат техният синтаксис:

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

В нашия пример, като се използват SPAN низов маркер. Това е универсален етикет и стандартен той няма влияние върху дизайна.

Но в стила ни донесе този текст сочи червено (цвят: червен) и смели (шрифт тегло: получер).

Сигурен съм, че вече сте се тества този код в MaxSite CMS.

Опитайте се да приложите тези стилове към вече известни други тагове.

Методи за стилове връзка

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

Въпреки това, понякога тези стилове могат да бъдат доста тромави. Например на страницата, която искате да използвате няколко Н2-заглавки за украса. При използване на вградени стилове ние трябва да ги копирате от един дял в друг. Това не е много удобно.

За такива случаи можете да използвате предварително дефинирани стилове. Например, ние може да се определи набор от правила myred. и след това просто да го насочи в атрибутите на тага. Този атрибут се нарича класа:

myred клас самата трябва да се дефинира някъде по-рано, така че браузърът е знаел за това.

Тези стилове са посочени някъде в началото на HTML-документ с помощта на СТИЛ маркер.

В този пример, ние попита myred клас. който посочи в клас SPAN маркер.

Имайте предвид, стилове на работа sintaktis STYLE. Общата схема е както следва:

Всеки един от обектите са посочени в големи скоби. Самата синтаксис е точно същата като в стила. Но набиране - това е, което ще се прилагат свойствата.

В CSS, има няколко вида селектори. Най-лесно е за избор на маркер:

Например, можете да го направите:

Тоест, ние сме настройте свойствата маркер SPAN. И имайте предвид, че в класа вече не могат момент - тъй като браузърът прилага стилове за всички SPAN тагове.

В първия ни пример са посочили селектор "teg.klass":

IE браузър, за да приложите стил само на етикетите с определен клас.

Помислете още един пример:

Първият текст, който ще се превърне в червено, синьо втория, и в третия зелено.

При задаване на стила понякога е възможно да се пропусне маркера:

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

Къде трябва да се намират стилове

Питам стилове както правим сега не е напълно прав в тялото на записа. Браузъри нямат нищо против един такъв процес, но стандартната CSS и HTML препоръчва да го направя в самото начало на документа. От структурата на HTML страници, ние се получи малко по-късно, за сега просто не забравяйте, че MaxSite CMS с CSS стилове могат да бъдат поставени в шаблон конфигурация - решения.

Предимството на този метод е, че стилове могат да се настроят веднъж и след това се използват на всички страници на сайта.

Обърнете внимание само, че стиловете са необходими, за да се посочи, без опаковане СТИЛ - MaxSite CMS прави това автоматично.

BB-код - тези тагове

Сега обратно към Табелките HTML. Аз не съм просто казвам, че за да научите HTML е съвсем проста, особено ако сте пред очите ви има улики. )

Обмислете внимателно това ръководство и да обърнем внимание на линията BB-код HTML-представителство. Например BB код BOLD ред да маркирате Б.

Можете да зададете различни параметри, като например с CSS стилове за ББ кодове.

И след това просто да се отбележи едно важно нещо - ако използвате BB-код, няма да се наложи да използвате рамкиране HTML. MaxSite CMS сам ще се справи с всички ББ кодове и ги превръща в правилната HTML-кода.

BB-код се използва, за да се опрости конструкцията на текста. В допълнение, тези кодове не намаляват четливостта на текста, тъй като тя ще се използва HTML + CSS.

Сега обратно към стиловете. )

външни стилове

Има още един начин да се свържете с CSS стилове - от външен файл. В действителност цялата оформлението на шаблона и ще бъде в CSS-файл. В същото време, ние не трябва да се тревожи за това, защото MaxSite CMS се грижи за всички рутинни за свързване на файлове. Остава да бъде само креативни. )

Готов помощници (помощници)

В MaxSite CMS в по подразбиране-шаблон в свързан CSS-файл, които вече присъстват малки с CSS стилове, които можете да използвате, за техните нужди. Например има класове за цвета на текста:

Подобен клас може да се използва за цвета на фона:

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

Къде са MaxSite CMS файлове

Но сега трябва да разберем къде основните файлове и директории MaxSite CMS сървър (диск). Всичко е просто: основната директория заявление / maxsite /.

Съответно, по подразбиране-шаблон е в поддиректория на шаблона - в забава. Пълният път ще бъде: заявление / maxsite / шаблони / по подразбиране /. Тя вече гледа за файла.

CSS Референтен

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

Цветовете в CSS

Сега малко практика. Като средство за преподаване, помислете за някои с CSS свойства, които най-често се използват за украса на текстовете. Един от тях - цвета на цвета на текста.

Можем да видим името на цвета, както и неговото Цифровото представяне (като се започне с #). И двете от тези идеи са идентични и кой вариант да се използва, вие решавате. Най-често за основните (най-основните) цветове (червено, бяло, черно и т.н.), използвани от името на цвета. За комплекс, с дълго / сложно име - цифрово представяне.

Числовата представяне на цвят

Броят е комбинация от три цветови компоненти на R (червено), G (зелено), B (синьо). Сигурно сте чували за модела RGB. който се използва в телевизори, монитори, и т.н. Цветът, получен чрез смесване на тези три компонента. Всеки компонент може да има интензитет между 0 и 255. Например за червен: R = 255, G = 0, В = 0.

HTML кодът приет (той е изобретил програмисти;)), за да определите цвета в 16-мерното система изчисление, където 0 = 0, а 255 = FF. Не забравяйте, че по принцип, не специално значение, защото всички съвременни програми за показване на стойността на цвят незабавно във всички случаи.

Стойността на цвят се състои от три двойки, където първият е R, а вторият - G, третият - Б: #RRGGBB. Сега, гледайки към този пост ще разберете веднага какво означава.

Но това не е всичко. Можете да използвате кратък запис цвят. Той се използва в случаите, когато са сдвоени числата. Например # FF8800 могат да бъдат сведени до # F80.

Друг начин е да се използва индикация цвят RGB (). Той се използва, когато трябва да се уточни стойността в десетична бройна система:

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

Или същото в ББ кодове:

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

Ние промените стила на текста на уеб сайт

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

За цвета на текста, тъй като сме разбрали, отговаря на цвета собственост. Отидете на настройките на шаблона - Външен вид и записване:

маркер тялото е така наречената документ на тялото, т.е. всичко, което се показва на страницата е вътре в тялото. Затова Ви молим цвета на текста за него, както и всички под-елементи (тагове) автоматично ще вземе същите свойства.

При условие, разбира се, че ги в очакване.

След като запазите, можем да видим, че в основния текст на даден сайт се превърна цвят Midnightblue.

Сега нека да се справят с слушалки (удебелен) текст. шаблона по подразбиране за по подразбиране-шрифт е Verdana. В HTML често се използват така наречените сайтове безопасни шрифтове. тоест, тези шрифтове, които са инсталирани в почти всички потребители. Ето списъка:

• Arial
• Arial Черно
• Comic Sans MS
• Courier New
• Грузия
• въздействие
• Times New Roman
• Trebuchet MS
• Verdana

Крайният докосване - размерът на основния текст. Той използва свойството на шрифта. могат да бъдат използвани Дяловете на измерваните стойности:

• pt - обичайните типографски елементи
• пиксела - височина в пиксели
• % - процент на основния размер
• ем - процент на само на предварително определен диапазон от 0 до 1.

Стандартно в неизпълнение настроен модел 11pt резолюцията на. Промяна в 14pt:

При внасянето на шаблон, а след това един от първите действия, ще бъде индикация за тези с CSS свойства за тялото. Опитайте търсене в CSS имота прави текст курсив. Това е, така да се каже, работата у дома си. )