«Интернет технологиялар» пәнінен барлық мамандық студенттеріне арналған әдістемелік нұсқау
№1 Тәжірибелік сабақ
Браузердің бағдарламаларын күйге келтіру
1 Тапсырма. Internet Explorer құралдар тақтасын күйге келтіру.
Жұмысты орындау тәртібі
Жұмыстың мақсаты: Internet Explorer браузер бағдарламасының негізгі мүмкіндіктерін игеру.
Теориялық бөлім:
Для связи с Internet- пен байланыс үшін арнайы — браузер бағдарламасы керек.
Заманауи браузердің нәтижесінде Internet-ке қосылу үшін қосымша барлық мүмкіндіктер біріктіріледі.
Қазіргі кезде Netscape Navi¬gator және Internet Explorer браузерлері атақты болып саналады. Браузердің негізгі мағынасы – Интернеттен Веб-бетін жүктеу және оны экран бетінде бейнелеу
Тәжірибелік бөлім
1. Жұмыс столында құжат құрып оған ат беріңіз.
2. Internet Explorer броузерін ашыңыз.
3. Вид тізіміндегі құралдар тақтасынан қарама қарсы құралдар тақтасындағы барлық жалаушаларды алып тастаңыз.
4. Вид менюінен Строка состояния қосымшасында жалаушаны алып тастаңыз.
5. PrintScreen батырмасын басыңыз.
6. Графикалық редакторды ашыңыз және көшірілгенді жұмыс столына қойыңыз.
7. Internet Explorer құралдар тақтасыны баптау.
ВидПанелиинструментов әрекетінің көмегімен шолушыға қайта оралыңыз, экранда сілтемелерді бейнелеңіз. Paint берілген терезесіне көшіріңіз, оны барлық суреттермен салыстырыңыз және алғашқы суреттегі қайталанған барлық бөлімдерді қырқыңыз. Алынған нәтижені жұмыс столындағы суретке қойыңыз және оны «сілтемелер» деп жазыңыз
Шолушыға қайта оралыңыз және аналогтік әрекет жасай отырып Адресную строку, Обычные кнопки, строку состояния –ға сол суретті салыңыз оларды жазыңыз.. Аналогты тұлғада көшіріңізПанели обозревателя: Избранное (часто посещаемые веб-страницы), Журнал (список недавно посещённых веб-страниц), Поиск, Папки.
Веб беттерді көру үшін сізге қаріптің көлемін өзгертуді үйренуіңіз керек, барлық веб беттердің бейнелеуінің жылдамдығын арттыру үшін графиканы өшіріңіз.
Беттегі қаріптің қолайлы өлшемін көру үшін келесі қадамды орындау керек ВидРазмер шрифта. Самый крупный түрін таңдаңыз.
Барлық веб беттердің бейнесінің жылдамдығын арттыру үшін графиканы өшіріңіз: меню Сервисшолушы Internet Explorer Свойства обозревателя командасын таңдаңыз.
Дополнительно қосымшасын таңдаңыз.
В группе Мультимедиатобындажалаушадан бір немесе бірнешесін түсіріңіз: Отображать рисунки, Воспроизводить анимацию на веб-страницах, Воспроизводить видео на веб-страницахжәнеВоспроизводить звуки на веб-страницах.
Дисктік кеңістікті үлкейту үшін веб беттегі уақытша сақталған ерекшеленгенді таңдаңыз. Сервисменюінен Internet Explorer шолушы Свойства обозревателякомандасын таңдаңыз.
ОбщиеқосымшасынанПараметрыбатырмасын басыңыз.
Тәжірибелік сабақ №2.
HTML тілінде мәтінді безендіру
Мақсаты: Қарапайым Web-беттерін дайындауды үйрету
Жұмысты орындау тәртібі
1. HTML-құжат –бұл аты .html қосымшасы бар қарапайым мәтіндік құжат. Мына, HTML-құжатты Блокнотта теріп шығыңыздар:
<html><head>Менің алғашқы парағым <title>1-ші мысал <\title><\head>
<body>
Бұл HTML-құжаттың ең қарапайым мысалы.
Браузердің бағдарламаларын күйге келтіру
1 Тапсырма. Internet Explorer құралдар тақтасын күйге келтіру.
Жұмысты орындау тәртібі
Жұмыстың мақсаты: Internet Explorer браузер бағдарламасының негізгі мүмкіндіктерін игеру.
Теориялық бөлім:
Для связи с Internet- пен байланыс үшін арнайы — браузер бағдарламасы керек.
Заманауи браузердің нәтижесінде Internet-ке қосылу үшін қосымша барлық мүмкіндіктер біріктіріледі.
Қазіргі кезде Netscape Navi¬gator және Internet Explorer браузерлері атақты болып саналады. Браузердің негізгі мағынасы – Интернеттен Веб-бетін жүктеу және оны экран бетінде бейнелеу
Тәжірибелік бөлім
1. Жұмыс столында құжат құрып оған ат беріңіз.
2. Internet Explorer броузерін ашыңыз.
3. Вид тізіміндегі құралдар тақтасынан қарама қарсы құралдар тақтасындағы барлық жалаушаларды алып тастаңыз.
4. Вид менюінен Строка состояния қосымшасында жалаушаны алып тастаңыз.
5. PrintScreen батырмасын басыңыз.
6. Графикалық редакторды ашыңыз және көшірілгенді жұмыс столына қойыңыз.
7. Internet Explorer құралдар тақтасыны баптау.
ВидПанелиинструментов әрекетінің көмегімен шолушыға қайта оралыңыз, экранда сілтемелерді бейнелеңіз. Paint берілген терезесіне көшіріңіз, оны барлық суреттермен салыстырыңыз және алғашқы суреттегі қайталанған барлық бөлімдерді қырқыңыз. Алынған нәтижені жұмыс столындағы суретке қойыңыз және оны «сілтемелер» деп жазыңыз
Шолушыға қайта оралыңыз және аналогтік әрекет жасай отырып Адресную строку, Обычные кнопки, строку состояния –ға сол суретті салыңыз оларды жазыңыз.. Аналогты тұлғада көшіріңізПанели обозревателя: Избранное (часто посещаемые веб-страницы), Журнал (список недавно посещённых веб-страниц), Поиск, Папки.
Веб беттерді көру үшін сізге қаріптің көлемін өзгертуді үйренуіңіз керек, барлық веб беттердің бейнелеуінің жылдамдығын арттыру үшін графиканы өшіріңіз.
Беттегі қаріптің қолайлы өлшемін көру үшін келесі қадамды орындау керек ВидРазмер шрифта. Самый крупный түрін таңдаңыз.
Барлық веб беттердің бейнесінің жылдамдығын арттыру үшін графиканы өшіріңіз: меню Сервисшолушы Internet Explorer Свойства обозревателя командасын таңдаңыз.
Дополнительно қосымшасын таңдаңыз.
В группе Мультимедиатобындажалаушадан бір немесе бірнешесін түсіріңіз: Отображать рисунки, Воспроизводить анимацию на веб-страницах, Воспроизводить видео на веб-страницахжәнеВоспроизводить звуки на веб-страницах.
Дисктік кеңістікті үлкейту үшін веб беттегі уақытша сақталған ерекшеленгенді таңдаңыз. Сервисменюінен Internet Explorer шолушы Свойства обозревателякомандасын таңдаңыз.
ОбщиеқосымшасынанПараметрыбатырмасын басыңыз.
Тәжірибелік сабақ №2.
HTML тілінде мәтінді безендіру
Мақсаты: Қарапайым Web-беттерін дайындауды үйрету
Жұмысты орындау тәртібі
1. HTML-құжат –бұл аты .html қосымшасы бар қарапайым мәтіндік құжат. Мына, HTML-құжатты Блокнотта теріп шығыңыздар:
<html><head>Менің алғашқы парағым <title>1-ші мысал <\title><\head>
<body>
Сәлем!
Бұл HTML-құжаттың ең қарапайым мысалы.
Мәтіндер алты түрлі көлеммен көрсетіле алады, олардың түсін де, қаріп типін де фон түсіне де өзгертілетін мүмкіндіктер бар. Мәтін ішіне суреттер орналастыруға да болады.
<\P><\body><\html>
Енді осы терілген құжатты, мысалы,TI.html деген атпен дискіде сақтау керек.Сонда оның белгішесі өзгеріп Интернетте көруге болатын түрге айналады.
Бұл TI.html файлын бір мезетте InternetExplorer-де және Блокнотта ашып, оларды түрлендіріп көруге болады. Ол үшін файлды интернет explorer–де ТүрНТМL түрінде (Видв видеНТМL) командаларын орындау қажет. Сонда файлдың алғашқы мәтіні Блокнотта ашылып, оны түрлендіріп өзгерту мүмкіндігіне ие боламыз. Қажетті өзгертулер енгізіп оны қайта, сақтап, осы өзгертулердің HTML- құжатта іске асқанын көру үшін, InternetExplorer-де ТүрЖаңалау (ВидОбновить) командасын орындау керек немесе Саймандар тақтасындағы батырмасын басса болғаны.
Сонымен кез келген программа мәтінін Блокнотта тергеннен кейін, оған өз қалауыңызша ат беріп,оны *.һtml түрінде сақтау керек. Тергеніңіздің нәтижесін экранда көру үшін, оның атын тышқанмен екі шерту керек немесе Internet Explorer-де оны ашу қажет.
2. Програманы оқу ыңғайлы болуы үшін әрбір жол тиісінше қосымша шегіністер арқылы жазылады, бірақ жалпы HTML құжаты үшін оның қажеті жоқ. Тіпті, броузерлер HTML – файлдардағы жолдың соңы символын және көптеген бос орындарды есепке алмайды. Сондықтан біздің мысалымыз мынадай түрде де жазылуы мүмкін:
3. Бұл мысалдағы <html> … </html> белгілерінің ортасына HTML – құжаты жазылады, яғни <html> құжаттың басын, ал </html> оның аяқталғанын көрсетеді.
<head> … </head> - бұл қос белгі құжат тақырыбының басын және соңын білдіреді. Бұл бөлімде құжат тақырыбынан басқа әртүрлі қызмет атқаратын мәліметтер(төмендегі <title> белгісін қараңыз) жазылуы мүмкін, олар жайлы біз кейінірек айтамыз.
<title>... </title>
<title> және </title> белгілерінің арасында жазылған сөздерді браузер құжаттың аты деп түсінеді де, ол терезе тақырыбында көрсетіледі. Осы құжатты принтер арқылы баспадан шығарғанда, браузер оны әр парақтың сол жақ жоғары бұрышына жазып отырады. Атаудың өте ұзын болмауы дұрыс, әдетте ол 64 символдан аспауы керек.
<body> … </body>- бұл қос белгі HTML – құжаттың негізгі мазмұндық бөлігінің басын және соңын білдіреді.
…
-…
белгісі (мұндағы і – 1 –ден 6 –ға дейінгі бүтін сан) алты түрлі сатыдағы символдар мөлшерін таңдау мүмкіндігін береді. Бірінші сатыдағы тақырып – ең ірісі, алтыншы сатыдағы – ең кішісі.
…
немесебұндай қос белгі абзацты сипаттайды. Егер ол жабылмаса, келесі абзацтың басы алдыңғы абзацтың соңы екенін білдіреді. Жалпы
және
белгілерінің арасына жазылғандардың барлығы бір абзац ретінде қабылданады.және белгілерінің қосымша ALIGN (оқылуы “элайн”, ағылшынның “туралау” деген сөзінен) атрибуты болуы мүмкін.
Мысалы:
Пән: Информатика, Программалау, Мәліметтер қоры
Жұмыс түрі: Курстық жұмыс
Тегін: Антиплагиат
Көлемі: 21 бет
Таңдаулыға:
Жұмыс түрі: Курстық жұмыс
Тегін: Антиплагиат
Көлемі: 21 бет
Таңдаулыға:
СМЖ құжаты
Ф 111-1.81-2014
Тәжірибелік жұмысты орындау үшін әдістемелік нұсқау
6 баспа
Енізілген күн 15.04.2014
ҚАЗАҚСТАН РЕСПУБЛИКАСЫНЫҢ БІЛІМ ЖӘНЕ ҒЫЛЫМ МИНИСТРЛІГІ
М.Х.Дулати атындағы Тараз Мемлекеттік университеті
БЕКІТЕМІН
Информатика кафедрасының
меңгерушісі
_______________ _Тлебаев М.Б._____
қолы аты-жөні
___________________20_____ж.
Интернет технологиялар
пәнінен барлық мамандық студенттеріне арналған
ӘДІСТЕМЕЛІК НҰСҚАУ
Тараз 2014ж.
Интернет технологиялар пәнінен тәжірибелік жұмысты орындауға арналған барлық мамандық студенттеріне арналған әдістемелік нұсқау пәннің жұмыс бағдарламасына сәйкес құрастырылды.
Әдістемелік нұсқауды құрастырған:
Аға оқытушы Төреханова Г.И. ___________________
қызметі, аты-жөні қолы
Аға оқытушы Джакашова Э.А. ___________________
қызметі, аты-жөні қолы
Әдістемелік нұсқау Информатика кафедрасының мәжілісінде қаралып, талқыланды.
Хаттама № __________ ________________20______ж.
№1 Тәжірибелік сабақ
Браузердің бағдарламаларын күйге келтіру
1 Тапсырма. Internet Explorer құралдар тақтасын күйге келтіру.
Жұмысты орындау тәртібі
Жұмыстың мақсаты: Internet Explorer браузер бағдарламасының негізгі мүмкіндіктерін игеру.
Теориялық бөлім:
Для связи с Internet- пен байланыс үшін арнайы -- браузер бағдарламасы керек.
Заманауи браузердің нәтижесінде Internet-ке қосылу үшін қосымша барлық мүмкіндіктер біріктіріледі.
Қазіргі кезде Netscape Navi - gator және Internet Explorer браузерлері атақты болып саналады. Браузердің негізгі мағынасы - Интернеттен Веб-бетін жүктеу және оны экран бетінде бейнелеу
Тәжірибелік бөлім
1. Жұмыс столында құжат құрып оған ат беріңіз.
2. Internet Explorer броузерін ашыңыз.
3. Вид тізіміндегі құралдар тақтасынан қарама қарсы құралдар тақтасындағы барлық жалаушаларды алып тастаңыз.
4. Вид менюінен Строка состояния қосымшасында жалаушаны алып тастаңыз.
5. PrintScreen батырмасын басыңыз.
6. Графикалық редакторды ашыңыз және көшірілгенді жұмыс столына қойыңыз.
7. Internet Explorer құралдар тақтасыны баптау.
ВидПанелиинструментов әрекетінің көмегімен шолушыға қайта оралыңыз, экранда сілтемелерді бейнелеңіз. Paint берілген терезесіне көшіріңіз, оны барлық суреттермен салыстырыңыз және алғашқы суреттегі қайталанған барлық бөлімдерді қырқыңыз. Алынған нәтижені жұмыс столындағы суретке қойыңыз және оны сілтемелер деп жазыңыз
Шолушыға қайта оралыңыз және аналогтік әрекет жасай отырып Адресную строку, Обычные кнопки, строку состояния - ға сол суретті салыңыз оларды жазыңыз.. Аналогты тұлғада көшіріңізПанели обозревателя: Избранное (часто посещаемые веб-страницы), Журнал (список недавно посещённых веб-страниц), Поиск, Папки.
Веб беттерді көру үшін сізге қаріптің көлемін өзгертуді үйренуіңіз керек, барлық веб беттердің бейнелеуінің жылдамдығын арттыру үшін графиканы өшіріңіз.
Беттегі қаріптің қолайлы өлшемін көру үшін келесі қадамды орындау керек ВидРазмер шрифта. Самый крупный түрін таңдаңыз.
Барлық веб беттердің бейнесінің жылдамдығын арттыру үшін графиканы өшіріңіз: меню Сервисшолушы Internet Explorer Свойства обозревателя командасын таңдаңыз.
Дополнительно қосымшасын таңдаңыз.
В группе Мультимедиатобындажалаушадан бір немесе бірнешесін түсіріңіз: Отображать рисунки, Воспроизводить анимацию на веб-страницах, Воспроизводить видео на веб-страницахжәнеВоспроизводить звуки на веб-страницах.
Дисктік кеңістікті үлкейту үшін веб беттегі уақытша сақталған ерекшеленгенді таңдаңыз. Сервисменюінен Internet Explorer шолушы Свойства обозревателякомандасын таңдаңыз.
ОбщиеқосымшасынанПараметрыбатырмасы н басыңыз.
Тәжірибелік сабақ №2.
HTML тілінде мәтінді безендіру
Мақсаты: Қарапайым Web-беттерін дайындауды үйрету
Жұмысты орындау тәртібі
1. HTML-құжат - бұл аты .html қосымшасы бар қарапайым мәтіндік құжат. Мына, HTML-құжатты Блокнотта теріп шығыңыздар:
----------------------------------- ----------------------------------- ----------
htmlheadМенің алғашқы парағым title1-ші мысал \title\head
----------------------------------- ----------------------------------- ----------
body
----------------------------------- ----------------------------------- ----------
H1 Сәлем!H1
----------------------------------- ----------------------------------- ----------
Бұл HTML-құжаттың ең қарапайым мысалы.
----------------------------------- ----------------------------------- ----------
P Мәтіндер алты түрлі көлеммен көрсетіле алады, олардың түсін де, қаріп типін де фон түсіне де өзгертілетін мүмкіндіктер бар. Мәтін ішіне суреттер орналастыруға да болады.
----------------------------------- ----------------------------------- ----------
\P\body\html
Енді осы терілген құжатты, мысалы,TI.html деген атпен дискіде сақтау керек.Сонда оның белгішесі өзгеріп Интернетте көруге болатын түрге айналады.
Бұл TI.html файлын бір мезетте InternetExplorer-де және Блокнотта ашып, оларды түрлендіріп көруге болады. Ол үшін файлды интернет explorer - де ТүрНТМL түрінде (Видв видеНТМL) командаларын орындау қажет. Сонда файлдың алғашқы мәтіні Блокнотта ашылып, оны түрлендіріп өзгерту мүмкіндігіне ие боламыз. Қажетті өзгертулер енгізіп оны қайта, сақтап, осы өзгертулердің HTML- құжатта іске асқанын көру үшін, InternetExplorer-де ТүрЖаңалау (ВидОбновить) командасын орындау керек немесе Саймандар тақтасындағы батырмасын басса болғаны.
Сонымен кез келген программа мәтінін Блокнотта тергеннен кейін, оған өз қалауыңызша ат беріп,оны *.һtml түрінде сақтау керек. Тергеніңіздің нәтижесін экранда көру үшін, оның атын тышқанмен екі шерту керек немесе Internet Explorer-де оны ашу қажет.
2. Програманы оқу ыңғайлы болуы үшін әрбір жол тиісінше қосымша шегіністер арқылы жазылады, бірақ жалпы HTML құжаты үшін оның қажеті жоқ. Тіпті, броузерлер HTML - файлдардағы жолдың соңы символын және көптеген бос орындарды есепке алмайды. Сондықтан біздің мысалымыз мынадай түрде де жазылуы мүмкін:
3. Бұл мысалдағы html ... html белгілерінің ортасына HTML - құжаты жазылады, яғни html құжаттың басын, ал html оның аяқталғанын көрсетеді.
head ... head - бұл қос белгі құжат тақырыбының басын және соңын білдіреді. Бұл бөлімде құжат тақырыбынан басқа әртүрлі қызмет атқаратын мәліметтер(төмендегі title белгісін қараңыз) жазылуы мүмкін, олар жайлы біз кейінірек айтамыз.
title... title
title және title белгілерінің арасында жазылған сөздерді браузер құжаттың аты деп түсінеді де, ол терезе тақырыбында көрсетіледі. Осы құжатты принтер арқылы баспадан шығарғанда, браузер оны әр парақтың сол жақ жоғары бұрышына жазып отырады. Атаудың өте ұзын болмауы дұрыс, әдетте ол 64 символдан аспауы керек.
body ... body- бұл қос белгі HTML - құжаттың негізгі мазмұндық бөлігінің басын және соңын білдіреді.
H1 ... H1 - H6 ... H6
Hi белгісі (мұндағы і - 1 - ден 6 - ға дейінгі бүтін сан) алты түрлі сатыдағы символдар мөлшерін таңдау мүмкіндігін береді. Бірінші сатыдағы тақырып - ең ірісі, алтыншы сатыдағы - ең кішісі.
P ... P немесе P бұндай қос белгі абзацты сипаттайды. Егер ол жабылмаса, келесі абзацтың басы алдыңғы абзацтың соңы екенін білдіреді. Жалпы P және P белгілерінің арасына жазылғандардың барлығы бір абзац ретінде қабылданады.
Hi және P белгілерінің қосымша ALIGN (оқылуы "элайн", ағылшынның "туралау" деген сөзінен) атрибуты болуы мүмкін.
Мысалы:
H1 ALIGN=CENTER Тақырыпты ортаға жылжыту H1 немесе PALIGN=RIGHT Абзацты оң жақ шетке жақындатып туралау түрі P
4. Үйренгеніміздің барлығын тиянақтап, төменгі 2-мысалды орындайық:
Бұдан былай қарапайым HTML-құжатты осы мысалдардағыдай етіп бастан аяқ құрастыруға мүмкіндік бар.
----------------------------------- ----------------------------------- ----------
htmlheadtitle 2-мысалtitlehead
----------------------------------- ----------------------------------- ----------
body
----------------------------------- ----------------------------------- ----------
H1 ALIGN=CENTERсәлем! H1
----------------------------------- ----------------------------------- ----------
H2 бұл HTML-құжаттың сәл күрделірек мысалы h2
----------------------------------- ----------------------------------- ----------
P Енді біз абзацты, тек сол жақ шетке ғана туралап жазбай,
----------------------------------- ----------------------------------- ----------
P ALIGN=CENTERортаға қарайP
----------------------------------- ----------------------------------- ----------
P ALIGN=RIGHTнемесе оң жақ шетке де туралауға болатындығын білеміз.Pbodyhtml
5. Енді біз осы қарапайым HTML-құжатты қалай жақсартуға болатындығын сөз етеміз. Жаңа жолға көшу белгісінен бастайық.
BR белгі абзацты бөлмей, келесі сөзді жаңа жолға көшіру керек болғанда қолданылады. Өлең жазуға өте ыңғайлы. Өлеңнен мысал келтірейік:
htmlheadtitle 3-мысал titlehead
body
H1ӨлеңH2
H2АбайH2
P Айттым сәлем, Қаламқас BR
Саған құрбан мал мен бас. BR Сағынғаннан сені ойлап, BR
Келер көзге ыстық жас. PP Көзімнің қарасы, BR
Көңілімнің санасы. BR
Ғашықтық жарасы Pbody
BODY... BODY тэгтерінің ортасында кuптеген атрибуттар, яѓни параметрлер болады. Олардыњ ?р?айсысы ?+-жаттыњ фонын, ?ріптерінің т%.сін, гиперсілтемелер т%.сін, т.б. аны?тайды. Б+-л тэгтіњ негізгі атрибуттары: BACKGROUND, BGCOLOR, TEXT, LINK, VLINK ж?не ALINK.
BODY 1-параметр=мәні 2-параметр=мәні
3-параметр=мәні...құжаттың негізгі тұлғасы...BODY
1. Параметрлер тізімін толық берудің қажеті жоқ, көбінесе олардың бірде біреуі болмауы мүмкін, мұндайда олардың алдын ала (үнсіз) келісім бойынша бекітілген
2. BGCOLOR - құжаттың жалпы мәтінінің фоны түсін анықтайды, егер ол көрсетілмесе, ақ түс қолданылады. Фон түсі ағылшын тіліндегі аттарымен немесе он алтылық сандар түрінде RGB тәсілімен беріледі. Олар жайында кейінірек айтылады.
Мысалы:
bodybgcolor="yellow"мұнда фон сары түсті болады.
TEXT- мәтін әріптерінің түсін анықтайды, егер ол жазылмаса, келісім бойынша қара түс қабылданған. Фон түсін өзгерткенде соған үйлесімді символдар түсі бекітіледі. Бұл да ағылшын тіліндегі аттарыменнемесе он алтылық сандар түрінде rgb тәсілімен беріледі.
LINК - гипермәтіндік сілтеме ретінде қабылданған сөз тіркесінің түсін белгілейді. Егер көрсетілмесе ол көк түс болып саналады.
VLINR - пайдаланылған гипермәтіндік сілтеме түсін анықтайды. Келісім бойынша ол қызылқоңыр түс болып саналады.
ALINK-ГИПЕРМӘТІНДІК сілтемелі курсор көрсетіп тұрған кездегі оның түсін белгілейді. Бұл параметр өте сирек өзгертіледі.
BACKGROUND- мәтіннің фонында орналасатын суретті анықтайды, ол түсқағаз рөлін атқарады. Суреттік файлдың типі gif немесе jpg болуы тиіс.
Суреттің адресі көрсетілсе, ол интернет желісінен тауып алынады.
Мысалы:
body bgcolor=lighteellow text=red ink=purpplt vlink= mfroon flink=fuschef background="face.jpg"
2. HTML Тілінде түрлі түстер он алтылық сандар түррінде RGB тәсілмен берілуі де (COLOR= "#COFFCO"), мүмкін, оның мүмкіндігі өте мол. Мұндағы алғашқы екі сан қызыл түс бөлігін, келесі екі сан-жасыл түс бөлігін, соңғы екі сан көк түс бөлігін анықтайды. Жоғарыдағы көптеген параметрлер түсті пайдаланады, олар ағылшын тіліндегі негізгі он алты түс атымен немесе солардың кодтарымен төмендегідей түрде беріледі.
Black=#000000 қара
Silve=#COCOCOкүміс түсті
Gray=#808080 сұр
White=#FFFFFақ
Maroon=#80000 қызылкүрең
Purple=# 800080күлгін
Red=#FF00FF қызғыш
Green=#008000 жасыл
Lime=#OOFFOO лимон түсті
Olive=#808000 сары
Yellow=#FFFFOO САРЫ
Navy=#000080 қаракөк
Blue=#OOOOFFКӨГІЛДІР
Teal=#008080 шай түсті
Aqua=#OOFFFF КӨК
htmlHR белгісі көлденең сызық сызады. Бұл белгінің қосымша SIZE (Сызықтың пиксельмен берілген қалыңдығын анықтайды) және WIDH (экранныңеніне қатысты, сызықтың пайызбен берілген ұзындығын анықтайды)атрибуттары бар. 4- мысалда көлденең сызықтардың кішігірім жинағы берілген.
HTMLHEADTITLEСызықтарTITLE HEAD
BODY
H1Бірнеше көлденең сызықтар:H1
HR COLOR=RED SIZE=16 WIDTH=100%BR
HR COLOR=GREN SIZE=8 WIDTH=75%BR
HR COLOR=BLUE SIZE=4 WIDTH=50%BR
HR COLOR=BLACK SIZE=2 WIDTH=25%BRBODYHTML
Бұл жолдардың нәтижесі төмендегідей:
6. Енді түрлі - түсті мәтін жазып үйренейік. Ол үшін басқа түске боялатын мәтін үзіндісін fontcolor="red"...font белгілерінің арасына жазу керек.
htmlheadtitle 3- мысал titlehead
bodyH1Өлең H1H2Абай H2
font color ="red"
PАйттым сәлем, Қаламқас BR
Саған құрбан мал мен бас. BR
Сағынғаннан сені ойлап, BR
Келер көзге ыстық жас. BR
Көзімнің қарасы,BR
Көңлімнің санасы. BR
Бітпейтін іштегі, BR
Ғашықтық жарасы. fontbodyhtml
№№№
Жоғарыда айтылғандарды пайдаланып:
1. Қандайда бір тақырып бойынша семинар болатындығы жайлы хабарлама жазыңыз. Сол құжаттың нәтижесін InternetExplorer-де көргеннен кейін, өз қалауыңызша өзгерістер енгізіп, қайталап сақтаңыз.
Тэгтердің тағы бір арнайы тобы қаріптердің сызылымын (начертание) өзгерту мүмкіндігін береді. B жәнеB тэгтері араларында орналасқан мәтін қарайтылған қәріпке ауысады. I жәнеI тэгтері қәріптерді курсивпен берсе,U және U тэгтері мәтіндердің астын сызып, Sжәне S тэгтері- белдерінен сызылған символдарды бейнелейді.
Мысалы:
HTMLHEADҚәріп типін, түрін, мөлшерін басқару HEAD
BODY
BASEFONT SIZE=4 FASE= "Arial KZ"
Негізгі қаріп Arial KZ типінде төртінші мөлшерменжазылған
PFONT SIZE=-2 FASE="Times New Roman KZ" COLOR= "GREEN"
Бұл мәтін әріптері алдынғыдан екі мөлшерге ұсақтаужәне ол басқа қәріп типі мен жасыл түсті қолданады.
FONT
PBқарайтылған қәріп түрі B
PIқисайтылған курсивпен жазылған қәріп түрі I
PUасты сызылған қәріп түрі U
PSбелінен сызылған қәріп түрі S
BODY
HTML
Мұның нәтижесі:
Тәжірибелік сабақ №3.
Web-беттерінің құрылымы.
Гиперсілтеме. Гиперсілтемелерді қолдану. Кесте құру.
Тапсырма 1. Гиперсілтеме. Гиперсілтемелерді қолдану.
Мақсаты: HTML-құжаттарында гиперсілтемелерді құруды үйрену.
WEB - беттерінің басқа WEB - беттеріне қатысты сілтемелерінің болуы - World Wide Web жүйесінің ең тартымды ерекшеліктерінің бірі.
HTML құжаттарында гипермәтіндік сілтемелерді құру өте жеңіл.Ол үшін атрибуты, яғни параметрі бар ашылатын A және жабылатын A тэгтері пайдаланылады.Жалпы сілтемелер жасаған кезде мынадай ерекшеліктерді еске сақтаған жөн.
1.Гиперсілтемелерді құрған кезде НREҒ="..." атрибуты міндетті түрде қажет. Оның сол сілтеме көрсетіп тұрған файл атынан немесе оның URL-адресінен тұрады. Сілтеме-мәтін А мен А тэгтерінің арасына орналасады. Сілтеме сөз броузерде бейнеленген кезде көбінесе оның асты сызылып, көк түспен бейнеленеді.Сол сілтеме сөздің үстіне курсорды қойып тышқанды шерту көрсетілген файлға немесе желі бойындағы URL-адреске көшуді қамтамасыз етеді. Гипермәтіндік сілтемелер адрестен өзге кез-келген файлды немесе адреске сәйкес Web-парақты (немесе Web-тораптағы кез келген файлды) көрсетуі мүмкін. Мысалы, мына жол:
AHREF="C:\Мои документы\Серік.HTML" файл A экранға көк түспен боялған файл сөзін бейнелейді, сол сөзді тышқанмен шерту Менің құжаттарым (оны көрсетпесек, ағымдағы)бумасы ішіндегі Серік.html файлына көшу әрекетін орындайды. Одан қайтып оралу үшін броузер аспаптар панелінің кері қарай батырмасын шерту керек.
Төменгі жол AHREF="dog.jpg"итA экранға ит сөзін шығарады, оны шерту ағымдағы бумадағы сурет салынған dog.jpg файлына көшу ісін атқарады.
Егер сілтіме көрсетіп тұрған Web-парақ басқа бір Web-торапқа орналасқан болса онда HREF=... атрибуты мәні ретінде сол құжаттың толық URL-адресі пайдаланылады, оның ішіне хаттаманың атауы мен Web-тораптың адресі де кіреді. Осындай слітемелер сыртқы сілтеме деп аталады. Мысалы, мынадай жол.
AHREF="http:www.microsoft.comMi crosoftA экранға Microsoft сөзін шығарып, оны шерту Интернет желісіндегі Microsoft компаниясының web-парағының алғашқы бетіне көшуді қамтамасыз етеді. Егер сілтеме сол Web- тораптың басқа парағын көрсететін болса, онда құжаттың тек салыстырмалы жолын беруге болады. Мұндайда ішкі сілтеме құрылады. Ішкі сілтемелерді пайдаланған қолайлырақ, себебі Web-торапты басқа серверге ауыстырған кезде, жеке құжаттар адресіне өзгеріс енгізу талап етілмейді.
2.Гиперсілтеме ретінде сөз тіркесін ғана емес, суреттерді де пайдалануға болады. Суреттер мәтін сияқты сілтеме бола алады. Бұл үшін IMG... тэгі сілтемелерді анықтайтын A және A тэгтерінің арасында орналастырылады. Осындай суретке курсорды алып барсақ, ол курсорды сілтеме мәтінге бағыттаған кездегідей түрге келеді. Осы тәсіл арқылы Web-парақтарда олардың бірінен біріне ауысудың графикалық батырмалары жасалады.
Тапсырма1:
HTMLHEAD
ТIТLЕВидыгиперссылокTITLEHEA DBODY
Ссылка на другуюWeb-страницу
PAHREF="12.html" Списки A
Ссылка внутри Web-страницы
PAHREF="#punkt" Перейти в пункт 3 A
PB ПУНКТ 1B
PB ПУНКТ 2B
PA NAME="punkt"B ПУНКТ 3BA
BODY
HTML
2 Тапсырма. Жүгіртпелі жол
Marquee ... Marquee тегтері мәтіндерді үздіксіз жылжытып отыратын сырғымалы жол түрінде экранға шығады. Бұл тегтің ашылуы кезіндежазылатын біршама атрибуттары бар. Олар сырғымалы жолдың жылжу жылдамдығын, бағытын, әріптердің түсін, т.б. өзгертеді. Енді жиі өзгертілетін параметрлерді және олардың мүмкін мәндерін қарастырамыз.
Benaior-мәтіннің бір бағыты (scrool) немесе қос бағыттада (alternate) жылжуын немесе жылжымай тоқтап тұруын қамтамасыз етеді. Яғни мүмкін мәндері Scrool (alternateslide).
Bgcolor -- сырғымалы жолдың фондық түсін анықтайды.
Direction -- жолдық сырғу бағытын анықтайды.
Оның мүмкін мәндері Left-солға , Right-оңға.
Height -- сырғымалы жолдың биіктігін пиксель арқылы анықталатын бүтін сан.
Оны пайызбен көрсетуге болады.
Width -экрандағы сырғымалы жолдың енін көрсетеді. Оны да биіктік сияқты пайызбен көрсетеміз. (%)
Мысалы:
html
head
titleМысалtitlehead
bodytext=red
center
h2мысал: сырғымалыжол h2hr
h3 Marquee bgcolor = blue behavior= Scrool Direction right=30бұлалғашқысырғымалыжол
Marquee h3
p Marquee bgcolor= green height=30 widh=90 %
Бұлекіншісырғымалыжол Marquee
p Marquee bgcolor= green behavior= alternate Direction= left
Height=30бұлүшіншісырғымалыжол Marquee
hr
center
body
html
3 Тапсырма
Рассмотрим процесс создания нумерованных и маркированных списков. Они создаются примерно одинаковым образом. Список всегда располагается между открывающим и закрывающим тегом списка: OL и OL в случае упорядоченного списка; UL и UL - в случае неупорядоченного. Внутри списка располагаются его элементы. Их заключают между тегами LI и LI.
Таблица начинается открывающимся тегом TABLE и завершается закрывающимся TABLE.
Строки таблицы начинаются открывающимся тэгом TR и завершаются закрывающимся TR, а каждая ячейка таблицы начинается тегом TD и завершается TD.
Құжат құрыңыз және оны өз фамилияңызбен сақтаңыз.
Веб бет негізінде орындалатын Блокнот бағдарламасында 2 құжат құрыңыз. (сделайте заголовок, тело).
Алғашқы құжатта келес тізімді көрсетіңіз:
Мәтінді енгізу үшін сканерлер
1. Жапырақты сканерлер
2. Қол сканерлері
3. Планшетті сканерлер
* Арнайы типті сканерлер
4. Барабанды сканерлер
5. Пішін сканерлер
6. штрих-сканерлер
ос бет үшін HTML- коды келесідей бейнеленеді :
ul
liмәтінді енгізу үшін сканерлер
olliжапырақты сканерлер
liқол сканерлері
liпланшетті сканерлер
ol
liарнайы типті сканерлер
olliбарабанды сканерлер
liпішін сканерлер
liштрих-сканеры
ol
l
Құжатты spisok.htm деп сақтаңыз
Осы веб-беттің денесінде келесі кестені құрыңыз:
Монитор
Клавиатура
Мышь
Системный блок
Такая таблица реализуется следующим кодом:
TABLE
TRTDМониторTD
TDКлавиатураTDTR
TRTDМышьTD
TDСистемный блокTDTR
TABLE
Өз беттеріңізше құжат құрыңыз, оның құрамында келесі тізім енгізілуі керек:
* Жұмыс күндері:
1. понедельник
2. вторник
3. среда
4. четверг
5. пятница
* Демалыс күндері:
6. суббота
7. воскресенье
и таблица:
Прогноз погоды:
Дата
Осадки
Атмосферное давление
15.12.2007
Снег
753 мм.рт. ст.
15.12.2007
Нет
745 мм.рт. ст.
Қзбеттеріңізше орындаңыз.
Келесі кестені құрыңыз Топ туралы мәлімет.
№
ФИО
ИИН
адрес
телефон
хобби
№4 тәжірибелік сабақ. Web-беттердегі бейнелер
1 Тапсырма. Web-бетте графикті орналастыру
1. Блокнот редакторында жаңа Web-бетін құрыңыз. Буманы site деп сақтап, оған page4.html ат беріңіз.
2. TITLE элементінде беттің атын Web-бетіне графикті орналастыру деп көрсетіңіз.
3. BODY тегінде беттің түсін сары-қызыл деп көрсетіңіз.
HTML
HEAD
TITLE Web-бетінде графикті орналастыру TITLE
HEAD
BODY BGCOLOR=" FFA07A "
P ALIGN=CENTER
FONT COLOR="#008080" SIZE="7"B 2 Тәжірибелік сабақ BFONTBR
FONT SIZE="6"I Графикті орналастыру IFONTBRBR
P
BODY
4. siteбумасына компьютердегі кез-келген суретті файлды көшіріп, оған risunok.jpg деп ат ... жалғасы
Сіз бұл жұмысты біздің қосымшамыз арқылы толығымен тегін көре аласыз.
Ф 111-1.81-2014
Тәжірибелік жұмысты орындау үшін әдістемелік нұсқау
6 баспа
Енізілген күн 15.04.2014
ҚАЗАҚСТАН РЕСПУБЛИКАСЫНЫҢ БІЛІМ ЖӘНЕ ҒЫЛЫМ МИНИСТРЛІГІ
М.Х.Дулати атындағы Тараз Мемлекеттік университеті
БЕКІТЕМІН
Информатика кафедрасының
меңгерушісі
_______________ _Тлебаев М.Б._____
қолы аты-жөні
___________________20_____ж.
Интернет технологиялар
пәнінен барлық мамандық студенттеріне арналған
ӘДІСТЕМЕЛІК НҰСҚАУ
Тараз 2014ж.
Интернет технологиялар пәнінен тәжірибелік жұмысты орындауға арналған барлық мамандық студенттеріне арналған әдістемелік нұсқау пәннің жұмыс бағдарламасына сәйкес құрастырылды.
Әдістемелік нұсқауды құрастырған:
Аға оқытушы Төреханова Г.И. ___________________
қызметі, аты-жөні қолы
Аға оқытушы Джакашова Э.А. ___________________
қызметі, аты-жөні қолы
Әдістемелік нұсқау Информатика кафедрасының мәжілісінде қаралып, талқыланды.
Хаттама № __________ ________________20______ж.
№1 Тәжірибелік сабақ
Браузердің бағдарламаларын күйге келтіру
1 Тапсырма. Internet Explorer құралдар тақтасын күйге келтіру.
Жұмысты орындау тәртібі
Жұмыстың мақсаты: Internet Explorer браузер бағдарламасының негізгі мүмкіндіктерін игеру.
Теориялық бөлім:
Для связи с Internet- пен байланыс үшін арнайы -- браузер бағдарламасы керек.
Заманауи браузердің нәтижесінде Internet-ке қосылу үшін қосымша барлық мүмкіндіктер біріктіріледі.
Қазіргі кезде Netscape Navi - gator және Internet Explorer браузерлері атақты болып саналады. Браузердің негізгі мағынасы - Интернеттен Веб-бетін жүктеу және оны экран бетінде бейнелеу
Тәжірибелік бөлім
1. Жұмыс столында құжат құрып оған ат беріңіз.
2. Internet Explorer броузерін ашыңыз.
3. Вид тізіміндегі құралдар тақтасынан қарама қарсы құралдар тақтасындағы барлық жалаушаларды алып тастаңыз.
4. Вид менюінен Строка состояния қосымшасында жалаушаны алып тастаңыз.
5. PrintScreen батырмасын басыңыз.
6. Графикалық редакторды ашыңыз және көшірілгенді жұмыс столына қойыңыз.
7. Internet Explorer құралдар тақтасыны баптау.
ВидПанелиинструментов әрекетінің көмегімен шолушыға қайта оралыңыз, экранда сілтемелерді бейнелеңіз. Paint берілген терезесіне көшіріңіз, оны барлық суреттермен салыстырыңыз және алғашқы суреттегі қайталанған барлық бөлімдерді қырқыңыз. Алынған нәтижені жұмыс столындағы суретке қойыңыз және оны сілтемелер деп жазыңыз
Шолушыға қайта оралыңыз және аналогтік әрекет жасай отырып Адресную строку, Обычные кнопки, строку состояния - ға сол суретті салыңыз оларды жазыңыз.. Аналогты тұлғада көшіріңізПанели обозревателя: Избранное (часто посещаемые веб-страницы), Журнал (список недавно посещённых веб-страниц), Поиск, Папки.
Веб беттерді көру үшін сізге қаріптің көлемін өзгертуді үйренуіңіз керек, барлық веб беттердің бейнелеуінің жылдамдығын арттыру үшін графиканы өшіріңіз.
Беттегі қаріптің қолайлы өлшемін көру үшін келесі қадамды орындау керек ВидРазмер шрифта. Самый крупный түрін таңдаңыз.
Барлық веб беттердің бейнесінің жылдамдығын арттыру үшін графиканы өшіріңіз: меню Сервисшолушы Internet Explorer Свойства обозревателя командасын таңдаңыз.
Дополнительно қосымшасын таңдаңыз.
В группе Мультимедиатобындажалаушадан бір немесе бірнешесін түсіріңіз: Отображать рисунки, Воспроизводить анимацию на веб-страницах, Воспроизводить видео на веб-страницахжәнеВоспроизводить звуки на веб-страницах.
Дисктік кеңістікті үлкейту үшін веб беттегі уақытша сақталған ерекшеленгенді таңдаңыз. Сервисменюінен Internet Explorer шолушы Свойства обозревателякомандасын таңдаңыз.
ОбщиеқосымшасынанПараметрыбатырмасы н басыңыз.
Тәжірибелік сабақ №2.
HTML тілінде мәтінді безендіру
Мақсаты: Қарапайым Web-беттерін дайындауды үйрету
Жұмысты орындау тәртібі
1. HTML-құжат - бұл аты .html қосымшасы бар қарапайым мәтіндік құжат. Мына, HTML-құжатты Блокнотта теріп шығыңыздар:
----------------------------------- ----------------------------------- ----------
htmlheadМенің алғашқы парағым title1-ші мысал \title\head
----------------------------------- ----------------------------------- ----------
body
----------------------------------- ----------------------------------- ----------
H1 Сәлем!H1
----------------------------------- ----------------------------------- ----------
Бұл HTML-құжаттың ең қарапайым мысалы.
----------------------------------- ----------------------------------- ----------
P Мәтіндер алты түрлі көлеммен көрсетіле алады, олардың түсін де, қаріп типін де фон түсіне де өзгертілетін мүмкіндіктер бар. Мәтін ішіне суреттер орналастыруға да болады.
----------------------------------- ----------------------------------- ----------
\P\body\html
Енді осы терілген құжатты, мысалы,TI.html деген атпен дискіде сақтау керек.Сонда оның белгішесі өзгеріп Интернетте көруге болатын түрге айналады.
Бұл TI.html файлын бір мезетте InternetExplorer-де және Блокнотта ашып, оларды түрлендіріп көруге болады. Ол үшін файлды интернет explorer - де ТүрНТМL түрінде (Видв видеНТМL) командаларын орындау қажет. Сонда файлдың алғашқы мәтіні Блокнотта ашылып, оны түрлендіріп өзгерту мүмкіндігіне ие боламыз. Қажетті өзгертулер енгізіп оны қайта, сақтап, осы өзгертулердің HTML- құжатта іске асқанын көру үшін, InternetExplorer-де ТүрЖаңалау (ВидОбновить) командасын орындау керек немесе Саймандар тақтасындағы батырмасын басса болғаны.
Сонымен кез келген программа мәтінін Блокнотта тергеннен кейін, оған өз қалауыңызша ат беріп,оны *.һtml түрінде сақтау керек. Тергеніңіздің нәтижесін экранда көру үшін, оның атын тышқанмен екі шерту керек немесе Internet Explorer-де оны ашу қажет.
2. Програманы оқу ыңғайлы болуы үшін әрбір жол тиісінше қосымша шегіністер арқылы жазылады, бірақ жалпы HTML құжаты үшін оның қажеті жоқ. Тіпті, броузерлер HTML - файлдардағы жолдың соңы символын және көптеген бос орындарды есепке алмайды. Сондықтан біздің мысалымыз мынадай түрде де жазылуы мүмкін:
3. Бұл мысалдағы html ... html белгілерінің ортасына HTML - құжаты жазылады, яғни html құжаттың басын, ал html оның аяқталғанын көрсетеді.
head ... head - бұл қос белгі құжат тақырыбының басын және соңын білдіреді. Бұл бөлімде құжат тақырыбынан басқа әртүрлі қызмет атқаратын мәліметтер(төмендегі title белгісін қараңыз) жазылуы мүмкін, олар жайлы біз кейінірек айтамыз.
title... title
title және title белгілерінің арасында жазылған сөздерді браузер құжаттың аты деп түсінеді де, ол терезе тақырыбында көрсетіледі. Осы құжатты принтер арқылы баспадан шығарғанда, браузер оны әр парақтың сол жақ жоғары бұрышына жазып отырады. Атаудың өте ұзын болмауы дұрыс, әдетте ол 64 символдан аспауы керек.
body ... body- бұл қос белгі HTML - құжаттың негізгі мазмұндық бөлігінің басын және соңын білдіреді.
H1 ... H1 - H6 ... H6
Hi белгісі (мұндағы і - 1 - ден 6 - ға дейінгі бүтін сан) алты түрлі сатыдағы символдар мөлшерін таңдау мүмкіндігін береді. Бірінші сатыдағы тақырып - ең ірісі, алтыншы сатыдағы - ең кішісі.
P ... P немесе P бұндай қос белгі абзацты сипаттайды. Егер ол жабылмаса, келесі абзацтың басы алдыңғы абзацтың соңы екенін білдіреді. Жалпы P және P белгілерінің арасына жазылғандардың барлығы бір абзац ретінде қабылданады.
Hi және P белгілерінің қосымша ALIGN (оқылуы "элайн", ағылшынның "туралау" деген сөзінен) атрибуты болуы мүмкін.
Мысалы:
H1 ALIGN=CENTER Тақырыпты ортаға жылжыту H1 немесе PALIGN=RIGHT Абзацты оң жақ шетке жақындатып туралау түрі P
4. Үйренгеніміздің барлығын тиянақтап, төменгі 2-мысалды орындайық:
Бұдан былай қарапайым HTML-құжатты осы мысалдардағыдай етіп бастан аяқ құрастыруға мүмкіндік бар.
----------------------------------- ----------------------------------- ----------
htmlheadtitle 2-мысалtitlehead
----------------------------------- ----------------------------------- ----------
body
----------------------------------- ----------------------------------- ----------
H1 ALIGN=CENTERсәлем! H1
----------------------------------- ----------------------------------- ----------
H2 бұл HTML-құжаттың сәл күрделірек мысалы h2
----------------------------------- ----------------------------------- ----------
P Енді біз абзацты, тек сол жақ шетке ғана туралап жазбай,
----------------------------------- ----------------------------------- ----------
P ALIGN=CENTERортаға қарайP
----------------------------------- ----------------------------------- ----------
P ALIGN=RIGHTнемесе оң жақ шетке де туралауға болатындығын білеміз.Pbodyhtml
5. Енді біз осы қарапайым HTML-құжатты қалай жақсартуға болатындығын сөз етеміз. Жаңа жолға көшу белгісінен бастайық.
BR белгі абзацты бөлмей, келесі сөзді жаңа жолға көшіру керек болғанда қолданылады. Өлең жазуға өте ыңғайлы. Өлеңнен мысал келтірейік:
htmlheadtitle 3-мысал titlehead
body
H1ӨлеңH2
H2АбайH2
P Айттым сәлем, Қаламқас BR
Саған құрбан мал мен бас. BR Сағынғаннан сені ойлап, BR
Келер көзге ыстық жас. PP Көзімнің қарасы, BR
Көңілімнің санасы. BR
Ғашықтық жарасы Pbody
BODY... BODY тэгтерінің ортасында кuптеген атрибуттар, яѓни параметрлер болады. Олардыњ ?р?айсысы ?+-жаттыњ фонын, ?ріптерінің т%.сін, гиперсілтемелер т%.сін, т.б. аны?тайды. Б+-л тэгтіњ негізгі атрибуттары: BACKGROUND, BGCOLOR, TEXT, LINK, VLINK ж?не ALINK.
BODY 1-параметр=мәні 2-параметр=мәні
3-параметр=мәні...құжаттың негізгі тұлғасы...BODY
1. Параметрлер тізімін толық берудің қажеті жоқ, көбінесе олардың бірде біреуі болмауы мүмкін, мұндайда олардың алдын ала (үнсіз) келісім бойынша бекітілген
2. BGCOLOR - құжаттың жалпы мәтінінің фоны түсін анықтайды, егер ол көрсетілмесе, ақ түс қолданылады. Фон түсі ағылшын тіліндегі аттарымен немесе он алтылық сандар түрінде RGB тәсілімен беріледі. Олар жайында кейінірек айтылады.
Мысалы:
bodybgcolor="yellow"мұнда фон сары түсті болады.
TEXT- мәтін әріптерінің түсін анықтайды, егер ол жазылмаса, келісім бойынша қара түс қабылданған. Фон түсін өзгерткенде соған үйлесімді символдар түсі бекітіледі. Бұл да ағылшын тіліндегі аттарыменнемесе он алтылық сандар түрінде rgb тәсілімен беріледі.
LINК - гипермәтіндік сілтеме ретінде қабылданған сөз тіркесінің түсін белгілейді. Егер көрсетілмесе ол көк түс болып саналады.
VLINR - пайдаланылған гипермәтіндік сілтеме түсін анықтайды. Келісім бойынша ол қызылқоңыр түс болып саналады.
ALINK-ГИПЕРМӘТІНДІК сілтемелі курсор көрсетіп тұрған кездегі оның түсін белгілейді. Бұл параметр өте сирек өзгертіледі.
BACKGROUND- мәтіннің фонында орналасатын суретті анықтайды, ол түсқағаз рөлін атқарады. Суреттік файлдың типі gif немесе jpg болуы тиіс.
Суреттің адресі көрсетілсе, ол интернет желісінен тауып алынады.
Мысалы:
body bgcolor=lighteellow text=red ink=purpplt vlink= mfroon flink=fuschef background="face.jpg"
2. HTML Тілінде түрлі түстер он алтылық сандар түррінде RGB тәсілмен берілуі де (COLOR= "#COFFCO"), мүмкін, оның мүмкіндігі өте мол. Мұндағы алғашқы екі сан қызыл түс бөлігін, келесі екі сан-жасыл түс бөлігін, соңғы екі сан көк түс бөлігін анықтайды. Жоғарыдағы көптеген параметрлер түсті пайдаланады, олар ағылшын тіліндегі негізгі он алты түс атымен немесе солардың кодтарымен төмендегідей түрде беріледі.
Black=#000000 қара
Silve=#COCOCOкүміс түсті
Gray=#808080 сұр
White=#FFFFFақ
Maroon=#80000 қызылкүрең
Purple=# 800080күлгін
Red=#FF00FF қызғыш
Green=#008000 жасыл
Lime=#OOFFOO лимон түсті
Olive=#808000 сары
Yellow=#FFFFOO САРЫ
Navy=#000080 қаракөк
Blue=#OOOOFFКӨГІЛДІР
Teal=#008080 шай түсті
Aqua=#OOFFFF КӨК
htmlHR белгісі көлденең сызық сызады. Бұл белгінің қосымша SIZE (Сызықтың пиксельмен берілген қалыңдығын анықтайды) және WIDH (экранныңеніне қатысты, сызықтың пайызбен берілген ұзындығын анықтайды)атрибуттары бар. 4- мысалда көлденең сызықтардың кішігірім жинағы берілген.
HTMLHEADTITLEСызықтарTITLE HEAD
BODY
H1Бірнеше көлденең сызықтар:H1
HR COLOR=RED SIZE=16 WIDTH=100%BR
HR COLOR=GREN SIZE=8 WIDTH=75%BR
HR COLOR=BLUE SIZE=4 WIDTH=50%BR
HR COLOR=BLACK SIZE=2 WIDTH=25%BRBODYHTML
Бұл жолдардың нәтижесі төмендегідей:
6. Енді түрлі - түсті мәтін жазып үйренейік. Ол үшін басқа түске боялатын мәтін үзіндісін fontcolor="red"...font белгілерінің арасына жазу керек.
htmlheadtitle 3- мысал titlehead
bodyH1Өлең H1H2Абай H2
font color ="red"
PАйттым сәлем, Қаламқас BR
Саған құрбан мал мен бас. BR
Сағынғаннан сені ойлап, BR
Келер көзге ыстық жас. BR
Көзімнің қарасы,BR
Көңлімнің санасы. BR
Бітпейтін іштегі, BR
Ғашықтық жарасы. fontbodyhtml
№№№
Жоғарыда айтылғандарды пайдаланып:
1. Қандайда бір тақырып бойынша семинар болатындығы жайлы хабарлама жазыңыз. Сол құжаттың нәтижесін InternetExplorer-де көргеннен кейін, өз қалауыңызша өзгерістер енгізіп, қайталап сақтаңыз.
Тэгтердің тағы бір арнайы тобы қаріптердің сызылымын (начертание) өзгерту мүмкіндігін береді. B жәнеB тэгтері араларында орналасқан мәтін қарайтылған қәріпке ауысады. I жәнеI тэгтері қәріптерді курсивпен берсе,U және U тэгтері мәтіндердің астын сызып, Sжәне S тэгтері- белдерінен сызылған символдарды бейнелейді.
Мысалы:
HTMLHEADҚәріп типін, түрін, мөлшерін басқару HEAD
BODY
BASEFONT SIZE=4 FASE= "Arial KZ"
Негізгі қаріп Arial KZ типінде төртінші мөлшерменжазылған
PFONT SIZE=-2 FASE="Times New Roman KZ" COLOR= "GREEN"
Бұл мәтін әріптері алдынғыдан екі мөлшерге ұсақтаужәне ол басқа қәріп типі мен жасыл түсті қолданады.
FONT
PBқарайтылған қәріп түрі B
PIқисайтылған курсивпен жазылған қәріп түрі I
PUасты сызылған қәріп түрі U
PSбелінен сызылған қәріп түрі S
BODY
HTML
Мұның нәтижесі:
Тәжірибелік сабақ №3.
Web-беттерінің құрылымы.
Гиперсілтеме. Гиперсілтемелерді қолдану. Кесте құру.
Тапсырма 1. Гиперсілтеме. Гиперсілтемелерді қолдану.
Мақсаты: HTML-құжаттарында гиперсілтемелерді құруды үйрену.
WEB - беттерінің басқа WEB - беттеріне қатысты сілтемелерінің болуы - World Wide Web жүйесінің ең тартымды ерекшеліктерінің бірі.
HTML құжаттарында гипермәтіндік сілтемелерді құру өте жеңіл.Ол үшін атрибуты, яғни параметрі бар ашылатын A және жабылатын A тэгтері пайдаланылады.Жалпы сілтемелер жасаған кезде мынадай ерекшеліктерді еске сақтаған жөн.
1.Гиперсілтемелерді құрған кезде НREҒ="..." атрибуты міндетті түрде қажет. Оның сол сілтеме көрсетіп тұрған файл атынан немесе оның URL-адресінен тұрады. Сілтеме-мәтін А мен А тэгтерінің арасына орналасады. Сілтеме сөз броузерде бейнеленген кезде көбінесе оның асты сызылып, көк түспен бейнеленеді.Сол сілтеме сөздің үстіне курсорды қойып тышқанды шерту көрсетілген файлға немесе желі бойындағы URL-адреске көшуді қамтамасыз етеді. Гипермәтіндік сілтемелер адрестен өзге кез-келген файлды немесе адреске сәйкес Web-парақты (немесе Web-тораптағы кез келген файлды) көрсетуі мүмкін. Мысалы, мына жол:
AHREF="C:\Мои документы\Серік.HTML" файл A экранға көк түспен боялған файл сөзін бейнелейді, сол сөзді тышқанмен шерту Менің құжаттарым (оны көрсетпесек, ағымдағы)бумасы ішіндегі Серік.html файлына көшу әрекетін орындайды. Одан қайтып оралу үшін броузер аспаптар панелінің кері қарай батырмасын шерту керек.
Төменгі жол AHREF="dog.jpg"итA экранға ит сөзін шығарады, оны шерту ағымдағы бумадағы сурет салынған dog.jpg файлына көшу ісін атқарады.
Егер сілтіме көрсетіп тұрған Web-парақ басқа бір Web-торапқа орналасқан болса онда HREF=... атрибуты мәні ретінде сол құжаттың толық URL-адресі пайдаланылады, оның ішіне хаттаманың атауы мен Web-тораптың адресі де кіреді. Осындай слітемелер сыртқы сілтеме деп аталады. Мысалы, мынадай жол.
AHREF="http:www.microsoft.comMi crosoftA экранға Microsoft сөзін шығарып, оны шерту Интернет желісіндегі Microsoft компаниясының web-парағының алғашқы бетіне көшуді қамтамасыз етеді. Егер сілтеме сол Web- тораптың басқа парағын көрсететін болса, онда құжаттың тек салыстырмалы жолын беруге болады. Мұндайда ішкі сілтеме құрылады. Ішкі сілтемелерді пайдаланған қолайлырақ, себебі Web-торапты басқа серверге ауыстырған кезде, жеке құжаттар адресіне өзгеріс енгізу талап етілмейді.
2.Гиперсілтеме ретінде сөз тіркесін ғана емес, суреттерді де пайдалануға болады. Суреттер мәтін сияқты сілтеме бола алады. Бұл үшін IMG... тэгі сілтемелерді анықтайтын A және A тэгтерінің арасында орналастырылады. Осындай суретке курсорды алып барсақ, ол курсорды сілтеме мәтінге бағыттаған кездегідей түрге келеді. Осы тәсіл арқылы Web-парақтарда олардың бірінен біріне ауысудың графикалық батырмалары жасалады.
Тапсырма1:
HTMLHEAD
ТIТLЕВидыгиперссылокTITLEHEA DBODY
Ссылка на другуюWeb-страницу
PAHREF="12.html" Списки A
Ссылка внутри Web-страницы
PAHREF="#punkt" Перейти в пункт 3 A
PB ПУНКТ 1B
PB ПУНКТ 2B
PA NAME="punkt"B ПУНКТ 3BA
BODY
HTML
2 Тапсырма. Жүгіртпелі жол
Marquee ... Marquee тегтері мәтіндерді үздіксіз жылжытып отыратын сырғымалы жол түрінде экранға шығады. Бұл тегтің ашылуы кезіндежазылатын біршама атрибуттары бар. Олар сырғымалы жолдың жылжу жылдамдығын, бағытын, әріптердің түсін, т.б. өзгертеді. Енді жиі өзгертілетін параметрлерді және олардың мүмкін мәндерін қарастырамыз.
Benaior-мәтіннің бір бағыты (scrool) немесе қос бағыттада (alternate) жылжуын немесе жылжымай тоқтап тұруын қамтамасыз етеді. Яғни мүмкін мәндері Scrool (alternateslide).
Bgcolor -- сырғымалы жолдың фондық түсін анықтайды.
Direction -- жолдық сырғу бағытын анықтайды.
Оның мүмкін мәндері Left-солға , Right-оңға.
Height -- сырғымалы жолдың биіктігін пиксель арқылы анықталатын бүтін сан.
Оны пайызбен көрсетуге болады.
Width -экрандағы сырғымалы жолдың енін көрсетеді. Оны да биіктік сияқты пайызбен көрсетеміз. (%)
Мысалы:
html
head
titleМысалtitlehead
bodytext=red
center
h2мысал: сырғымалыжол h2hr
h3 Marquee bgcolor = blue behavior= Scrool Direction right=30бұлалғашқысырғымалыжол
Marquee h3
p Marquee bgcolor= green height=30 widh=90 %
Бұлекіншісырғымалыжол Marquee
p Marquee bgcolor= green behavior= alternate Direction= left
Height=30бұлүшіншісырғымалыжол Marquee
hr
center
body
html
3 Тапсырма
Рассмотрим процесс создания нумерованных и маркированных списков. Они создаются примерно одинаковым образом. Список всегда располагается между открывающим и закрывающим тегом списка: OL и OL в случае упорядоченного списка; UL и UL - в случае неупорядоченного. Внутри списка располагаются его элементы. Их заключают между тегами LI и LI.
Таблица начинается открывающимся тегом TABLE и завершается закрывающимся TABLE.
Строки таблицы начинаются открывающимся тэгом TR и завершаются закрывающимся TR, а каждая ячейка таблицы начинается тегом TD и завершается TD.
Құжат құрыңыз және оны өз фамилияңызбен сақтаңыз.
Веб бет негізінде орындалатын Блокнот бағдарламасында 2 құжат құрыңыз. (сделайте заголовок, тело).
Алғашқы құжатта келес тізімді көрсетіңіз:
Мәтінді енгізу үшін сканерлер
1. Жапырақты сканерлер
2. Қол сканерлері
3. Планшетті сканерлер
* Арнайы типті сканерлер
4. Барабанды сканерлер
5. Пішін сканерлер
6. штрих-сканерлер
ос бет үшін HTML- коды келесідей бейнеленеді :
ul
liмәтінді енгізу үшін сканерлер
olliжапырақты сканерлер
liқол сканерлері
liпланшетті сканерлер
ol
liарнайы типті сканерлер
olliбарабанды сканерлер
liпішін сканерлер
liштрих-сканеры
ol
l
Құжатты spisok.htm деп сақтаңыз
Осы веб-беттің денесінде келесі кестені құрыңыз:
Монитор
Клавиатура
Мышь
Системный блок
Такая таблица реализуется следующим кодом:
TABLE
TRTDМониторTD
TDКлавиатураTDTR
TRTDМышьTD
TDСистемный блокTDTR
TABLE
Өз беттеріңізше құжат құрыңыз, оның құрамында келесі тізім енгізілуі керек:
* Жұмыс күндері:
1. понедельник
2. вторник
3. среда
4. четверг
5. пятница
* Демалыс күндері:
6. суббота
7. воскресенье
и таблица:
Прогноз погоды:
Дата
Осадки
Атмосферное давление
15.12.2007
Снег
753 мм.рт. ст.
15.12.2007
Нет
745 мм.рт. ст.
Қзбеттеріңізше орындаңыз.
Келесі кестені құрыңыз Топ туралы мәлімет.
№
ФИО
ИИН
адрес
телефон
хобби
№4 тәжірибелік сабақ. Web-беттердегі бейнелер
1 Тапсырма. Web-бетте графикті орналастыру
1. Блокнот редакторында жаңа Web-бетін құрыңыз. Буманы site деп сақтап, оған page4.html ат беріңіз.
2. TITLE элементінде беттің атын Web-бетіне графикті орналастыру деп көрсетіңіз.
3. BODY тегінде беттің түсін сары-қызыл деп көрсетіңіз.
HTML
HEAD
TITLE Web-бетінде графикті орналастыру TITLE
HEAD
BODY BGCOLOR=" FFA07A "
P ALIGN=CENTER
FONT COLOR="#008080" SIZE="7"B 2 Тәжірибелік сабақ BFONTBR
FONT SIZE="6"I Графикті орналастыру IFONTBRBR
P
BODY
4. siteбумасына компьютердегі кез-келген суретті файлды көшіріп, оған risunok.jpg деп ат ... жалғасы
Сіз бұл жұмысты біздің қосымшамыз арқылы толығымен тегін көре аласыз.
Ұқсас жұмыстар
Пәндер
- Іс жүргізу
- Автоматтандыру, Техника
- Алғашқы әскери дайындық
- Астрономия
- Ауыл шаруашылығы
- Банк ісі
- Бизнесті бағалау
- Биология
- Бухгалтерлік іс
- Валеология
- Ветеринария
- География
- Геология, Геофизика, Геодезия
- Дін
- Ет, сүт, шарап өнімдері
- Жалпы тарих
- Жер кадастрі, Жылжымайтын мүлік
- Журналистика
- Информатика
- Кеден ісі
- Маркетинг
- Математика, Геометрия
- Медицина
- Мемлекеттік басқару
- Менеджмент
- Мұнай, Газ
- Мұрағат ісі
- Мәдениеттану
- ОБЖ (Основы безопасности жизнедеятельности)
- Педагогика
- Полиграфия
- Психология
- Салық
- Саясаттану
- Сақтандыру
- Сертификаттау, стандарттау
- Социология, Демография
- Спорт
- Статистика
- Тілтану, Филология
- Тарихи тұлғалар
- Тау-кен ісі
- Транспорт
- Туризм
- Физика
- Философия
- Халықаралық қатынастар
- Химия
- Экология, Қоршаған ортаны қорғау
- Экономика
- Экономикалық география
- Электротехника
- Қазақстан тарихы
- Қаржы
- Құрылыс
- Құқық, Криминалистика
- Әдебиет
- Өнер, музыка
- Өнеркәсіп, Өндіріс
Қазақ тілінде жазылған рефераттар, курстық жұмыстар, дипломдық жұмыстар бойынша біздің қор #1 болып табылады.
Ақпарат
Қосымша
Email: info@stud.kz