Веб-бетте графика мен мультимедияны орналастыру

Жұмыс түрі: Реферат
Тегін: Антиплагиат
Көлемі: 11 бет
Таңдаулыға:

ЕСЕП БЕРУ
Тақырыбы: Веб-бетте графика мен мультимедияны орналастыру

Алматы 2020
Мазмұны

КІРІСПЕ 3
Веб-бетте графика мен мультимедияны орналастыру 4
1ші Мысал 6
2ші Мысал 7
3ші Мысал 8
4ші Мысал 11
ҚОРЫТЫНДЫ 13
ПАЙДАЛАНЫЛҒАН ӘДЕБИЕТТЕР 12

Кіріспе
Мәтіннен кейінгі Web-парақтарды толтырудың екінші маңызды құрамдас бөлігі графикалық дизайн болуы сөзсіз. Бұл әртүрлі суреттер, фотосуреттер, тіпті бейнеклиптер. Сондай-ақ, саундтректі веб-парақтарды көрсету үшін қолдана аламыз.
Біз графиканы орналастырудан бастаймыз. Браузерлер графикалық файлдардың үш түрін ғана көрсете алады. Бұл GIF, JPEG және PNG файлдары. GIF файлдары анимациялық кескіндер жасауға мүмкіндік береді. JPEG файлдары көбінесе фотографиялық кескіндерді сақтау үшін қолданылады. Жақында ұсынылған PNG форматы кескіннің жақсы сапасы мен кішігірім кескін файлының көлемін біріктіруге мүмкіндік береді. Бірақ кескін графикалық файлға салынғаннан кейін оны қандай-да бір жолмен веб-параққа енгізу керек.
Ол үшін көптеген параметрлермен img тегін қолданыңыз. Бұл тегтің соңғы жұбы жоқ, өйткені дисплей ережесі үшін ешқандай ауқым жасамайды, ол тек графикалық кескінді веб-парақтың мазмұнына қосады. Шын мәнінде, графикалық сурет гипершилтеме бола алады, тіпті бірнеше гипер сілтемелерді өз артына жасырады, бірақ біз гипер сілтемелер туралы осы тараудың келесі бөлімінде айтатын боламыз, бірақ әзірге img тегін қолдану ережелерін анықтайық.

Веб-бетте графика мен мультимедияны орналастыру
img тегінің негізгі және қажетті атрибуты - src атрибуты. Бұл атрибуттың мәні енгізілетін графикалық файлдың адресі немесе дәлірек айтқанда оның URL мекенжайы болып табылады. Егер графикалық файл бір веб-серверде орналасқан болса, онда файлдың толық атауын, оның ішіне жолды қосалқы каталогтарға жазып алу жеткілікті, яғни егер суреттер каталогы веб-парақтары бар HTML файлдарымен бірдей қалтада болса. кескіндер, содан кейін графикалық кескін кірістіру тэгі келесідей болады:
img src="imagespictl .gif "
Бұл мысалда біз pictl.gif деп аталатын файлда кездесетін GIF кескінін қолданамыз, ол өз кезегінде суреттер деп аталатын каталогта орналасқан. Қиғаш сызықтар DOS және Windows амалдық жүйелерінің файл жолдарында қолданылғаннан гөрі қарама-қарсы бағытта қиғаш қиғаш сызықтар екенін ескеру қажет. Шындығында, веб-серверлер бастапқыда файлдық жүйені осындай қиғаш сызықтармен қолдайтын Unix операциялық жүйесіне негізделген. Әзірге веб-сайтты орналастыратын сервер қандай операциялық жүйеде екендігі маңызды емес, барлық жолдар бірдей жазылады және серверлік бағдарламалық жасақтама дұрыс өңделеді.
WWW дамуының басында браузерлер тек мәтіндік ақпараттарды көрсетті, графикаға қолдау көрсетілмеді. Енді олар іс жүзінде табылмады, бірақ кез-келген шолғышта графиканы жүктеуді өшіру мүмкіндігі бар. Сондықтан суреттің әрдайым мәтіндік көрінісін пайдалану керек. Жай, суреттің орнына көрсетілетін мәтінді дайындау керек, егер оны қандай да бір себептермен шолғыш жүктей алмаса. Бұл мәтін ait параметрін қолдана отырып, img тегіне қосылады, оның мәні қажетті мәтін жолын құрайды, яғни келесі құрылымға ұқсас нәрсе аласыз:
img src="imagespictl.gif" alt="Это я на отдыхе"
Графикалық кескін әлі де шолғышта көрсетілетін жағдайда, пайдаланушы тінтуір курсорын қажетті графикалық кескіннің үстіне апарған кезде альтернативті мәтіндік ұсыныстың мәтіні тұспал түрінде, қысқа мәтіндік нұсқаулар түрінде көрсетіледі.
Сонымен қатар, осындай мәтіндік шақыруларды жасаудың егжей-тегжейлі нұсқасы бар. Longdesc параметрі осы графикалық кескіннің толық сипаттамасы орналасқан интернет-ресурстың мекен-жайын белгілейді. Бұл параметрдің мәні, әрине, суреттің сипаттамасымен ресурстардың URL мекен-жайы болып табылады.

