Mobiilisõbraliku veebilehe loomise konspekt

Eesmärk: luua veebileht, mis kuvab anekdoote mobiilseadmetes korrektselt. Kasutatud tehnoloogiad: HTML5, CSS3, PHP ja meta viewport.

1. Tekstifailide lugemine PHP-ga

Funktsioon: Loeb tekstifailidest sisu ja kuvab selle lehel.



Warning:  file_get_contents(teade.txt): Failed to open stream: No such file or directory in /data01/virt140697/domeenid/www.igoraleksejev24.thkit.ee/htdocs/veebPHP/content/mobillimalliKonspekt.php on line 35



Warning:  file_get_contents(autor.txt): Failed to open stream: No such file or directory in /data01/virt140697/domeenid/www.igoraleksejev24.thkit.ee/htdocs/veebPHP/content/mobillimalliKonspekt.php on line 36

Selgitus: file_get_contents() loeb faili sisu ja nl2br() muudab reavahetused
tagideks.

2. Mobiilne meta tag

See tag tagab, et leht kohandub automaatselt seadme ekraani laiusega.

3. Dünaamiline anekdootide laadimine PHP-ga

$id = isset($_GET['id']) ? (int)$_GET['id'] : 1;
$file = "anekdoodid/anekdoot{$id}.txt";

if(file_exists($file)){
    echo "Anekdoot $id";
    echo "" . nl2br(file_get_contents($file)) . "";
} else {
    echo "Anekdooti ei leitud";
}

Selgitus: Kontrollib URL parameetrit ja kuvab vastava faili sisu.

4. Mobiilne navigeerimine

E
T
K

Selgitus: Menüü nupud on lühendatud, et need sobiksid mobiilse ekraani laiusega.

5. CSS mobiilivaatele

.nav li { display: inline; margin: 5px; }
.anekdoot-text { font-size: 14px; line-height: 1.5; }

Lihtne kujundus, mis töötab mobiilseadmes.

6. Mobiilne vaade

Kogu sisu ja menüü kohanduvad automaatselt ekraani laiusega.