Ang isang tag ay ginagamit upang magpasok ng isang imahe sa teksto ng isang Web page. (Talahanayan P 1). Itinatakda ng mga katangian ng tag na ito ang lahat ng parameter ng larawang inilagay sa page. Kinakailangan ang katangian ng SRC, na tumutukoy sa address at pangalan ng graphic file. Kung ang katangian ng SRC ay hindi nakatakda, tanging ang blangko na icon ng imahe ang ipapakita.

Istraktura ng tag na may katangian ng SRC ay ganito ang hitsura:

.

Kung ang isang graphic file na pinangalanang Institute ay matatagpuan sa parehong folder ng Web page, pagkatapos ay upang ilagay ito dapat mong isulat:

.

Format ng pangalan ng file

Upang maglagay ng graphic file na may pangalang MINSK, na matatagpuan sa D:\Collection\Cities\MINSK.GIF, dapat kang sumulat .

Gamit ang isang tag Ang Web page ay naglalaman ng isang graphic na file na matatagpuan sa ibang computer sa Internet.

Upang lumikha ng isang Web page na may larawan ng aming institute, na ipinapakita sa Fig. 4.1, kailangan mong ipasok ang sumusunod na HTML code:

Ang aming Institute

kanin. 4.1. Web page na may larawan ng instituto

Sa halimbawa sa itaas, ang taas ng larawan (HEIGHT) ay 200 pixels at ang lapad (WIDTH) ay 300 pixels. Upang ilagay ang larawan, isang talata ang ginawa gamit ang pagkakahanay sa gitna.

Mga linyang pahalang

Ang mga pahalang na linya ay inilalagay sa isang Web page gamit ang isang tag

---

. Gamit ang mga katangiang SIZE, WIDTH, COLOR at ALIGN, babaguhin mo ang kapal, lapad, kulay at paraan ng pag-align ng mga linya, ayon sa pagkakabanggit.

Tingnan natin ang ilang halimbawa upang ipaliwanag ang paglalagay ng mga pahalang na linya:

1.

---

- isang pahalang na linya sa buong pahina, 2 pixel ang kapal.

2.

---

WIDTH = "200" ALIGN="RIGHT"> – isang pahalang na linya ng berdeng kulay, 15 pixels ang kapal, 200 pixels ang lapad at naka-align sa kanan.

3.

---

– isang pahalang na asul na linya na sumasaklaw sa buong pahina, 25 pixels ang kapal.

4.

---

WIDTH = "300" ALIGN = "LEFT"> – isang pahalang na linya ng pulang kulay, 20 pixels ang kapal, 300 pixels ang lapad at naka-align sa kaliwa.

Ang pagpapakita ng linya para sa apat na naitala na mga halimbawa ay ipinapakita sa Fig. 4.2.

kanin. 4.2. Mga linya sa isang Web page

MGA TABLE

Paglikha ng mga talahanayan

Ang talahanayan ay nilikha gamit ang isang nakapares na tag

… . Ang tag na ito ay gumagawa ng isang talahanayan sa lokasyon kung saan ito idinaragdag
sa HTML code.

Ang anumang talahanayan ay binubuo ng mga hilera, at mga hilera - ng mga cell. Ang mga sumusunod na tag ay ginagamit upang bumuo ng mga hilera ng talahanayan at mga cell:

... - bagong linya;

... – header cell;

... – isang regular na cell ng mesa.

Ang mga tag na ito ay nakasulat sa loob ng isang nakapares na tag

… .

Ang talahanayan ay nabuo hilera sa hilera - unang isang hilera ay tinukoy at ang kinakailangang bilang ng mga cell ay ipinahiwatig dito, pagkatapos ay ang pangalawang hilera, atbp.

Upang makuha ang talahanayan na ipinapakita sa Fig. 5.1, kailangan mong i-type ang sumusunod na HTML code:

kanin. 5.1. Pahina ng talahanayan

Ang teksto sa mga cell ng header ng talahanayan (Larawan 5.1) ay ipinapakita sa semi-bold na font at naka-align sa gitna ng cell, habang sa mga regular na cell ang teksto ay hindi naka-highlight at naka-align sa kaliwa.

