СSS технологиясының қасиеттері
бет 16/18 Дата 09.01.2022 өлшемі 1,62 Mb. #110549 түрі Диплом
Байланысты:
602-61 Тұрганбаев Зұлпыхар СSS технологиясының қасиеттері
Web-құжаттың құрылымы мен сипаттауын бөлектеуді CSS (Cascade Style Sheets – каскадты стильдер кестесі) технологиясын қолдана отырып орындаймыз. CSS технологиясы Web-құжатты сипаттауда қосымша файлдардан, шаблондар мен стильдерден пайдалануға көмектеседі.
Стильді анықтау құжаттың түрін стиль қасиеттерін енгізу арқалы өзгертетеді.
Стиль қасиеттерінің мәні ретінде кілттік сөздер алынады. Кілттік сөздер арасында кездесетін ¦ символы, қасиеттің осы немесе келесі мәнді қабылдайтынын білдіреді. Төменде осы технологияның негізгі қасиеттерін қарастырайық.
тэгінің орнына, яғни құжаттың негізгі бөлімі ретінде қолданылады. Тэгтің ішінде және тэгтері жазылады. Тэг төмендегі атрибуттарға ие:
rows – атрибуты браузер терезесіндегі горизонталь фреймдер саны мен өлшемдерін анықтайды. Фреймдер өлшемі тізбектеліп, төмендегі тәсілдердің бірімен беріледі:
браузер терезесі биіктігіне сәйкес пайыз – % түрінде. Мысалы: "30%, 30%, 40%";
браузер терезесінің барлық көлемі – * түрінде. Мысалы: "25%, 25%, *";
пиксельде – бүтін сан түрінде. Мысалы: "200, *";
cols – атрибуты браузер терезесіндегі вертикаль фреймдер саны мен өлшемдерін анықтайды. Фреймдер өлшемі тізбектеліп, төмендегі тәсілдердің бірімен беріледі:
браузер терезесі еніне сәйкес пайыз – % түрінде. Мысалы: "30%, 30%, 40%";
браузер терезесінің барлық көлемі – * түрінде. Мысалы: "25%, 25%, *";
пиксельде – бүтін сан түрінде. Мысалы: "200, *";
border – атрибуты фреймдердің рамкасын пиксельде анықтайды;
frameborder – атрибуты фреймдердің рамкасы бар немесе жоқтығын анықтайды. Мәндері: yes, no немесе 1, 0;
framespacing – атрибуты фреймдер арасының қашықтығын (бос аймақ) пиксельде анықтайды;
тэгі фреймді және оның қасиеттерін анықтайды. Тэг жабылу тэгісіз, тэгінің ішінде жазылады. Тэг төмендегі атрибуттарға ие:
src – міндетті атрибут, фреймде бейнеленетін html-файлдың URL-адресін анықтайды ;
name – атрибуты фреймнің өзіндік атын анықтайды. Бұл атау басқа құжаттан сілтеме жасалғанда target атрибутының мәні ретінде беріледі;
marginwidth – атрибуты фрейм мазмұнының терезеден сол жақ және оң жақ шеттен ара қашықтығын пиксельде анықтайды;
marginheight – атрибуты фрейм мазмұнының терезеден жоғарғы және төменгі шеттен ара қашықтығын пиксельде анықтайды;
scrolling – атрибуты фрейм терезеcінің айналдыру сызғышын анықтайды. Қабылдайтын мәндері:
yes – айналдыру сызғышы бейнеленеді;
no – бейнеленбейді;
auto – қажет болса бейнеленеді;
noresize – атрибуты фрейм өлшемдерін өзгертуге тиім салады ;
frameborder – атрибуты фреймнің рамкасын анықтайды. Мәндері: yes, no немесе 1, 0;
тэгі, егер браузер фреймді қолдамаса, терезеге шығатын мәтінді анықтайды. Тэг тэгімен жабылады. Тэг тэгінің ішінде атрибутсыз жазылады.
Ескерту . Егер құжатта тэгі пайдаланылса, онда тэгі қолданылмайды.
Сонымен оқулықтың негізгі терезесінің коды төмендегіше анықталады:
HTML & CSS
scrolling="no">
scrolling="no">
scrolling="0">
Электрондық анықтаманың негізгі терезесі төмендегі суретте көрсетілген (сурет 7). Жасалған анықтаманы «HTML & CSS» бумасына сақтап қоямыз. Анықтаманы іске қосу үшін алдымен негізгі бетті іске қосу керек. Негізгі бет Index.html файлында сақталады.
Негізгі терезе үш фреймнен тұрады. Бірінші фреймде оқулықтың логотипі көрініп тұрады. Фреймді төмендегіше анықтаймыз.
scrolling="no">
Сурет 7 – Анықтаманың негізгі терезесі
Фреймге анықтаманың логотипі сурет түрінде енгізілген. Сурет Adobe PhotoShop программасында құрылып, logo.html атымен сақталған. Web-құжатқа сурет тэгі көмегімен енгізілді. Сурет jpg , gif немесе png форматтарының бірінде болуы тиіс.
Мысалы, анықтамада қолданылды, яғни баузер терезесінің сол жақ шетіне files бумасындағы graf10.gif суреті шығады.
Екінші фреймде анықтаманың тарауларына сілтемелер берілген. Гиперсілтемелерді құруда және пайдалануда тэгі қолданылады. Тэг тэгімен жабылады. Тэг төмендегі атрибуттарға ие:
href – атрибуты бастапқы және жабылу тэгтері арасындағы мәтінді немесе суретті гиперсілтеме деп анықтайды.
name – атрибуты бастапқы және жабылу тэгтері арасындағы мәтінді сілтеме жасау объекті деп анықтайды. Мән ретінде қайталанбайтын кез-келген сөзді латын әріптерімен жазуға болады.
Егер байланыс түрі мен URL-адрес көрсетілмесе бастапқы адрес ретінде ағымдағы бума алынады. Бұл салыстырмалы сілтеме жасауға мүмкіндік береді: Мысалы:
HTML & CSS .
Бұл жерде ағымдағы буманың files ішкі бумасындағы text10.html файлына сілтеме жасалған.
Мысалы:
соңына
тэгін құжат басына, ал
соңы
тэгін құжат соңына жазайық. Браузер терезесінде құжат басында асты сызылған соңы сөзі басқа түспен шығып тұрады және ол құжаттың соңына сілтеме жасайды.
Мысалы: Құжаттың кез-келген жеріне
HTML & CSS
тэгі жазылсын , онда
HTML & CSS
тэгі сол «HTML & CSS» сөзі жазылған бөлімге сілтеме жасайды. Браузер терезесіндегі басқа түспен бөлектенген HTML & CSS сөзін тышқан көрсеткішімен басу арқалы, сол бөлімге келеміз.
Анықтамада қолданылған target – атрибуты сілтемеде көрсетілген құжаттың бейнелену фрейм терезесін анықтайды. Қабылдайтын мәндері:
"_self" – href атрибутында анықталған құжат ағымдағы фреймде бейнеленеді;
"_parent" – href атрибутында анықталған құжаттың ағымдағы фреймнің аналық фреймінде бейнеленуі қажет екенін көрсетеді. Басқаша айтқанда ағымдағы фреймді қосушы frameset тегі сипатталған терезені көретеді;
"_top" – href атрибутында анықталған құжаттың бастапқы фреймде бейнеленуі қажет екенін көрсетеді;
"_blank" – href атрибутында анықталған құжаттың жаңа терезеде бейнеленуі қажет екенін көрсетеді.
Мысалы: HTML & CSS
Бұл жерде ағымдағы буманың files ішкі бумасындағы text1.html файлына сілтеме жасалған. Аталған файл жаңа терезеде бейнеленеді.
Анықтаманың тарауларына сілтемелер төмендегіше берілген.
Web-құжат құру технологиясы
Web-құжат құрылымы
HTML тілінің мәтінді пішімдеу тэгтері
HTML тілінде тізімдерден пайдалану
Web-құжатқа сілтемелер, сурет және объекттер енгізу
Web-құжатта кестелерден пайдалану
Web-құжатта қалыптардан пайдалану
Web-құжатта фреймдерден пайдалану
CSS технологиясының синтаксисі
СSS технологиясының қасиеттері
CSS стильдерін Web-құжатқа енгізу әдістері
tr>
Пайдаланылған әдебиеттер
Достарыңызбен бөлісу: