Практикалық жұмыс № 5
«HTML тілінде Web-парақтар құру. Қарапайым Web-құжаттар құруды үйрену»
Жұмыстың мақсаты: HTML тілінде Web-парақтарында мәтінің экранда орналасуын басқару, жолдар мен абзацты, мәтін фрагменттерін ерекшелеу, стилін пайдалану.
Негізгі ұғымдар:
HTML (HyperTextMarkupLanguage) – бұл құжаттарды кодтау үшін қолданылатын гипертекстік белгілеу тілі. HTML ді көбі программалау тілі деп ойласа да, бұл программалау тілі емес. HTML – мәтінді белгілеу тілі.
HTML құжаттарды көру үшін браузерларды қолданамыз. Браузер-программалардың саны өте көп, мысалы көп таралғандар Netscape Communicator, Microsoft Internet Explorer, Opera.
HTML тiлiнде колданылатын командаларды “тег” деп айтамыз. HTML тiліндегi тегтер екi топқа бөлiнедi: жұпты, жұпсыз. Жұпты тегтер дегенiмiз, бiр тег ашылса, келесi тег оны жабады. Мысалы, <html> тегтiң жұмысын ашады да келесi </html> тегi оны жабады. <title> ашылуы, </title> жабылуы. Жұпсыз тегтер дегенiмiз, тег ашылады да қолданыла бередi. Мысалы, <IMG> т.с.с.
Көбінесе ашылу тәгтерінің тигізетін әсерлерін айқындайтын немесе түрлендіретін олардың атрибуттары (сипаттамалары) болады. Атрибут мәні оның түйінді сөзінен теңдік белгісі (=) арқылы бөлініп жазылады. Атрибут мәні қостырнақшаға алынып жазылуы тиіс. Жабылу тәгтерінің ешқашанда атрибуттары болмайды.
Тәг атауларын жазу синтаксисі төмендегідей:
<тәг_аты [атрибуттары]>
Тік жақшаға алынған тізбекті жазбай кетуге де болады, яғни көптеген тәгтер атрибутсыз жазыла береді. Ашылу тәгінен соң, негізгі құжат мәтіні жазылады да, соңында ешқашанда атрибуты болмайтын жабылу тәгі орналасады, оның синтаксисі:
</тәг_аты>
Ал атрибуттың жазылу ережесі:
атрибут_аты [= “мәні”]
Сонымен ішіне тегтер жазылған кез келген программа мәтінін Блокнотта тергеннен кейін, оған өз қалауыңызша ат беріп, * .htm (* – кез келген ат) түрінде сақтау керек.
HTML құжаттың негізгі структурасы төмендегідей:
<HTML>
<HEAD>
<TITLE> … </title>
</head>
<BODY>
…
</body>
</html>
Кез келген HTML құжат <HTML> тегімен басталып, </html> тегімен аяқталу керек. Құжат екі бөлімнен тұрады: тақырып бөлімі <HEAD> тегімен басталынатын және <BODY> тегімен басталынатын негізгі бөлімнен. Тақырып бөлімі міндетті емес, бірақ ол жерде браузерге қажетті көп ақпарат болуы мүмкін.
<TITLE>, </title> тегтерінің арасында құжаттың аты жазылады, сол сөз терезенің тақырып жолына шығады.
Жаттығу. Қарапайым НТМL файлын жасау.
HTML файылын ашу үшін төмендегі жұмысты орынданыз:
1. Өз жұмыс бумаларыңыздың ішінен жаңадан жасалған Web-парағын сақтайтын HTML бумасын ашыныздар.
2. Блокнот (Notepad) программасын іске қосыңыздар.
3. Блокнот редакторы терезесінде төмеңде көрсетілген қарапайым НТМL файлының мәтінін теру керек.
<html>
<head>
<tіtle> 1-ші мысал </tіtle>
</head>
<body>
Сәлем! Бұл менің алғашқы HTML – құжатым!
</body>
</html>
жаттығу. Құжаттың негізгі бөлігі
Құжаттың тақырыптан кейінгі негізгі бөлігі <BODY>... </BODY> тәгтерінің ортасына орналасады. Мұнда көптеген атрибуттар, яғни параметрлер болады. Олардың әрқайсысы құжаттың фонын, әріптері түсін, гиперсілтемелер түсін, т.б. анықтайды. Бұл тәгтің негізгі атрибуттары:
| Атрибут аты | Атқаратын қызметі |
| BGCOLOR | фон түсін анықтайды |
| TEXT | мәтін әріптерінің түсін анықтайды |
| LІNK | гипермәтіндік сілтеме ретінде қабылданған сөз тіркесінің түсін белгілейді. Егер көрсетілмесе, алдын ала келісімге сәйкес ол көк түс болып саналады |
| VLІNK | пайдаланылған гипермәтіндік сілтеме түсін анықтайды. Келісім бойынша ол қызылқоңыр түс болып саналады |
| ALІNK | гипермәтіндік сілтемені курсор көрсетіп тұрған кездегі оның түсін анықтайды. Бұл параметр өте сирек өзгертіледі |
| BACKGROUND | мәтіннің фонында орналасатын суретті анықтайды. ол түсқағаз (обои) рөлін атқарады. Суреттік файлдың типі gif немесе jpg болуы тиіс. |
HTML тілінде түстердің ағылшын тіліндегі атаулары жиі қолданылады. Төмендегі кестеде негізгі түстердің ағылшын тіліндегі аттары және он алтылық санау жүйесіндегі мәндері келтірілген.