Dapat tandaan na sa HTML code ng pahina sa itaas ang tag

Mga sasakyan	Presyo	Ford	5000	Golf	6000

naglalaman ng attribute na BORDER na may value na "1". Nangangahulugan ito na sa talahanayan na ipinapakita sa Fig. 5.1, ang kapal ng panlabas na hangganan ay
1 pixel. Kung magsusulat tayo

… ,

pagkatapos ay ang kapal ng panlabas na hangganan ay magiging 6 na pixel. Upang maiwasang maipakita ang mga hangganan ng talahanayan, dapat mong itakda ang katangian ng BORDER sa 0, o alisin lamang ang katangiang ito.

Karamihan sa mga Web page ay naglalaman ng mga graphics. Pinapayagan ka nitong ipakita ang impormasyon nang makulay at malinaw. Sa maraming pagkakataon, mas mainam na magpakita ng larawan kaysa magbigay ng mahabang paglalarawan ng teksto.

Mayroong dalawang paraan upang maglagay ng mga graphics sa isang page:

• pagpasok ng mga indibidwal na larawan;
• pagpuno sa background ng isang larawan.

Sa anumang kaso, ang graphic na imahe ay kinuha mula sa file.

Paglalagay ng Graphics

Ang paglalagay ng isang graphic na larawan mula sa isang graphic na format na file sa isang pahina ay ginagawa gamit ang tag (mula sa English, image - image) na nagsasaad ng file address bilang argumento ng SRC attribute:

< IMG SRC = "адрес_графического_файла" >

Ang graphic na file address ay alinman sa isang URL o pangalan ng file, posibleng may path. Halimbawa, upang magpakita ng graphic file na logotip.jpg dapat mong isulat ang tag:

< IMG SRC = "logotip.jpg" >

Upang pataasin ang bilis ng paglipat ng isang graphic na larawan sa isang tag maaari mong gamitin ang katangian ( karagdagang parameter) LOWSRC, na kumukuha ng address ng isang graphics file bilang argumento. Maaari kang lumikha ng dalawang graphic na file: ang isa (halimbawa, sabihin nating logotip.jpg) ay naglalaman ng isang mataas na resolution na imahe, at ang isa pa (halimbawa, logotip.gif) ay naglalaman ng isang mababang-resolution na larawan. Pagkatapos ay ang tag:

< IMG SRC = "logotip.jpg" LOWSRC = "logotip.gif" >

...nagtuturo sa browser na i-download muna ang logotip.gif file, at pagkatapos ay palitan ito ng logotip.jpg file habang ito ay natanggap.

Ang isa pang paraan para mapabilis ang paglo-load ng mga graphic ay ang pagtakda ng laki ng hugis-parihaba na lugar kung saan ilalagay ang graphic gamit ang mga katangian. LAWAK(lapad) at TAAS(taas), sinusukat sa mga pixel. Kung tinukoy mo ang mga katangiang ito, maglalaan muna ang browser ng espasyo para sa mga graphics, ihahanda ang layout ng dokumento, ipapakita ang teksto, at pagkatapos lamang i-load ang mga graphics. Tandaan na ang browser ay nag-compress o nag-uunat sa imahe upang magkasya sa loob ng tinukoy na laki ng frame. Isang halimbawa ng pagtukoy ng mga sukat ng larawan:

< IMG SRC = "logotip.gif" WIDTH = 40 HEIGHT = 20 >

Ang mga graphic ay kadalasang ginagamit kasabay ng teksto, kaya ang hamon ng pag-align ng teksto at mga graphic ay lumitaw. Ang problemang ito ay nalutas gamit ang katangian I-align tag gamit ang iba't ibang argumento. Halimbawa, maaaring gusto naming dumaloy ang teksto sa paligid ng isang larawan sa kanan o kaliwa. Karaniwan ang larawan ay malapit na naka-embed sa teksto, na maaaring maging pangit. Upang maiwasan ito, maaari kang magtakda ng mga walang laman na margin sa paligid ng ilustrasyon. Ang mga patlang ay nilikha gamit ang mga katangian VSPACE para sa itaas at ibabang mga margin at НSPACE para sa mga gilid ng gilid sa isang tag . Ang mga argumento sa mga katangiang ito ay tinukoy bilang mga numero na tumutukoy sa laki ng mga patlang sa mga pixel. Upang kanselahin ang text wrapping sa paligid ng mga graphics, gamitin ang tag
.

