HTML де CSS технологиясын қолдану
Барлық веб-дизайннің негізі Hyper Text Markup Language (HTML) болып тпбылады – гипермәтіндік белгі-тілі. Бұл интернетте орналасқан веб-беттерді беттеу үшін пайдаланылады. Кәдімгі («сызықтық») мәтіннен айырмашылығы гипермәтін беттер арасында байланысқан жүйе болып табылады. Барлық Дүниежүзілік торды (World Wide Wed немесе қысқаша түрде WWW)тек бір ғана гипермәтіндік құжат түрінде көрсетуге болады. Негізінде, қолданушы гиперсілтемені қолдана бір құжаттан басқа құжатқа өте алады, және ол үшін ол үшін жалғыз құжатты немесе көптеген өзара байланысқан құжаттардың жүйесі, өзінің браузерінің терезесінде көрсетілген мазмұн оған ешқандай мағынасы болмайды. Бұл қасиет қолданушы үшін ашық болып табылады, Дүниежүзілік торы бар барлық жүйелердің ортақ болып табылады. Интернет және Дүниежүзілік тор - бір және сол емес екенін атап өткен жөн. Интернет - желілердің бірлестігі , сол уақытта Дүниежүзілік тор Интернет негізінде салынған таратылған жүйе болып табылады.
HTML құжаттың логикалық (мәндік) белгісіне құрылған және қолданушы терезесіндегі мазмұның көрсетілуі немесе басып шығаратын құрылғыда шығаруы үшін арналмаған. Дегенмен, бұл ұзақ уақыт бойы заңсыз бақылауды көрсету үшін пайдаланылады. Стильдердің каскадты кестелері (CSS) құрылған кезде жағдай өзгерді. Олар веб-беттің мазмұнын көрсету үшін қалай браузерді айту үшін пайдаланылады.
Осылайша, веб-беттерді құру барысында тек логикалық түзетулер үшін HTML-тегтерді қолдану қажет. Веб-беттің мазмұнын көрсету әдісі каскадтық стиль кестелері CSS көмегімен орнатылған болуы тиіс.
CSS – каскадтық стиль кестелері, HTML-құжаттарының көрсету стильдерін түзету үшін қолданылады. Стильдердің артықшылығы белгілі бір стиль жазуға болатындығында. Сосын оны бірнеше (немесе көптеген) html элементеріне қоланылуға болады, тек жай ғана тег денесіне class="name_of_class" жазу керек . Яғни берілген html элементі үшін сипатталған стильге класс атын көрсету керек.
Егер HTML құжатты логикалық түзету үшін қолданылса, онда монитор терезесінде оның кескінін басқару үшін немесе принтерге басып шығару үшін каскадтық стиль кесетелері қоланылады. CSS түзетудің қорап моделі қабылданған (сурет. 1).
CSS- ті 3 тәсілмен қолдануға болады:
HTML-тегтің ішкі жағына стиль жазу, мысалы
<div style="MARGIN: 30px; BACKGROUND-COLOR: #990033"><font style="COLOR: #ffffff">Осылай көрінеді</font></div>
2) Стильді блокқа жазу <style></style>
<style type="text/css">
.mytable
{
border-width: 10px;
border-collapse:collapse;
border-color: red;
}</style>
<table class="mytable">
<tr>
<td>Ұяшық 1</td>
<td>Ұяшық 2</td>
</tr>
<tr>
<td> Ұяшық 3</td>
<td> Ұяшық 4</td>
</tr>
<tr>
<td> Ұяшық 5</td>
<td> Ұяшық 6</td>
</tr>
</table>
Осылай болып көрінеді:
|
Ұяшық 1 |
Ұяшық 2 |
|
Ұяшық 3 |
Ұяшық 4 |
|
Ұяшық 5 |
Ұяшық 6 |
3) "*.css" кеңейтілуі бар жеке файлға стильді орналастыру, онда класс түрінде стильдерді сұрауға болады (2 мысалды секілді). Ал HTML құжатында разместить <link href="style.css" rel="stylesheet" type="text/css"> сілтемесіне файл стилін орналастыруға болады. Және сәйкесінше HTML- тегтеріне класс атауын қойып жазу керек, шамамен осылай: <table class="mytable">