2020. február 19., szerda

Gyakorlati óra 12_B

Html oldal készítése

Leírás és életmód

Hosszútávú vonuló, a telet Afrikában tölti. Fõként rovarokat, férgeket, hernyókat, tücsköket, bogarakat, sáskát, vagyis csak állati eredetû táplálékot fogyaszt. Röpte lepkeszerûen hullámzó. Táplálékkeresés közben sokat mozog a talajon, ilyenkor kevésbé feltûnõ. Az állattartó telepek körül találkozhatunk vele leggyakrabban, mert a szerves trágyában elõforduló rovarokat, férgeket elõszeretettel fogyasztja. A mezõgazdaság intenzívvé válása kedvezõtlenül hat az állomány nagyságára. A kisparcellás, extenzív mezõgazdaság növelésével pozitív hatást érhetünk el a faj elterjedésében.

Élõhelye, költése:

Hazánkban a sûrû, zárt erdõk kivételével mindenütt elõfordulhat, de leginkább a mozaikos mezõgazdasági területeket, gyümölcsösöket, szõlõsöket, puhafás ligeterdõket kedveli. Kisebb településeken, falvakban is sokszor látni, akár költhet is az épületek (fészerek, ólak, istállók) kisebb üregeiben. Harkályok odúit szívesen elfoglalja, de kidõlt, korhadt fák üregeiben, kõrakásokban, üregekben bárhol költhet, akár a talajszintben is. Az 5-10 piszkosfehér tojáson kizárólag a tojó kotlik, a hím a táplálékot hordja, a fiókák etetésében viszont mindkét szülõ részt vesz. A népnyelv büdös bankának, vagy szurtos dudunak is hívja, mivel a fiókák veszélyérzet esetén bûzös ürüléket juttatnak vélt, vagy valós támadójukra. Ezen kívül maga a költõüreg is elég sok ürüléket tartalmaz, melyet a fiókák ürítenek ki magukból.

https://www.mme.hu/magyarorszagmadarai/madaradatbazis-upuepo






































Gyakorlati megvalósítás részleten;

A feladatban egy weboldalt kell készítenie a búbos banka rövidbemutatására a feladatleírás és a minta szerint. 

A feladat megoldása során a következőállományokat kell felhasználnia: upuepo_01.png, upuepo_02.png, forras.txt,tablaforras.txt, bubos.css. Ahol a feladat másként nem kéri, a formázásibeállításokat a bubos.css stílusállományban végezze el!1.Hozzon létre HTML oldalt bubosbanka.html néven! Állítsa be az oldal nyelvétmagyarra és a kódolását UTF-8-ra!<meta charset="utf-8">2.A böngésző címsorában megjelenő cím „Búbos banka” legyen!<title>Búbos banka</title>3.A weboldal fejrészében helyezzen el hivatkozást a bubos.css stíluslapra!<link rel="stylesheet" type="text/css" href="bubos.css">4. Az oldal törzsébe másolja be az UTF-8 kódolásúforras.txt állomány tartalmát!5. Alakítsa ki a címet, alcímeket a minta szerint! Aweboldal címe (Búbos banka) 1-esszintűcímsor, az alcímek (Leírás és életmód, Élőhelye, költéseés Adatok) pedig 2-es szintűcímsorok legyenek!<h1>Búbos banka</h1>h2>Leírás és életmód</h2><h2>Élőhelye, költése</h2><h2>Adatok</h2>6. Alakítsa ki a szöveg bekezdéseit a minta szerint! A dokumentum végén a forrásoldalhivatkozásának címét is tartalmazószöveget is helyezze egy bekezdésbe!7. A Leírás és életmódalcím mellett helyezze el az upuepo_01.png képet és formázza astíluslap balkep azonosítójának felhasználásával! Ha a kép fölévisszük az egeret, vagy akép valamiért nem jeleníthetőmeg, akkor mindkét esetben a Könyv-rajzszöveg jelenjenmeg!<img id="balkep" src="upuepo_01.png" alt="Köny-rajz" title="Köny-rajz">8. Alakítson ki egy 10 soros, 2 oszlopos táblázatot a minta és a leírás szerint az Adatokalcím után! A táblázat vázát a tablaforras.txt állományban találja. Másolja ezt be aHTML állományába! A táblázat további beállításait és formázását a következőképpenvégezze el!a. A táblázat végére szúrjon be 2 sort a minta szerint!b. Az 1., 5. és 8. sorban alkalmazzon vízszintesen cellaösszevonást!colspan="2"c. Mozgassa át a szövegeket az utolsókét sor celláiba a minta szerint! A sortöréselem felhasználásával a Rendés a Családsoroknál a rendszertanielnevezések magyar és latin neveit törje külön sorba a minta szerint!<br>d. Az összevont celláknál alkalmazza a fejsor osztálykijelölőt!e. Az összevont celláknál a megfelelőHTML tagnél elhelyezett style attribútumsegítségével igazítsa középre a szöveget!<td style="text-align: center;" class="fejsor" colspan="2">Elnevezés</td>9. A táblázat melléhelyezze el az upuepo_02.png képet és formázza a stíluslap jobbkepazonosítójának felhasználásával! Ha a kép fölévisszük az egeret, vagy a kép valamiért nemjeleníthetőmeg, akkor mindkét esetben a „Éhes fiókákszöveg jelenjen meg!<img id="jobbkep" src="upuepo_02.png" alt="Éhes fiókák" title="Éhes fiókák">10. A táblázat alatti forrásmegjelölést tartalmazóbekezdésben lévőURL-re készítsenhivatkozást a minta alapján! A teljes bekezdésre alkalmazza a stíluslap forrasosztálykijelölőjét!<p class="forras">Forrás: <a href="http://www.mme.hu/magyarorszagmadarai/madaradatbazis-upuepo" target="_blank">http://www.mme.hu/magyarorszagmadarai/madaradatbazis-upuepo</a></p>11. A következőbeállításokat, módosításokat a stíluslap megfelelőkijelölőinél végezze el!a. A weboldal háttérszíne #E7E7FF színkódúvilágoskék színűlegyen!background-color: #e7e7ff;b. A dokumentumban a szövegszín #1D1D4E színkódúmélykék színűlegyen!color: #1d1d4e;
c. Minden kép körül 1 px vastagságú, folytonos #1D1D4E színkódúmélykék színűszegélyvonal legyen!border: 1px solid #1d1d4e;d. A balkep azonosítójúelem szélessége 200 pixel legyen!width: 200px;e. A forras osztályba sorolt elemek szövege vízszintesen középre igazítottlegyen!text-align: center;