Ang sumusunod na tag ay nagtatakda ng mga graphic mula sa logotip.jpg file upang ibalot sa kanan (ang larawan ay matatagpuan sa kaliwa ng teksto):

< IMG SRC = "logotip.jpg" ALIGN = LEFT >

Kung gusto mong maglagay ng larawan sa kanan ng teksto, kailangan mo ang katangian I-align magtalaga ng argumento TAMA:

< IMG SRC = "logotip.jpg" ALIGN = RIGHT >

Upang itakda ang mga patlang sa paligid ng larawan, kailangan mong magsulat ng isang tag tulad ng:

< IMG SRC = "logotip.jpg" ALIGN = LEFT HSPACE = 20 VSPACE = 10 >

Dito tinutukoy ng mga numero 20 at 10 ang laki ng mga patlang.

Tingnan natin ang isang halimbawa pagbabahagi mga graphic at teksto. Buksan ang Notepad (text editor Notepad) Windows. Isulat ang HTML code dito gamit ang mga tag na tinalakay sa itaas. Nasa ibaba ang isang program na naglalabas ng ilang text at graphics. Maaari mong gamitin ang alinman sa mga file na mayroon ka bilang isang graphic file. Ang file na ginamit dito ay logotip.gif.

< HTML >

< HEAD >

< TITLE >Ehersisyo 1< / TITLE >

< / HEAD >

< BODY BGCOLOR = "YELLOW" >

< IMG SRC = "logotip.gif " ALIGN = LEFT >

< H1 >Ang teksto ay bumabalot sa mga graphics sa kanan< / H1 >

kanin. 657. Ang teksto ay bumabalot sa larawan sa kanan

Malawak na mga posibilidad para sa tumpak na pagpoposisyon ng mga larawan (pati na rin ang iba pang mga elemento) sa pahina ay nagbibigay mga mesa At mga istilo. Ang mga elemento ng HTML na ito ay tatalakayin sa ibang pagkakataon. Halimbawa, maaari mong tukuyin ang isang talahanayan na walang nakikitang mga frame, at maglagay ng mga larawan, teksto at iba pang mga elemento sa mga cell ng talahanayang ito.

Kahulugan 1

Ang web page ay text file, nilikha sa HTML at naka-host sa World Wide Web (WWW). Bilang karagdagan sa teksto, ang isang Web page ay maaaring maglaman ng mga hypertext na link kung saan maaari kang mag-navigate sa iba pang mga Web page at tingnan ang mga ito, pati na rin ang mga pagsingit sa anyo ng mga graphics, animation, mga video clip at musika.

Gamit ang HTML maaari mong:

1. Lumikha at mag-edit ng mga Web page.
2. I-edit ang mga dokumento ng HTML mula sa Internet, na isinasaalang-alang ang paggana ng lahat ng mga bagay na naka-embed sa dokumento (mga larawan, animation, atbp.).
3. Gamit ang mga hypertext link at ang kakayahang mag-embed ng mga guhit, diagram, animation, video clip, musika at saliw sa pagsasalita, mag-text ng mga special effect sa isang HTML na dokumento, lumikha mga presentasyong multimedia, mga slideshow, mga demo project.

Tandaan 1

Ang mga graphic na larawan ay karaniwang nakaimbak sa magkahiwalay na mga file. Ang wikang HTML ay may mga espesyal na tag kung saan nakasulat ang mga link sa mga code ng mga Web page, na siyang aktwal na mga address ng mga file na ito sa Internet. Kapag nakatagpo ng ganitong mga tag, ang Web browser ay humihiling sa Web server para sa kaukulang file na may larawan, audio o video at ipinapakita ito sa Web page sa lokasyon ng tag na ito. Anumang data (mga imahe, audio at video, atbp.) na nakaimbak sa mga file na hiwalay sa Web page ay tinatawag na mga naka-embed na elemento ng mga Web page. Tingnan natin ang proseso ng pagdaragdag ng larawan sa isang Web page.

