- Ülesande kirjeldus
Meie ülesanne oli luua mobiilisõbralik veebileht, kus saab näidata anekdoote.
Teknoloogiad: PHP (sisu laadimine TXT-failidest) ja HTML.
CSS tagab, et leht näeks hea välja nii arvutis kui ka telefonis.
- Nav menüü
<div class='menu'>
<a href='teade.php'>Teade</a>
<a href='anekdoot1.php'>Anekdoot 1</a>
<a href='anekdoot2.php'>Anekdoot 2</a>
<a href='anekdoot3.php'>Anekdoot 3</a>
</div>
Selgitus: Menüü kuvab lingid kõigile lehtedele, et kasutaja saaks liikuda anekdootide ja teadete vahel. - Anekdoodi laadimine TXT-failist
<div class='anek'>
<?php require('anekdoot1.txt'); ?>
</div>
Selgitus: PHP „require“ lisab TXT-faili sisu otse HTML-i. See võimaldab anekdooti muuta ilma koodi muutmata. Nii on tehtud kõik anekdoodid, nagu anekdoot1 ; anekdoot2 ; anekdoot3. - Footer ja autor
<div class='footer'>
<div class='autor'>
<?php require('autor.txt'); ?>
</div>
</div>
Selgitus: Footer on kõigil lehtedel nähtav, autor on eraldi TXT-failis. - Teate leht (teade.php)
<?php require('anekheader.php'); ?>
<div class='content'>
<h2>Värske teade</h2>
<div class='teade'>
<?php require('teade.txt'); ?>
</div>
</div>
<?php require('anekfooter.php'); ?>
Selgitus: nähtav on päis ja jalus. div -i on lisatud tekst failist tease.txt abil require - Mobiilivaade ja muutused
All on näited, kuidas leht näeb välja telefonis:
Selgitus:
- Menüü muutub vertikaalseks
- Content ja anekdoodid mahuvad ekraanile, tekst ei lõiku välja
- Footer ja autor on nähtavad ning joondatud paremale