Popis XHTML úlohy
Z VirtlabWiki
(Rozdíly mezi verzemi)
Verze z 15:34, 6. 8. 2008 Zap113 (Diskuse | příspěvky) (→CSS styl) ← Předchozí porovnání |
Aktuální verze Zap113 (Diskuse | příspěvky) (→CSS styl) |
||
Řádka 181: | Řádka 181: | ||
</body> | </body> | ||
</html> | </html> | ||
- | </pre> | ||
- | |||
- | == CSS styl == | ||
- | Odkazy na CSS styly: | ||
- | <ul> | ||
- | <li>URL CSS pro úlohy: https://virtlab.cs.vsb.cz/css/task-design.css - Původní</li> | ||
- | <li>URL CSS pro úlohy: http://homel.vsb.cz/~zap113/virtlab/css/task_style.css - Nový</li> | ||
- | </ul> | ||
- | |||
- | '''Ukázka nového Css stylu pro úlohy.''' | ||
- | <pre> | ||
- | /* Last update:2008_08_06 by Karel Zapletal */ | ||
- | body { | ||
- | font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; | ||
- | font-size: 12px; | ||
- | text-align: center; | ||
- | background-color: #FFFFFF; | ||
- | } | ||
- | /* Obal stránky */ | ||
- | #wrapper { | ||
- | padding: 0px 0px 0px 0px; | ||
- | background-color: #FFFFFF;/* #CEFFAF */ | ||
- | /*border: 1px ridge #A7CC8F;*/ | ||
- | position: relative; | ||
- | margin: auto; | ||
- | width: 900px; | ||
- | color: #111111; | ||
- | text-align: justify; | ||
- | } | ||
- | |||
- | /* Struktura uloh */ | ||
- | div#title { | ||
- | font-family: Arial; | ||
- | font-size: 16px; | ||
- | font-weight: bold; | ||
- | /*background-color: #F6FFBF;*/ | ||
- | color: #336667; | ||
- | margin-left: 5px; | ||
- | padding: 18px 0px 12px 0px; | ||
- | } | ||
- | |||
- | div#goal { | ||
- | border-bottom: 1px black dotted; | ||
- | margin: 5px; | ||
- | padding: 12px 0px 6px 20px; | ||
- | } | ||
- | |||
- | div#time { | ||
- | border-bottom: 1px black dotted; | ||
- | margin: 5px; | ||
- | padding: 12px 0px 6px 20px; | ||
- | } | ||
- | |||
- | div#teoback { | ||
- | border-bottom: 1px black dotted; | ||
- | margin: 5px; | ||
- | padding: 12px 0px 6px 20px; | ||
- | } | ||
- | div#teoback ul li { | ||
- | list-style-type: none; | ||
- | } | ||
- | div#topology { | ||
- | border-bottom: 1px black dotted; | ||
- | text-align: center; | ||
- | margin: 5px; | ||
- | padding: 12px 0px 6px 20px; | ||
- | } | ||
- | |||
- | div#topology img { | ||
- | /*border: 1px ridge #A7CC8F;*/ | ||
- | margin: 5px 0px 0px -20px; | ||
- | padding: 12px 0px 6px 20px; | ||
- | } | ||
- | |||
- | div#config { | ||
- | border-bottom: 1px black dotted; | ||
- | margin: 5px; | ||
- | padding: 12px 0px 6px 20px; | ||
- | } | ||
- | |||
- | div#test { | ||
- | border-bottom: 1px black dotted; | ||
- | margin: 5px; | ||
- | padding: 12px 0px 6px 20px; | ||
- | } | ||
- | |||
- | div#optional { | ||
- | border-bottom: 1px black dotted; | ||
- | margin: 5px; | ||
- | padding: 12px 0px 6px 20px; | ||
- | } | ||
- | div#goal h1{ | ||
- | text-align: left; | ||
- | font-size: 14px; | ||
- | font-weight: bold; | ||
- | font-style: italic; | ||
- | color: #336667; | ||
- | margin: 0px 0px 0px -20px; | ||
- | padding: 0px 0px 6px 0px; | ||
- | } | ||
- | div#time h1{ | ||
- | text-align: left; | ||
- | font-size: 14px; | ||
- | font-weight: bold; | ||
- | font-style: italic; | ||
- | color: #336667; | ||
- | margin: 0px 0px 0px -20px; | ||
- | padding: 0px 0px 6px 0px; | ||
- | } | ||
- | div#teoback h1{ | ||
- | text-align: left; | ||
- | font-size: 14px; | ||
- | font-weight: bold; | ||
- | font-style: italic; | ||
- | color: #336667; | ||
- | margin: 0px 0px 0px -20px; | ||
- | padding: 0px 0px 6px 0px; | ||
- | } | ||
- | div#topology h1{ | ||
- | text-align: left; | ||
- | font-size: 14px; | ||
- | font-weight: bold; | ||
- | font-style: italic; | ||
- | color: #336667; | ||
- | margin: 0px 0px 0px -20px; | ||
- | padding: 0px 0px 6px 0px; | ||
- | } | ||
- | div#config h1{ | ||
- | text-align: left; | ||
- | font-size: 14px; | ||
- | font-weight: bold; | ||
- | font-style: italic; | ||
- | color: #336667; | ||
- | margin: 0px 0px 0px -20px; | ||
- | padding: 0px 0px 6px 0px; | ||
- | } | ||
- | div#test h1{ | ||
- | text-align: left; | ||
- | font-size: 14px; | ||
- | font-weight: bold; | ||
- | font-style: italic; | ||
- | color: #336667; | ||
- | margin: 0px 0px 0px -20px; | ||
- | padding: 0px 0px 6px 0px; | ||
- | } | ||
- | div#optional h1{ | ||
- | text-align: left; | ||
- | font-size: 14px; | ||
- | font-weight: bold; | ||
- | font-style: italic; | ||
- | color: #336667; | ||
- | margin: 0px 0px 0px -20px; | ||
- | padding: 0px 0px 6px 0px; | ||
- | } | ||
- | /* Struktura uloh END */ | ||
- | |||
- | div.caption { | ||
- | text-align: left; | ||
- | font-size: 14px; | ||
- | font-weight: bold; | ||
- | font-style: italic; | ||
- | color: #336667; | ||
- | margin: 0px 0px 0px -20px; | ||
- | padding: 0px 0px 6px 0px; | ||
- | } | ||
- | /* Code */ | ||
- | div.code { | ||
- | font-family: "Courier New", Courier, monospace; | ||
- | /*color: Yellow;*/ | ||
- | background-color: #F1F1F1; | ||
- | border: 1px dashed; | ||
- | width: 600px; | ||
- | padding: 10px 5px 10px 20px; | ||
- | margin: 5px 0px 5px 20px; | ||
- | } | ||
- | div.code span{ | ||
- | font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; | ||
- | font-style: italic; | ||
- | } | ||
- | div.code div{ | ||
- | padding: 0px 0px 0px 0px; | ||
- | margin: 0px 0px 0px 20px; | ||
- | } | ||
- | div.code ul { | ||
- | list-style-type: none; | ||
- | margin-left: -20px; | ||
- | } | ||
- | div.code ul li { | ||
- | list-style-type: none; | ||
- | } | ||
- | /* Code END */ | ||
- | |||
- | /* Link */ | ||
- | a:before { | ||
- | content: "Link:"; | ||
- | } | ||
- | |||
- | a { | ||
- | text-decoration: none; | ||
- | color: #336667; | ||
- | } | ||
- | /* Link END */ | ||
- | |||
- | /* tag code */ | ||
- | code { | ||
- | font-family: "Courier New", Courier, monospace; | ||
- | background-color: #F1F1F1; | ||
- | border: 1px dashed; | ||
- | width: 600px; | ||
- | padding: 10px 5px 10px 20px; | ||
- | margin: 5px 0px 5px 20px; | ||
- | display: block; | ||
- | } | ||
- | code span{ | ||
- | font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; | ||
- | font-style: italic; | ||
- | } | ||
- | code object { | ||
- | padding: 0px 0px 0px 0px; | ||
- | margin: 0px 0px 0px 20px; | ||
- | } | ||
- | code a:before { | ||
- | content: ""; | ||
- | } | ||
- | code a { | ||
- | text-decoration: none; | ||
- | color: #000000; | ||
- | padding: 0px 0px 0px 0px; | ||
- | margin: 0px 0px 0px 20px; | ||
- | } | ||
- | /* tag code END */ | ||
</pre> | </pre> |
Aktuální verze
[editovat]
HTML stránka úlohy
- hlavicka
<?xml version='1.0' encoding='utf-8'?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns='http://www.w3.org/1999/xhtml' xml:lang='cs' lang='cs'> <head> <!-- ENCODING /--> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta http-equiv="Content-Language" content="cs" /> <!-- ENCODING end /--> <!-- CASCADING STYLE SHEETS /--> <!-- EXTERNAL STYLE /--> <link rel="stylesheet" type="text/css" href="./css/task-design.css" /> <!-- CASCADING STYLE SHEETS - end /--> <!-- TITLE /--> <title>Topologie 1 IP routing, RIP, statické routy</title> <!-- TITLE end /--> </head>
- body, div wrapper
<body> <!-- WRAPPER /--> <div id="wrapper">
- Název (Title)
<div id="title"> Title: Topologie 1 IP routing, RIP, statické cesty. </div>
- Cíl (Goal) - h1 nadpis
<div id="goal"> <h1>Goal:</h1> Nakonfigurujte síť pomocí směrovcího protokolu RIP verze 1 a 2. </div>
- Cas reseni (Required Time) - h1 nadpis
<div id="time"> <h1>Required Time: 120 minits</h1> </div>
- Teoretický základ (Theoretical Background) - text nebo link, VOLITELNE - h1 nadpis
<div id="teoback"> <h1>Theoretical Background:</h1> Teoretický úvod pro RIP: <ul> <li><a href="http://www.ietf.org/rfc/rfc1058.txt"> RIP RFC 1085 - Ietf.org</a></li> <li><a href="http://www.ietf.org/rfc/rfc1388.txt"> RIPv2 RFC 1388 - Ietf.org</a></li> <li><a href="http://www.cisco.com/en/US/tech/tk1330/tsd_technology_support_technical_reference_chapter09186a0080759842.html"> RIP Technology Handbook - Cisco.com</a></li> </ul> Konfigurace a referenční příkazy pro RIP: <ul> <li><a href="http://www.cisco.com/univercd/cc/td/doc/product/software/ios124/124cg/hirp_c/ch25/ripconfg.htm"> RIP Configuration guide IOS 12.4T - Cisco.com</a></li> <li><a href="http://www.cisco.com/univercd/cc/td/doc/product/software/ios124/124tcr/tirp_r/rte_riht.htm"> RIP Command reference IOS 12.4T - Cisco.com</a></li> </ul> </div>
- Topologie (Topology) - obrazek, primo v hlavnim HTML dokumentu - h1 nadpis
<div id="topology"> <h1>Topology:</h1> <img src="../pictures/rip1.png" alt="Topology RIP1" title="Topology RIP1" /> </div>
- Volitelne tabulky s adresami, cisly DLCI, VLAN apod. - h1 nadpis
- Konfigurace (Configuration) - h1 nadpis
<div id="config"> <h1>Configuration:</h1> <p> Nakonfigurujte síť pomocí směrovcího protokolu RIP v.1, bez záložní linky 19.2 kbit. Použijte IP adresy z privátního rozsahu 192.168.x.x. Ověřte funkci pomocí příkazů: </p> <div class="code"> Router# sh ip route <span>;výpis směrovací tabulky</span><br/> Router# sh ip protocol <span>;výpis ip protokolu</span><br/> Router# debug ip rip <span>;výpis informací o RIP směrovacích transakcích</span><br/> </div> <p> Upravte konfiguraci pro použití protokolu RIP verze 2 a znovu zkontrolujte funkci. </p> <div class="code"> Router(config)# router rip<br/> <div> Router(config-router)# version 2<br/> </div> </div> <p> Doplňte na sériovou linku B-C autentikaci pro směrovací aktualizace. </p> <div class="code"> Router(config)# key chain jméno<br/> <div> Router(config-keychain)# key 1<br/> <div> Router(config-keychain-key)# key-string heslo<br/> </div> </div> Router(config)# Int s1<br/> <div> Router(config-if)# Ip rip authentication key-chain jméno<br/> Router(config-if)# Ip rip authentication mode md5<br/> </div> </div> <div class="code"> Router# Sh key chain </div> Vyzkoušejte efekt příkazu: <div class="code"> Router(config)# router rip<br/> <div> Router(config-router)# maximum-paths 1<br/> </div> </div> Změňte výchozí metriku záložní linky příkazem. <div class="code"> <div> Router(config)# router rip<br/> <div> Router(config-router)# offset-list 0 out 5 s0<br/> </div> </div> </div> na routerech A a D (pro jejich sériové interface s0 nebo s1) <p> Překonfigurujte danou síť pomocí statického směrování (bez záložní linky). Na routerech A a E použijte výchozí cestu (default route). Zkontrolujte funkci příkazem PING. </p> </div>
- Test funkce (Function Test) - h1 nadpis
<div id="test"> <h1>Function test:</h1> <div class="code"> Router# sh ip route<br/> Router# sh ip protocol<br/> Router# debug ip rip<br/> Router# ping<br/> Router# trace<br/> </div> </div>
- Volitelne ulohy (Optional Tasks) - h1 nadpis
<div id="optional"> <h1>Optional task:</h1> </div>
- Konec wrapper, body a stránky
</div> <!-- WRAPPER end /--> </body> </html>