Pagdaragdag ng Mga Larawan sa isang Web Page

Ang pagiging kaakit-akit ng mga Web page ay tiyak na nakasalalay sa mga graphic at iba pang iba't ibang bagay na ginamit sa kanila. Ang pagdaragdag ng isang imahe sa isang pahina ay hindi mahirap. At magdagdag ng mga graphics na magagawa hitsura Ang mga web page ay mas presentable at propesyonal, mas kumplikado, at mangangailangan ng espesyal na kaalaman.

Maaari kang magdagdag ng larawan sa isang page gamit ang tag ng pinagmulan ng larawan, na mukhang:

nasaan ang tag mismo, at ang scr ay ang katangian nito. Dahil kinakailangan ang scr attribute, masasabi nating ang buong entry na ito ay isang karaniwang tag. Ang tag ng pinagmulan ng larawan ay hindi gumagamit ng katumbas na pansarang tag dahil ang tag ng pinagmulan ay nakapag-iisa at samakatuwid ay nangangailangan ng pansarang slash sa dulo kapag ginamit: .

Pagdaragdag ng mga alternatibong caption

Sa Internet, madalas mong mahahanap ang iba't ibang mga inskripsiyon na ipinapakita kapag ini-hover mo ang iyong mouse sa anumang graphic na bagay sa isang Web page. Ang mga caption na ito ay karaniwang naglalaman ng karagdagang impormasyon tungkol sa larawan mismo o tungkol sa lugar ng pahina kung saan ito matatagpuan.

Nasa ibaba ang HTML code na may alt attribute na idinagdag sa loob ng tag. Ang katangiang ito, na katulad ng src attribute, ay nagsasabi sa browser ng ilang karagdagang impormasyon tungkol sa larawan at maaari ding palaging gamitin kasama ng isang tag.

alt="Ito ay isang larawan!" />!}

Ang function ng alt attribute ay upang tukuyin ang alternatibong text para sa isang graphic na elemento na idinagdag sa isang Web page. Ito ay tinatawag na alternatibo dahil ito ay ipinapakita sa screen bilang isang alternatibo sa imahe mismo. Ang alt attribute ay gumaganap ng isa pang mahalagang function. Binibigyang-daan nito ang taga-disenyo ng web na makatiyak na kung ang isang bisita ng pahina ay hindi makakita ng isang larawan sa kanyang screen, makikita niya man lang ang impormasyon ng teksto na idinagdag sa larawang ito.

Kapag ginagamit ang alt attribute para sa bawat tag, mahalagang maging maingat na huwag magtalaga ng mga hindi naaangkop na text message sa mga graphic na elemento. Halimbawa, walang punto sa pagdaragdag ng mga alternatibong label ng teksto sa mga elemento ng disenyo ng pahina. Upang maiwasan ang mga ganitong error, maaari mong itakda ang alt attribute ng mga elementong ito sa isang walang laman na value (alt=" "). Kung hindi ka magtatakda ng anumang iba pang mga katangian, ire-render ng browser ang larawan sa orihinal na laki nito, ngunit ihahanay ang tuktok na gilid ng larawan sa tuktok na gilid ng katabing text string. Gayunpaman, maaari mong baguhin ang parehong mga setting na ito gamit ang mga tag ng stylesheet.

Mga Katangian ng Larawan

Ang tag ay may mga katangian na nagbibigay-daan sa iyong baguhin ang laki ng mga larawan. Narito ang ilan sa mga ito:

• taas - ito ay ginagamit upang matukoy ang taas ng imahe sa mga pixel o porsyento;
• lapad - ito ay ginagamit upang matukoy ang lapad ng imahe sa mga pixel o porsyento.