Megoldása;

 <!DOCTYPE HTML>
<html>
<head><script src="http://stat.dyna.ultraweb.hu/pgstat.js?server=2&amp;username=12ainformatika" type="text/javascript"></script>
<title>Búbos banka</title>
  <meta charset="utf-8">
    <link rel="stylesheet" type="text/css" href="bubos.css">
</head>

<body>
<h1>Búbos banka</h1>
<img id="balkep" src="upuepo_01.png" alt="Köny-rajz" title="Köny-rajz">
    <h2>Leírás és életmód</h2>

<p>Hosszútávú vonuló, a telet Afrikában tölti. Főként rovarokat, férgeket, hernyókat, tücsköket, bogarakat, sáskát, vagyis csak állati eredetű táplálékot fogyaszt. Röpte lepkeszerűen hullámzó. Táplálékkeresés közben sokat mozog a talajon, ilyenkor kevésbé feltűnő. Az állattartó telepek körül találkozhatunk vele leggyakrabban, mert a szerves trágyában előforduló rovarokat, férgeket előszeretettel fogyasztja. A mezőgazdaság intenzívvé válása kedvezőtlenül hat az állomány nagyságára. A kisparcellás, extenzív mezőgazdaság növelésével pozitív hatást érhetünk el a faj elterjedésében.</p>

                                 <h2>Élőhelye, költése</h2>

<p>Hazánkban a sűrű, zárt erdők kivételével mindenütt előfordulhat, de leginkább a mozaikos mezőgazdasági területeket, gyümölcsösöket, szőlősöket, puhafás ligeterdőket kedveli. Kisebb településeken, falvakban is sokszor látni, akár költhet is az épületek (fészerek, ólak, istállók) kisebb üregeiben. Harkályok odúit szívesen elfoglalja, de kidőlt, korhadt fák üregeiben, kőrakásokban, üregekben bárhol költhet, akár a talajszintben is. Az 5-10 piszkosfehér tojáson kizárólag a tojó kotlik, a hím a táplálékot hordja, a fiókák etetésében viszont mindkét szülő részt vesz. A népnyelv büdös bankának, vagy szurtos dudunak is hívja, mivel a fiókák veszélyérzet esetén bűzös ürüléket juttatnak vélt, vagy valós támadójukra. Ezen kívül maga a költőüreg is elég sok ürüléket tartalmaz, melyet a fiókák ürítenek ki magukból.</p>

                                <h2>Adatok</h2>
    <img id="jobbkep" src="upuepo_02.png" alt="Éhes fiókák" title="Éhes fiókák">


   <Table border=3>  <tr>    <td style="text-align: center;" bgcolor="grey", class="fejsor" colspan="2">Elnevezés</td>
  </tr>  <tr>    <td style="text-align: right;",  ><b>Magyar név</td>    <td>Búbos banka</td>  </tr>  <tr>    <td style="text-align: center;>Tudományos név</td>    <td>Upupa epops</td>  </tr>  <tr>
    <td>Angol név</td>    <td>Eurasian Hoopoe</td>
  </tr>  <tr>    <td style="text-align: center;", bgcolor="grey",  class="fejsor" colspan="2">Rendszertan</td>
  </tr>  <tr>    <td style="text-align: right;"><b>Rend</td>
    <td>Szalakótaalakúak<br> Coraciiformes</td>
  </tr>  <tr>    <td style="text-align: right;"><b>Család</td>
    <td>Bankafélék<br> Upupidae</td>
  </tr>  <tr>     <td style="text-align: center;" , bgcolor="grey", class="fejsor" colspan="2">Védelem</td>
  </tr>     <tr>
    <td style="text-align: right;"><b>Védelmi státusz </td>
    <td>védett</td>
  </tr>     <tr>
    <td><b>Természetvédelmi érték</td>
    <td>50000 Ft</td>
  </tr></Table>
    

<p class="forras">Forrás: <a href="http://www.mme.hu/magyarorszagmadarai/madaradatbazis-upuepo" target="_blank">http://www.mme.hu/magyarorszagmadarai/madaradatbazis-upuepo</a></p>

</body>

</html>





Forrás; http://12ainformatika.uw.hu/weblapfeladatok.html
https://drive.google.com/drive/folders/1gEVP0mDPtXlruypNPXp9t7s5LDAWgYDX



Nincsenek megjegyzések:

Megjegyzés küldése