DHTML - Динамичен HTML
Internet Explorer ви предлага стил, наречен по подразбиране. Този стил предполага чист бял фон, черен цвят на шрифта, всички връзки са подчертани и сини и т.н. Ами ако не ви харесва всичко? Вече знаете как да променяте различни атрибути директно. Дори ако има много обекти с еднаква стойност, вие вече знаете как да използвате класове. Но има и друга възможност. За задаване на целия стил на документа се използват така наречените йерархични стилови таблици (Cascade Style Sheets - CSS), които представляват набор от настройки на свойствата за различни обекти. По някакъв начин те приличат на класове, но ако класът е създаден вътре в документа и може да се приложи или може би не, тогава CSS, ако е включен, тогава настройките в него директно засягат всички обекти в документа.
Следните теми ще бъдат разгледани по-нататък:
CSS е много подобен на класовете, с единствената разлика, че те описват стил за вече известен обект. За добър пример, погледнете сега вашата стая (офис, антре.), В която се намирате. Със сигурност ще видите много различни предмети (маса, стол, прозорец, компютър). Всеки от тези предметни елементи има статистика и трябва да направите списък с тези елементи и техните статистики. Може би можете да направите нещо подобно:
маса: цвят - кафяв материал - дърво компютър: цвят - бял материал - пластмаса назначение - за работа
Разбира се, можете да отидете по друг начин, но само CSS е съставен по този начин, където вместо обекти има обекти и техните характеристики са малко по-различни. Например, ето извадка от такъв документ:
тяло цвят на фона: rgb(255,255,153); цвят: rgb(51,51,153); >
h1 цвят: rgb(255,0,0); семейство шрифтове: arial, helvetica; >
Това определя какъв ще бъде стилът на елемента BODY и H1. Тези параметри, които не са зададени, остават по подразбиране.
Създаването на CSS не изисква много усилия и може да се направи в обикновен бележник, въпреки че има специални програми за тази цел, които улесняват работата и визуално показват как ще изглежда бъдещ документ, използвайки този стил. Потърсете такива програми на вашия диск или от приятели.
Има два начина за включване на CSS. Първият е да го дефинирате в елемента STYLE в началото на документа, като клас. Това се прави по следния начин:
Този документ
използва таблици със стилове
В този пример на екрана ще видите два реда, състоящи се от два обекта: H1 и H2. Вижте в какво се превърна стандартният стил на Internet Explorer. Но ние не направихме никакви индикации в самия обект за неговия стил. По този начин, без значение колко H1 и H2 обекти правите, техният стил винаги ще бъде по начина, по който сте го посочили в листа със стилове.
Ако харесвате стила, който сте създали и искате да го използвате във всичките си документи. Или ако вашият документ се състои от много HTML страници и всички те трябва да имат един и същ стил, не е нужно всеки път да набивате редовете на листа със стилове в началото на документа.
И така, първо създавате таблица, като следвате горните правила. След това добавяте ред като този към елемента, за да включите листа със стилове:
Можете динамично да промените името на включения файл със стилова таблица, като промените съответно самия стил. Ето една функция на езика JScript, която при извикване, ако има вече приложен стил, го премахва и свързва нов.
функция change_style() if (document.styleSheets.href !=null) document.styleSheets.href = "newStyle.css"; >
Ако в HTML страница е дефиниран лист със стилове, можете да добавите нови дефиниции с функцията addRule(object, style). Където обектът е обект, а стилът, съответно, настройките на стила. Ето пример, в който след щракване върху бутона стиловият лист се променя:
Това е Заглавие 1
Това е заглавие 2
Това е параграф. Кликнете върху бутона, за да промените стила му
Разглеждайки страницата с този код, ще видите как стилът се променя чрез добавяне на настройката към листа със стилове.