Pagsasaayos ng taas at lapad ng larawan

Ang mga sukat ng mga larawang inilagay sa mga Web page ay maaaring itakda gamit ang mga katangian sa itaas. Bukod dito, ang kanilang mga halaga ay itinakda alinman bilang isang nakapirming bilang ng mga pixel, o bilang isang porsyento na nauugnay sa laki ng pahina. Sa HTML code sa ibaba, ang unang tag ay naglalaman ng mga sukat ng orihinal na larawan sa mga pixel (60 pixels patayo at 60 pixels pahalang), ang pangalawang tag ay nagtatakda ng lapad ng parehong larawan sa 6% ng lapad ng pahina, at ang taas sa 10% ng taas ng page.

alt="Ito ay isang larawan!" taas="60" lapad="60" />

alt="Ito ay isang larawan!" taas="10%" lapad="6%" />

Tandaan 2

Kapag nagpapakita ng mga larawan sa sarili nitong window, ang browser ay gumagawa ng parehong mahusay na trabaho sa pagproseso ng parehong uri ng mga halaga. Gayunpaman, kailangan mong tandaan na ang mga bisita sa mga Web page ay maaaring may ibang screen resolution kaysa sa iyo sa kanilang mga computer. Samakatuwid, kapag binabago ang laki ng isang imahe, dapat mong tukuyin ang parehong mga halaga ng imahe (taas at lapad). Kung babaguhin mo lamang ang isa sa mga halagang ito, ang imahe sa screen ay maaaring lumitaw na nakaunat nang patayo o pahalang.

Maaari itong magamit upang lumikha ng ilusyon ng mas mabilis na pag-load ng mga imahe. Upang gawin ito, dapat mong palaging tukuyin ang mga halaga ng mga katangian ng taas at lapad, hindi alintana kung ang imahe ay binago o hindi. Dahil sinasabi nila sa browser ang mahalagang impormasyon tungkol sa dami ng espasyong kinakailangan para maglagay ng larawan sa isang page. Bilang tugon, inilalaan ng browser ang puwang na kinakailangan para sa larawan at patuloy na bumubuo ng iba pang mga elemento ng pahina nang hindi tumitigil sa paglo-load ng larawan mismo. Ginagawa nitong lumilitaw na mas mabilis na naglo-load ang pahina dahil hindi na kailangang hintayin ng mga bisita na ganap na ma-load ang larawan bago makakita ng iba pang impormasyon sa pahina.

Upang matiyak na ang imahe sa anumang screen, anuman ang resolution nito, ay sumasakop nang eksakto sa isang tiyak na halaga ng espasyo sa lapad ng pahina, kinakailangang gumamit ng mga halaga ng porsyento. Kung nais mong maging pare-pareho ang resolution ng larawan mismo (laki nito sa mga pixel), kailangan mong gumamit ng mga halaga sa mga pixel.

Pag-align ng text at graphics

Upang i-align ang isang larawan sa kanan o kaliwang gilid ng isang linya ng text, gamitin ang align attribute ng tag. Halimbawa:

alt="Ito ay isang larawan!" height="60" width="60" align="right" />

Upang ihanay ang isang imahe nang patayo sa isang text string, maaari mo ring gamitin ang attribute na ito, na maaaring kunin ang mga value sa itaas, ibaba, at gitna. Tinutukoy ng itaas na halaga na ang tuktok na gilid ng larawan ay dapat na nakahanay sa tuktok na gilid ng nakapalibot na teksto. Tinutukoy ng ibaba ng halaga na ang ilalim na gilid ng larawan ay dapat na nakahanay sa ilalim na gilid ng nakapalibot na teksto. Tinutukoy ng value center na ang gitna ng larawan ay dapat na nakahanay sa gitna ng linya ng text.

Paggamit ng mga larawan bilang mga link

Ginagamit din ang mga imahe upang lumikha ng mga hyperlink sa iba pang mga dokumento. Sa HTML, ang isang imahe ay nagiging hyperlink sa parehong paraan tulad ng isang text box. Upang gawin ito, ginagamit ang isang tag na naglalagay ng elemento ng page (sa aming kaso, isang larawan) na dapat maging isang link. Ang link ay susundan ng pag-click sa larawang ito.