Name параметрі веб-парақ дизайнының осы элементін анықтайтын кескін үшін ерекше атауды көрсетуге мүмкіндік береді. Бұл параметр артқы үйлесімділік мақсатында сақталды, ол HTML стандартының алдыңғы нұсқаларынан қалды. Енді барлық тегтер осы мақсат үшін id параметрін қолданады.
Әдепкі бойынша графикалық кескін дәл сол және тік және көлденең өлшемдермен жасалынған түрде көрсетіледі. Алайда, бізде сурет өлшемін өз қалауымыз бойынша нақты қою мүмкіндігі бар. Бұл биіктік пен ендік параметрлерін қолдану арқылы жасалады. Біз өлшемдерді пиксельмен немесе процентпен қалай орнатуға болатындығын білеміз. Браузерлер суреттің пропорцияларын сақтауға бейім болатындығын ескеру керек, сондықтан пропорцияларды өзгертетін өлшемдердің анық параметрін шолушы елемеуі мүмкін, ал шолғыш пропорцияларды бұзбай қолданушы көрсеткен өлшемдерге мүмкіндігінше жақын болатын өлшемдерді таңдайды. Сондықтан графикалық кескіндер әдетте веб-беттерге веб-беттерде көрсетілген кезде қолданылатын өлшемдерде дайындалады. Егер бір кескінді әр түрлі өлшемдермен бірнеше рет көрсету керек болса, онда суреттердің өз бетінше бейнеленуін веб-парақтардың барлық орналасуын бұза алатын браузерге бергеннен гөрі бірнеше графикалық файлдарды дайындау оңайырақ.
Жиек параметрімен суретті қоршап тұрған жиектің қалыңдығын орнатуға болады. Әдеттегідей, параметр мәні - бұл қалыңдығын пиксельмен көрсететін сан. Әдепкі мәні нөлге тең, бұл шекараны көрінбейтін етеді.
Сондай-ақ, графикалық объектінің айналасында ағып жатқан мәтінге қатысты туралануын айту керек. Ол үшін align параметрі қолданылады. Оның мәні ретінде алдын-ала анықталған кілт сөздерінің бір кілт сөзін қолдануға болады. bottom , middle және top мәндері суреттің айналасында тігінен ағып жатқан мәтіннің бірінші жолын орналастыру үшін қолданылады. top мәні оны жоғарыға, bottom - төменге, ал middle жолды тігінен орталықтандыруға мүмкіндік береді. Графикті көлденең туралау үшін left and right мәндері қолданылады. Бірінші мән left , сіз болжағандай, суретті ол көрсетілетін қораптың сол жақ шетіне, ал right - оңға жылжытады.
Енді суретті қалай орналастырып, оны қажетті графиканың айналасында жүретін мәтінмен үйлестіре алатынымызды мысалдармен көретін кез келді.

!DOCTYPE HTML PUBLIC "-W3CDTD HTML 4.01EN"
"http:www.w3.orgTRhtm!4strict. dtd"
html
head
titleРисунки и текстtitle
body
рЭто текст, который обтекает рисунок.img src="redhood.gif"
Это текст, который обтекает рисунок. Это текст, который обтекает рисунок.
Это текст, который обтекает рисунок.р
body
html
Браузер көмегімен көрсетілген кезде осы HTML құжатының пайда болуы суретте көрсетілген

Мысалда келтірілген файлды көрсету нәтижесі бар браузер терезесі
Бұл мысалда біз қосымша параметрлерсіз таза сурет кірістіру тегін қолдандық. Көріп отырғанымыздай, сурет бірінші сөйлемнен кейін бірден енгізіледі, онда біз img тегін орналастырдық. Сонымен қатар, егер біз бірінші сөйлем мен сурет бір жолға сәйкес келмейтіндей етіп, браузердің қарау терезесінің өлшемін көлденеңінен кішірейтетін болсақ, онда сөйлем алдымен пайда болады, ал оның астында көрініс терезесінің сол жақ шетіне басылған сурет. Оның оң жағында, одан кейінгі мәтін жолдың негізгі сызбасы суреттің төменгі жиегімен тураланатын етіп көрсетіле бастайды.

Енді кескінді көрсету тегіне көлденең туралау параметрін қосайық.
!DOCTYPE HTML PUBLIC "-W3CDTD HTML 4.01EN"
"http:www.w3.orgTRhtml4strict. dtd"
html head
titleРисунки и текстtitle body
рЭто текст, который обтекает рисунок.img src="redhood.gif"
align="ieft"
Это текст который обтекает рисунок. Это текст, который обтекает рисунок.
Это текст, который обтекает рисунок.р
body
html

Көріп отырғаныңыздай, бұл жағдайда мәтін қайтадан көрсетіле бастайды, содан кейін align параметрін пайдаланып берілген директиваға сәйкес сол жақ шетіне басылған графикалық кескін, ал қалған мәтін кескіннің оң жағына орналастырылады, яғни сурет бірінші жолды ала алмайды өйткені ... жалғасы

Сіз бұл жұмысты біздің қосымшамыз арқылы толығымен тегін көре аласыз.