210 likes | 323 Views
Výpočetní technika 2008/09. Obsah předmětu. Využití sítě VŠB-TU ( 16.9. ) Řešení mat. úloh v Excelu ( 30.9. ) Programování funkcí ( 14.10. ) Matlab - základy ( 11.11. ) Matlab – rozsáhlejší úlohy ( 25.11. )
E N D
Obsah předmětu • Využití sítě VŠB-TU ( 16.9. ) • Řešení mat. úloh v Excelu ( 30.9. ) • Programování funkcí ( 14.10. ) • Matlab - základy ( 11.11. ) • Matlab – rozsáhlejší úlohy ( 25.11. ) • Webové prezentace – HTML ( 9.12. )
Síť VŠB-TU • www.vsb.cz Určeno pro studenty • UNIS, Edison (heslo) organizace studia • uzivatel.vsb.czOsobní agenda(změna hesla ) ID jméno – osobní číslo (přiděleno při zápisu ) Heslo –implicitně rodné číslo (nutno změnit) Osobní nastavení – kopie pošty na jiný e-mail, na SMS • posta.vsb.cz přístup k poště
Síť VŠB-TU • knihovna.vsb.cz knihovna • mdg.vsb.cz katedra matematiky • homel.vsb.cz/~kuc14/teach_VT.html tato prezentace
Správce domovských stránek • Umožňuje spravovat soubory vlastních webových stránek • Soubory jsou na serveru homel webová adresa je pak homel.vsb.cz/~IDjmeno/ • Správce umožňuje: 1) průchod adresářovým stromem (Nahoru, poklepem dolů) 2) vytvoření nového adresáře (Vytvořit složku) 3) vložení souboru do aktuálního adresáře (Vložit soubor) 4) akce – Smazat, Přejmenovat, Upravit 5) přístup – Zakázat, Povolit
Co je HTML • Jazyk pro vytvoření webové stránky • Stránku zapsanou pomocí HTML zobrazuje prohlížeč (Internet Explorer, Netscape, Mozilla, …) • Jazyk HTML se stále vyvíjí, adresa konsorcia, které schvaluje nové verze je www.w3.org (poslední verze je z 10.června 2008)
Tvorba stránky Zdrojový kód HTML je textový soubor s příponou html Vytvoří se v jakékoliv textovém editoru, např. v Poznámkovém bloku Příkazy jazyka HTML se nazývají TAGy Párový tag: <p> …. </p> Nepárový tag: <br> Zdrojový kód prohlížené stránky lze zobrazitpostupem: Zobrazit, Zdrojový kód
Příklad 1 (jednoduchá stránka) <title> Jméno stránky </title> <h1> Nadpis první úrovně </h1> <p> Zde začíná první odstavec a hned končí.</p> <p>Druhý odstavec následuje.</p> • <title> … titulek v okně prohlížeče • <h1> … nadpis první úrovně • <p> … odstavec
Příklad 1(ještě jednou totéž) <!DOCTYPE HTML PUBLIC ”-//w3c//dtd……..”> <html> <head> <title> Jméno stránky </title> </head> <body> <h1> Nadpis první úrovně </h1> <p> Zde začíná první odstavec a hned končí.</p> <p>Druhý odstavec následuje.</p> </body> </html>
Použité Tagy • <!DOCTYPE ….> … údaje o verzi jazyka HTML • <html> … ohraničení HTML kódu • <head> … hlavička • <body> … tělo stránky (to, co se má zobrazit) Zdrojový text HTML kódu má dvě části: hlavičku a tělo. Podobně jako každý rozumný počítačový program nebo také kuchařský recept.
Členění webové stránky • <p> … odstavec <br> … zalomení řádku Josef Kopecký <br> Okružní 247 <br> 708 33 Ostrava-Poruba <br> • <h1> až <h6> … nadpisy úrovně 1 až 6 (nejmenší) • <hr> … čára přes celou šířku obrazovky
Atributy TAGů Nastavují vlastnosti určitého TAGu. Například u TAGu <hr> můžeme nastavovat: • šířku v bodech nebo %: width • zarovnání (left, right): align • odstranění stínu: nonshade • výšku čáry v bodech: size <hr width=250> <hr width=”60%” align=left> <hr width=150 size=20 nonshade>
Typy písma <font> Text vysázený zvoleným fontem </font> Fyzické fonty: <b> … tučně, <i> … kurzíva, <tt> … neproporcionální písmo, <u> … podtržené, <strike> … přeškrtnuté, <big> … větší, <small> … menší, <sub> … dolní index, <sup> … horní index Logické fonty: (stanoví prohlížeč) <cite> … citace, <code> … ukázka kódu, <em> … fráze, <kbd> … písmo definované uživatelem, <samp> … příklady, <strong> … silné zvýraznění, <var> … označení proměnných, <def> … definice
Typy písma - příklad Z matematiky se mi velice líbí <b>polynomy</b>. Obzvláště rád po večerech řeším <i>kvadratické rovnice</i> ax<sup>2</sup>+bx+c=0, jejichž řešení je v oboru komplexních čísel. • nastavení velikosti, barvy a řezu písma <font size=”10” color=”red” face=”arial”> Nějaký text. </font> • barvu lze „namíchat“ ze tří základních barev, např. #CC00CC
Seznamy Nečíslovaný: <ul> <li> modrá ● modrá <li> červená ● červená <li> zelená ● zelená </ul> Číslovaný: <ol> <li> modrá 1. modrá <li> červená 2. červená <li> zelená 3. zelená </ol>
Seznamy Definiční: <dl> <dt> ovoce <dd> jablka, hrušky, třešně <dt> zelenina <dd> zelí, kedlubny, salát </dl> ovoce jablka, hrušky, třešně zelenina zelí, kedlubny, salát
Tabulky <table border=”2”> <tr> <td> Buňka11</td> Buňka11 Buňka12 <td> Buňka12</td> Buňka21 Buňka22 </tr> <tr> <td> Buňka21</td> <td> Buňka22</td> </tr> </table>
Odkazy • Určují: 1) kam se odkazujeme (adresu zdroje) 2) výrazněný text <a href=”adresa”> Zvýrazněný text </a> Příklady: <a href=”http://www.seznam.cz/”> Otevři Seznam.cz </a> <a href=”dokument.doc”> Otevři dokument </a> • Spuštění e-mailu <a href="mailto: jan.novak@vsb.cz">Napište mi.</a>
Odkazy • V rámci jedné stránky <a href=”#návěští”> Přesuň na označený text. </a> <a name=”návěští”> označený text </a> • Některé atributy: title … zobrazí bublinu target… otevře nové okno <a href=”adresa” title=”text bubliny”> zvýrazněný text</a> <a href=”adresa” target=_blank> zvýrazněný text</a>
Obrázky • Vkládat lze obrázky v různých formátech: jpg, gif, png, … <imgsrc="obrazek.jpg"> • Atributy: align=left, right … umístění width=60, height=120 … výška, šířka border=”5” … šířka rámu • Obrázek na pozadí (tapeta) <body background="figures/backgr.gif">
Užitečné odkazy • Jak zjistit e-mailovou adresu mobilu: http://zpravy.kyblsoft.cz/podrobne.php • Tvorba webových stránek http://tvorba-webu.zdarek.com/html/