Mga larawan ng thumbnail

Bilang karagdagan sa pamamaraan sa itaas, kung saan gumaganap ang isang imahe bilang isang hyperlink, maaari din itong gamitin bilang isang hyperlink na lumilipat mula sa isang imahe patungo sa isa pa. Ito ay kinakailangan sa mga kaso kung saan ang laki ng imahe na gusto mong i-publish sa isang Web page ay medyo malaki at aabutin ng napakatagal na oras upang mai-load, na hindi katanggap-tanggap para sa maraming mga bisita. Samakatuwid, gumagawa sila ng pinababang kopya ng larawang ito (thumbnail) at kinakatawan ito ng isang hyperlink. Kung interesado ang isang bisita sa pahina sa larawang ito, maaari niyang i-click ang thumbnail upang tingnan ang buong larawan. Narito ang isang halimbawa ng code:

alt="I-click upang makita ang normal na larawan."

taas="60" lapad="60" />

Mga Lihim sa Matagumpay na Paggamit ng Mga Larawan

Ang mga imahe ay nagbibigay ng maraming visual na impormasyon para sa mga bisita, at ito ay ginagawang kaakit-akit sa kanila, at ang mga ito ay medyo simple upang idagdag sa isang Web page, ngunit may ilang mga patakaran para sa paglikha ng isang site na dapat sundin kung gusto namin itong maging popular sa ang Internet.

Kapag lumilikha ng mga pahina, dapat mong subukang maglagay ng maliliit na larawan sa mga ito, dahil ang malalaking larawan ay magtatagal upang mai-load, at ang ilang mga gumagamit ay gumagamit pa rin ng mababang bilis ng mga channel ng komunikasyon upang ma-access ang network. throughput, at samakatuwid ang laki ng mga na-download na file ay napakahalaga para sa kanila.

Tandaan 3

Ang kabuuang sukat ng file ng buong HTML na dokumento ay mahalaga din, na, sa turn, ay depende hindi lamang sa laki ng mga imahe na nakapaloob dito, kundi pati na rin sa kanilang numero. Kailangan mong maging maingat sa paggamit ng alt attribute upang ang nilalaman ng text message ay palaging tumutugma sa larawan mismo. At sa kabaligtaran ng kaso: kinakailangan upang matiyak na ang imahe ay tumutugma sa impormasyon ng teksto na ipinakita sa pahina.

Kapag gumagamit ng mga larawang hiniram mula sa Internet sa pahinang iyong nililikha, kailangan mong suriin kung ang mga larawang ito ay protektado ng copyright.

Tulad ng nabanggit, HTML ngayon ang batayan para sa pagsulat ng anumang web page sa World Wide Web. Kapag gumamit ka ng CSS, kapansin-pansing nagbabago ang paggawa ng HTML code. Maaari kang magpaalam sa repurposing clunky HTML tags para lang makamit ang ilang partikular na visual effect. Tungkol sa ilang HTML tag o attribute, gaya ng hindi na ginagamit na tag...

bahay

Mag-order ng isang website at magsimulang magnegosyo!

Ang pariralang ito ay maaaring marinig at makita sa maraming mga site, at ito ay hindi walang kabuluhan!

Website — ito ang mukha ng kumpanya. At ito ang pinakamoderno at epektibong channel ng komunikasyon sa mga potensyal na mamimili. Tanging ang mga kakayahan ng isang site sa Internet ang nagpapahintulot sa iyo na ganap na gamitin ang lahat ng mga paraan ng paghahatid ng mensahe ng impormasyon sa gumagamit. Maaaring ipakita ang impormasyon ng teksto, audio at video sa loob ng isang site upang maging pamilyar ang mamimili sa kanila.

