home *** CD-ROM | disk | FTP | other *** search
/ Magazyn Internet 2001 November / MICD2001_11_NR1.iso / Www / WebArea / index.php@id=25 < prev    next >
Text File  |  2001-09-26  |  14KB  |  252 lines

  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4//PL">
  2. <html>
  3. <head>
  4. <title>WEB-AREA.org - serwis webmaster≤w</title>
  5. <link href="style.css" rel="stylesheet" type="text/css">
  6. <LINK REL="SHORTCUT ICON" HREF="favicon.ico"> 
  7. <meta http-equiv="Creation-date" content="28.08.2001">
  8. <meta http-equiv="Reply-to" content="web-area@web-area.org">
  9. <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-2">
  10. <meta name="author" content="Jakub & Jan Filipowscy">
  11. <meta name="description" content="Serwis webmasterow. Znajdziesz tu kilka kursow popularnych internetowych jezykow programowania takich jak: HTML, CSS, WML, SGML, XML, PHP, Perl i Java. Zamiescilismy tu rowniez wiele skryptow JavaScript, PHP i CGI. Przeczytac mozna kilka artykulow i sciagnac kilka szablonow. Dla poczatkujacych jest dzial BeginnerZone. ">
  12. <meta http-equiv="keywords" content="WEB-AREA, web-area, web area, web, area, WEB-AREA.org, web-area.org, webara.org,strefa webmastera, strefa, webmastera, webmaster, WEBMASTER, Webmaster, tworzenie stron www, www, strona www, internet, world wide web, design, designerswo, designer, programowanie, jΩzyki, jΩzyk programowania, php, cgi, html, java, javascript, sgml, wml, PHP, CGI, HTML, Java, JavaScript, SGML, WML, wap, standarty, skrypty php, skrypty cgi, applety java, aplety, aplety java, aplety javy, applety javy, javascripty, JavaScripty, skrypty javy, publikowanie witryny, witryna, tworzenie witryn, tworzenie sklep≤w internetowych, edytory html, tekstowe edytory html, projekt syf, szablony, Szablony, free, darmowe, zadarmo, subskrypcja, lista mailingowa, mailing list, lista subskrypcyjna, bannery, formularze, liczniki, ksiΩgi go╢ci, linki, fora, pliki i operacje na nich, statystyki, wyszukiwarki, rankingi, darmowe skrypty, Jakub Filipowski, Jan Filipowski, katalog, Katalog stron zwi▒zanych z tematyk▒ webmasterstwa, webmasterswo, magazyn www, style, CSS, XML, ASP, jΩzyki skryptowe, generatory, anarchizm">
  13. </head>
  14. <body>
  15.  
  16.  
  17. <div align="left">
  18. <table border="0" cellpadding="0" cellspacing="0" width="770">
  19. <tr>
  20. <td width="770" valign="top" colspan="3">
  21.  
  22.     <table border="0" cellpadding="0" cellspacing="0" width="770">
  23.     <tr>
  24.     <td width="166" valign="top"><a href="index.php"><img src="img/logo.gif" border="0" width="166" height="70" alt="WEB-AREA.org - serwis webmaster≤w"></a></td>
  25.     <td width="604" height="70" background="img/gora.gif" align="right"><iframe src="banner.php" MARGINWIDTH="0" MARGINHEIGHT="0" HSPACE="0" VSPACE="0" FRAMEBORDER="0" SCROLLING="NO" WIDTH="468" HEIGHT="60">
  26. </iframe></td>
  27.     </tr></table>
  28.  
  29. </td>
  30. </tr><tr>
  31. <td width="770" valign="top" colspan="3">
  32.     <table border="0" cellpadding="1" cellspacing="0" width="770">
  33.         <tr><form method="post" action="szukaj.php">
  34.         <td width="260">    <input type="text" name="zapytanie" size="15"> <input type="submit" value="SZUKAJ"> <span class="m"><a href="index.php@url=redakcja_2Fszukaj">Jak szukaµ?</a></span></td></form>
  35.         <td width="510">
  36.         
  37.         <p align="center">
  38.         <a href="index.php@id=206" class="gora">Konkurs</a>   
  39.         <a href="subskrypcja/nowa.php" class="gora">Za│≤┐ subskrypcjΩ</a>    
  40.         <a href="index.php@id=128" class="gora">Katalog</a>    
  41.         <a href="forum.php" class="gora">Forum</a>    
  42.         <a href="index.php@id=15" class="gora">BeginnerZone</a>
  43.         
  44.         </td>
  45.     </tr></table>
  46. </td>
  47. </tr>
  48. <tr>
  49. <td width="142" valign="top">
  50.     
  51.     <br>
  52.     <table border="0" cellpadding="0" cellspacing="0" width="142">
  53.     <tr>
  54.     <td width="142" valign="top"><img src="img/menu.gif" border="0" width="142" height="13" alt="MENU"></td>
  55.     </tr>
  56.     <tr>
  57.     <td width="142" valign="top" background="img/okno1.gif">
  58.     <img src="img/s.gif" width="9" height="8"><b class="menu1">KURSY</b><br>
  59.       - <a href="index.php@id=50" class="menu">HTML</a><br>
  60.       - <a href="index.php@id=40" class="menu">CSS</a><br>
  61.       - <a href="index.php@id=62" class="menu">Java</a><br>
  62.       - <a href="index.php@id=145" class="menu">PHP</a><br>
  63.       - <a href="index.php@id=39" class="menu">CGI</a><br>
  64.       - <a href="index.php@id=5" class="menu">ASP</a><br>
  65.       - <a href="index.php@id=182" class="menu">WML</a><br>
  66.       - <a href="index.php@id=190" class="menu">XML</a><br>
  67.       - <a href="index.php@id=159" class="menu">SGML</a><br>
  68.  
  69.     <img src="img/s.gif" width="9" height="8"><b class="menu1">SKRYPTY</b><br>
  70.       - <a href="index.php@id=78" class="menu">JavaScript</a><br>
  71.       - <a href="index.php@id=135" class="menu">PHP</a><br>
  72.       - <a href="index.php@id=30" class="menu">CGI</a><br>
  73.  
  74.     <img src="img/s.gif" width="9" height="8"><b class="menu1">INNE</b><br>
  75.       - <a href="index.php@id=59" class="menu">Szablony</a><br>
  76.       - <a href="forum.php" class="menu">Forum</a><br>
  77.       - <a href="index.php@id=61" class="menu">Webmasterska lista</a><br>
  78.       - <a href="index.php@id=128" class="menu">Katalog</a><br>
  79.       - <a href="index.php@id=15" class="menu">BeginnerZone</a><br>
  80.       - <a href="index.php@id=206" class="menu">Konkurs</a><br>
  81.     
  82.     <img src="img/s.gif" width="9" height="8"><b class="menu1">SUBSKRYPCJA</b><br>
  83.       - <a href="subskrypcja/nowa.php" class="menu">Za│≤┐</a><br>
  84.       - <a href="subskrypcja/admin.php" class="menu">Administracja</a><br>
  85.  
  86.     <img src="img/s.gif" width="9" height="8"><b class="menu1">REDAKCJA</b><br>
  87.       - <a href="index.php@id=156" class="menu">Sk│ad</a><br>
  88.       - <a href="index.php@id=157" class="menu">Wsp≤│praca</a><br>
  89.       - <a href="index.php@id=158" class="menu">Reklama</a></td>
  90.     </tr>
  91.     <tr>
  92.     <td width="142" valign="top"><img src="img/okno2.gif" border="0" width="142" height="10"></td>
  93.     </tr></table>
  94.  
  95. </td>
  96. <td width="486" valign="top"><br>
  97.     <div align="center">
  98.     <table border="0" cellpadding="0" cellspacing="0" width="460">
  99.     <tr>
  100.     <td width="460" valign="top"><table border="0" cellpadding="0" cellspacing="0" width="460">
  101.         <tr>
  102.         <td width="460" valign="top"><img src="img/zobacz.gif" border="0" width="460" height="13" alt="ZOBACZ JESZCZE"></td>
  103.         </tr>
  104.         <tr>
  105.         <td width="460" valign="top" background="img/okno11.gif"><div align="center">
  106.                 <table border="0" cellpadding="0" cellspacing="0" width="450"><tr><td width="450"><a class="menu" href="index.php@id=23">Co to jest CSS?</a>
  107.  <a class="menu" href="index.php@id=24">Budowa stylu</a>
  108.  <a class="menu" href="index.php@id=26">Przyk│ady</a>
  109.  <a class="menu" href="index.php@id=27">Zako±czenie</a> </td></tr></table></div></td>
  110.         </tr>
  111.         <tr>
  112.         <td width="460" valign="top"><img src="img/okno21.gif" border="0" width="460" height="10"></td>
  113.         </tr></table><span class="nag">BeginnerZone</span>
  114. <H3>Style zewnΩtrzne</H3>
  115. <P ALIGN="justify">W tym poradniku zajmΩ siΩ jedynie stylami zewnΩtrznymi, czyli umieszczonymi w innym pliku. Tworzymy nowy plik o rozszerzeniu *.css i wpisujemy do niego komendy. Podam tutaj przyk│ad dla sekcji BODY:<BR><BR>
  116.  
  117.    BODY {<BR>
  118.       FONT-SIZE: 8pt;<BR> 
  119.       FONT-WEIGHT: normal;<BR> 
  120.       FONT-FAMILY: Verdana;<BR>
  121.       COLOR: white;<BR>
  122.       BACKGROUND-COLOR: black;<BR>
  123.       TEXT-DECORATION: none<BR>
  124.    }<BR><BR>
  125.  
  126. Na pocz▒tku podajemy znacznik, dla kt≤rego chcemy odwo│aµ dany styl. Otwieramy nawias klamrowy. Podajemy w│a╢ciwo╢ci, wstawiamy dwukropek i podajemy warto╢ci. Po zako±czeniu opisywania ka┐dej w│a╢ciwo╢ci nale┐y postawiµ ╢rednik, z wyj▒tkiem ostatniej warto╢ci, kt≤r▒ ko±czy zamkniΩty nawias klamrowy. Tak wygl▒da wyrywek pliku css, kt≤ry sk│ada siΩ z podobnych komend, jednak odnosz▒cych siΩ do r≤┐nych znacznik≤w.<BR><BR>
  127.  
  128. Najwa┐niejsz▒ rzecz▒ w ca│ej tej zabawie jest wstawienie odpowiedniej komendy w pliku *.html, kt≤ra pozwala komputerowi ustaliµ ╝r≤d│o, z kt≤rego ma pobieraµ w│a╢ciwo╢ci styli. Je┐eli stworzyli╢my plik styl.css, nale┐y wstawiµ nastΩpuj▒c▒ komendΩ w sekcji HEAD:<BR><BR>
  129.    <LINK REL="stylesheet" TYPE="text/css" HREF="styl.css"><BR><BR>
  130.  
  131. PamiΩtajmy, aby plik css znajdowa│ siΩ w tym samym folderze, co pliki html. Nie bΩdΩ siΩ tutaj zag│Ωbia│ w dok│adniejsze rozumienie styl≤w, w klasy i selektory, wystarczy, ┐e wiemy, jak tworzy siΩ style i jest to do╢µ proste. Aby dowiedzieµ siΩ wiΩcej o stylach, zajrzyj do <A HREF="strona.php@url=css_2Fi">Kursu CSS autorstwa Marcina Maciochy</A>, kt≤ry r≤wnie┐ znajduje siΩ na tej witrynie.<BR><BR>
  132.  
  133. Powy┐szy przyk│ad odnosi│ siΩ do ju┐ istniej▒cego znacznika w jΩzyku HTML. Ale mo┐emy tworzyµ w│asne, na przyk│ad, je┐eli chcemy jeden akapit (P) wyr≤┐niµ spo╢r≤d innych. Je┐eli do pliku css wstawimy opis stylu dla znacznika P, to wszystkie akapity bΩd▒ mia│y takie w│a╢ciwo╢ci. Ale mo┐emy wstawiµ sw≤j akapit, przed kt≤rego nazw▒ postawimy kropkΩ, np.:<BR><BR>
  134.  
  135.    .MOJ-AKAPIT {<BR>
  136.       FONT-SIZE: 8pt;<BR> 
  137.       FONT-WEIGHT: normal;<BR> 
  138.       FONT-FAMILY: Verdana;<BR>
  139.       COLOR: maroon<BR>
  140.    }<BR><BR>
  141.  
  142. W pliku html musimy wstawiµ odwo│anie w postaci:<BR><BR>
  143.    <SPAN CLASS="moj-akapit">jaki╢ text</SPAN><BR><BR>
  144. W naszym przypadku znajduje siΩ ono miΩdzy znacznikami P i /P. Mo┐emy r≤wnie┐ wstawiµ to odwo│anie w inny spos≤b:<BR><BR>
  145.    <P CLASS="moj-akapit">jaki╢ text</P></P><br></td>
  146.     </tr></table>
  147.     </div>
  148. </td>
  149. <td width="142" valign="top">
  150.  
  151.         <br>
  152.         <table border="0" cellpadding="0" cellspacing="0" width="142">
  153.         <tr>
  154.         <td width="142" valign="top"><img src="img/login.gif" border="0" width="142" height="13" alt="LOGIN"></td>
  155.         </tr>
  156.         <tr>
  157.         <td width="142" valign="top" background="img/okno1.gif">
  158.         
  159.             
  160.             <div align="center">
  161.             <table cellpadding="0" cellspacing="2" border="0" width="98%">
  162.             <form method="post" action="subskrypcja/login.php">
  163.             <tr><td width="30%"><span class="t">Login:</span></td><td width="68%"><input type="text" name="login" size="15" class="login"></td></tr>
  164.             <tr><td width="30%"><span class="t">Has│o:</span></td><td width="68%"><input type="password" name="haslo" size="15" class="login"></td></tr>
  165.             
  166.             <tr><td colspan="2"><center><input type="image" src="img/ok.gif"></td></tr>
  167.             </form></table></div>
  168.         
  169.         </td>
  170.         </tr>
  171.         <tr>
  172.         <td width="142" valign="top"><img src="img/okno2.gif" border="0" width="142" height="10"></td>
  173.         </tr></table>
  174.  
  175.         <br>
  176.         <table border="0" cellpadding="0" cellspacing="0" width="142">
  177.         <tr>
  178.         <td width="142" valign="top"><img src="img/art.gif" border="0" width="142" height="13" alt="ARTYKULY"></td>
  179.         </tr>
  180.         <tr>
  181.         <td width="142" valign="top" background="img/okno1.gif">
  182.         
  183.         <span class="m">
  184.         
  185.          -<a href="index.php@id=1" class="menu">"Edytory HTML'a"</a><br>
  186.          -<a href="index.php@id=2" class="menu">"Publikowanie witryny"</a><br>
  187.          -<a href="index.php@id=3" class="menu">"PHP w domu"</a><br>
  188.          -<a href="index.php@id=4" class="menu">"Przeszukiwanie stron"</a><br>
  189.          -<a href="index.php@id=204" class="menu">"Wprowadzenie do Javy"</a><br>
  190.          -<a href="index.php@id=210" class="menu">"Grafika w PHP"</a>
  191.         </span>
  192.         
  193.         </td>
  194.         </tr>
  195.         <tr>
  196.         <td width="142" valign="top"><img src="img/okno2.gif" border="0" width="142" height="10"></td>
  197.         </tr></table>
  198.         
  199.         <br>
  200.         <table border="0" cellpadding="0" cellspacing="0" width="142">
  201.         <tr>
  202.         <td width="142" valign="top"><img src="img/stat.gif" border="0" width="142" height="13" alt="ARTYKULY"></td>
  203.         </tr>
  204.         <tr>
  205.         <td width="142" valign="top" background="img/okno1.gif"><div align="left"><table border="0" cellpadding="0" cellspacing="0" width="138"><tr><td width="138"><ol><li><a href="index.php@id=135" class="stat">PHP - przyk│adowe skrypty</a> <span class="maleczarne">(1491)</span><br><li><a href="index.php@id=59" class="stat">Szablony 1</a> <span class="maleczarne">(833)</span><br><li><a href="index.php@id=145" class="stat">Kurs PHP</a> <span class="maleczarne">(817)</span><br><br><span class="maleczarne">ú▒cznie: 24077</span>        </ol>
  206.         <center><a href="http://stat.webmedia.pl/cgi-bin/anal?webarea" target="_blank">
  207. <img border=0 src="http://stat.webmedia.pl/cgi-bin/stat?webarea&stat4ur" alt="stat4u" width="40" height="10"></a></center>
  208.         </td></tr></table></div>
  209.         </td>
  210.         </tr>
  211.         <tr>
  212.         <td width="142" valign="top"><img src="img/okno2.gif" border="0" width="142" height="10"></td>
  213.         </tr></table>
  214.         
  215.         <br>
  216.         <table border="0" cellpadding="0" cellspacing="0" width="142">
  217.         <tr>
  218.         <td width="142" valign="top"><img src="img/sponsor.gif" border="0" width="142" height="13" alt="SPONSOR"></td>
  219.         </tr>
  220.         <tr>
  221.         <td width="142" valign="top" background="img/okno1.gif"><br>
  222.         <center><EMBED src="img/beep2.swf" quality=high bgcolor=#000000 WIDTH=120 HEIGHT=30></center>                            
  223.         </td>
  224.         </tr>
  225.         <tr>
  226.         <td width="142" valign="top"><img src="img/okno2.gif" border="0" width="142" height="10"></td>
  227.         </tr></table>
  228.  
  229.         <br>
  230.             <div align="center"><table border="0" cellpadding="2" cellspacing="0" width="120">
  231.             <tr>
  232.             <td width="120"><a href="button.php@id=1" target="_blank"><img src="img/cgi.gif" border="0"></a></td>
  233.             </tr>
  234.             <tr>
  235.             <td width="120"><a href="button.php@id=2" target="_blank"><img src="img/ygreg.gif" border="0"></a></td>
  236.             </tr>
  237.             <tr>
  238.             <td width="120"></td>
  239.             </tr>
  240.             </table>
  241.             </div>
  242.         
  243.  
  244. </td>
  245. </tr>
  246. <tr>
  247. <td width="770" valign="top" colspan="3" align="right"><br><br><span class="m">All rights reserved by <a href="mailto:web-area@web-area.org">J&J Filipowscy Design & Code</a></td>
  248. </tr></table></div>
  249.  
  250.  
  251. </body>
  252. </html>