Sa pamamagitan ng paggamit software Sa site, maaari kang tumanggap ng mga pagbabayad, makipag-usap sa telepono, mapanatili ang mga database, magpadala at tumanggap ng mga fax, makipagpalitan ng mga mensaheng SMS at magsagawa ng maraming iba pang mga aksyon. Ang isang modernong Internet site ay isang sentro ng impormasyon hindi lamang para sa anumang kumpanya, kundi pati na rin para sa sinumang gumagamit ng Internet.

At ito ay isang win-win na paraan upang mabisa at kasabay nito ay simple at malinaw na maiparating ang iyong mga ideya o pag-unlad sa pinakamalawak na madla. At ngayon, ang mga dokumento sa Web na nakasulat sa hypertext markup language na HTML ay patuloy na pangunahing anyo ng pagtatanghal ng data sa kapaligiran ng Web.

Ang pinakamahalagang pakinabang ng HTML ay:

• pagiging simple, na nagbibigay-daan sa iyong matuto ng HTML sa pinakamaikling posibleng panahon.
• kakayahang lumikha ng iyong sariling mga Web page
• at ang HTML ay gumagana nang eksakto sa lahat ng mga platform na umiiral ngayon; At sapat na upang gamitin ang anumang magagamit text editor, halimbawa Notepad.

Sa site na ito, sinubukan kong ilarawan nang detalyado ang buong proseso ng paglikha ng iyong sariling Web site, lalo na ang pag-publish ng natapos na proyekto sa Internet upang magbigay ng access dito sa lahat ng mga gumagamit.

Umaasa ako na ang aking mga artikulo ay magiging lubhang kapaki-pakinabang sa marami, dahil ako mismo ay hindi isang programmer, ngunit ako ay lubos na inspirasyon ng gawaing ito.

Ang mga graphic na larawang inilagay sa isang Web page ay hindi lamang nag-aambag sa mas mahusay na pang-unawa sa impormasyon, ngunit ginagawang mas malinaw at hindi malilimutan ang mga pahina. Maaari kang maghanda ng mga graphic na larawan sa iyong sarili o gamitin ang mga serbisyo ng mga designer. Maaari ka ring gumamit ng mga library ng graphics file mula sa mga produkto ng software tulad ng Microsoft Office, CorelDraw, atbp.

Maglagay tayo ng graphic na imahe mula sa Clip Art library na kasama sa Microsoft Office sa home page ng Web site na ginagawa natin. Upang gawin ito, sundin ang mga hakbang na ito:

1. Buksan ang ginawang Web site.
2. Bukas home page sa pamamagitan ng pag-double click sa index.htm file name sa panel Listahan ng folder(Listahan ng Folder).
3. Nasa listahan Ipasok(Ipasok) piliin ang utos Pagguhit Mga imahe(Clip Art). Lumilitaw ang isang panel sa window ng FrontPage program Pagsingit ng larawan(Ipasok ang Clip Art).
4. Piliin ang command mula sa panel na ito Koleksyon ng mga larawan(Media Gallery). Ang isang dialog box ay bubukas na nagpapahintulot sa iyo na pumili ng isang graphic na imahe (Larawan 15.8).

kanin. 15.8.

Sa tuktok ng dialog box, bilang karagdagan sa mga pindutan na kumokontrol sa pagpapakita ng mga bagay na ipinapakita sa window, pati na rin ang pagkopya at pagtanggal ng mga bagay, mayroong mga pindutan ng pagtatalaga (tingnan ang talahanayan).

1. Panel Listahan ng mga koleksyon naglalaman ng mga folder ng iyong computer na may mga multimedia file, pati na rin ang mga clip Art library picture file. Buksan ang folder ng kategorya ng mga larawan kung saan ka interesado. Ang mga larawan ng kategoryang ito ay lilitaw sa nagtatrabaho na lugar ng window. Kapag inilagay mo ang cursor sa isang imahe, makikita ang isang pahiwatig na nagsasaad ng pangalan, laki ng imahe at ang file na nilalaman nito, pati na rin ang format ng graphic na imahe (Fig. 15.9).

1. I-click ang arrow button sa kanang bahagi ng napiling larawan. May lalabas na menu ng konteksto.
2. Piliin ang command mula sa menu ng konteksto Kopya(Sora).
3. Pumunta sa isang Web page at i-paste ang isang imahe mula sa clipboard papunta dito gamit ang anumang maginhawang tool. Halimbawa, pindutin ang kumbinasyon ng key +.
4. I-save ang Web page na naglalaman ng graphic na larawan sa pamamagitan ng pag-click sa button I-save(I-save) sa karaniwang toolbar. May lalabas na dialog box Sine-save ang mga naka-embed na file(I-save ang Mga Naka-embed na File) (Larawan 15.10), nag-aalok upang i-save ang imahe na nakalagay sa pahina sa isang folder mga larawan Web site sa ilalim ng pangalan kung saan matatagpuan ang file sa library. Ang window na ito ay naglalaman ng mga sumusunod na pindutan:
   • Palitan ang pangalan(Palitan ang pangalan) - pinapayagan kang palitan ang pangalan ng file.
   • Palitan ang folder(Change Folder) - nagbubukas ng dialog box Palitan ang folder(Baguhin ang Folder), na naglalaman ng mga folder ng kasalukuyang Web site, na nagpapahintulot sa iyo na pumili ng ibang folder upang i-save ang file.
   • Aksyon(Itakda ang Aksyon) magbubukas ng dialog box Gawaing aksyon, na nagpapahintulot sa iyo na baguhin ang halaga I-save I-save ang column ng Action sa Huwag mag-ipon(Huwag I-save). I-save Ang pagguhit ay naka-save sa folder ng Web site na iyong tinukoy, kung hindi, ang Web page ay maglalaman ng isang link sa imahe na matatagpuan sa Clip Art library.

Rehiyon Pagguhit(Preview ng larawan) ay nagpapakita ng larawang inilalagay. Sa pamamagitan ng pagtatakda sa dialog box Sine-save ang mga naka-embed na file ninanais na mga parameter, pindutin ang pindutan OK. Ang graphic na file ay ise-save sa folder ng Web site na iyong tinukoy.

kanin. 15.10.

Paglalagay ng isang graphic na imahe mula sa isang file

Tiningnan namin ang paglalagay ng graphic na imahe mula sa Clip Ait library sa isang Web page. Upang maglagay ng graphic na larawan mula sa isang file sa isang pahina, gawin ang isa sa mga sumusunod:

• Nasa listahan Ipasok(Ipasok) piliin ang utos Pagguhit(Larawan), at pagkatapos ay sa submenu na bubukas - ang pagpipilian Mula sa file(Mula sa File)
• I-click ang button Magdagdag ng larawan mula sa isang file(Ipasok ang Larawan Mula sa File) sa karaniwang toolbar
• I-click ang button Magdagdag ng larawan mula sa isang file(Ipasok ang Larawan Mula sa File) sa toolbar Mga guhit(Mga larawan)

Kapag ginawa mo ang alinman sa mga pagkilos na ito, magbubukas ang isang dialog box Pagguhit(Larawan) (Larawan 15.11). Gamit ang window na ito, hanapin ang kinakailangang graphic file at i-click ang button para ilagay ito sa Web page Ipasok(Ipasok). Ang dialog box ay magsasara at ang imahe ay ilalagay sa pahina.

kanin. 15.11.

Pagtatakda ng mga katangian ng larawan

Pagkatapos maglagay ng imahe sa isang Web page, kailangan mong i-configure ang mga katangian nito gamit ang dialog box Mga katangian ng larawan(Mga Katangian ng Larawan) (Larawan 15.12). Upang buksan ito, mag-click sa larawan, at pagkatapos ay gawin ang isa sa mga sumusunod:

• Nasa listahan Format(Format) piliin ang utos Ari-arian(Ari-arian)
• Pumili ng isang koponan menu ng konteksto Mga katangian ng larawan(Picture Properties)
• Pindutin ang kumbinasyon ng key +

Dialog window Mga katangian ng larawan naglalaman ng tatlong tab: Ay karaniwan(General), Pag-record ng video(Video) Tingnan(Hitsura). Tingnan natin ang mga opsyon sa pagpapasadya gamit ang display window na ito.