home *** CD-ROM | disk | FTP | other *** search
/ Magazyn Internet 2001 November / MICD2001_11_NR1.iso / Www / WebArea / index.php@id=186 < prev    next >
Text File  |  2001-09-26  |  18KB  |  320 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=183">Wprowadzenie</a> 
  107.  <a class="menu" href="index.php@id=184">Struktura dokumentu</a> 
  108.  <a class="menu" href="index.php@id=185">Formatowanie tekstu</a> 
  109.  <a class="menu" href="index.php@id=187">Nawigacja</a> 
  110.  <a class="menu" href="index.php@id=188">Zadania i zdarzenia</a> 
  111.  <a class="menu" href="index.php@id=189">Formularze</a>  </td></tr></table></div></td>
  112.         </tr>
  113.         <tr>
  114.         <td width="460" valign="top"><img src="img/okno21.gif" border="0" width="460" height="10"></td>
  115.         </tr></table><p align="left"><span class="nag">Tabele i obrazy</span>
  116. <p align="justify">W 
  117.                   HTML`u praktycznym sposobem na rozmieszczanie tre╢ci na 
  118.                   stronie by│y tabele. JΩzyk wml r≤wnie┐ daje nam tak▒ 
  119.                   mo┐liwo╢µ. Podobnie jednak jak przy innych elementach, jego 
  120.                   mo┐liwo╢ci s▒ skromniejsze od HTML`a, przy tworzeniu tabel 
  121.                   nale┐y te┐ pamiΩtaµ o ma│ych rozmiarach wy╢wietlaczy. Tabela 
  122.                   powinna znajdowaµ siΩ wewn▒trz akapitu (otoczona znacznikami 
  123.                   <p> </p>)</B><BR><BR><DFN><FONT 
  124.                   size=+1><table> </table></DFN></FONT>PomiΩdzy tymi 
  125.                   znacznikami znajduje siΩ nasza tabela, a w znaczniku 
  126.                   otwieraj▒cym znajduje siΩ definicja tabeli. 
  127.                    <table></CODE> jest u┐ywany razem ze znacznikami 
  128.                    <tr> i <td></CODE>, kt≤re okre╢laj▒ 
  129.                   zawarto╢µ poszczeg≤lnych kom≤rek, kt≤r▒ mo┐e byµ tekst lub 
  130.                   grafika.  <table></CODE> okre╢la ilo╢µ kolumn w 
  131.                   tabeli, lecz nie mo┐e (odwrotnie wygl▒da to w HTML`u) okre╢laµ 
  132.                   szeroko╢ci tabeli. Znacznik ten posiada trzy atrybuty; 
  133.                   <UL>
  134.                     <LI> columns="liczba_kolumn"</CODE> - zaczynam od tego 
  135.                     atrybutu, gdy┐ jest on obligatoryjny i okre╢la ile kolumn 
  136.                     zawiera tabela 
  137.                     <LI> title="tytul"</CODE> - tytu│ tabeli nie jest 
  138.                     wy╢wietlany na ekraniku 
  139.                     <LI> align="wyr≤wnanie"</CODE> - atrybut ten okre╢la 
  140.                     wyr≤wnanie tre╢ci wewn▒trz kom≤rki tabeli. Jego warto╢ci s▒ 
  141.                     jednak inne ni┐ mia│o to miejsce w okre╢laniu wyr≤wnania 
  142.                     akapitu. Wyr≤wnanie do lewej okre╢lamy "L", do prawej "R", a 
  143.                     do ╢rodka "C" </LI></UL> <B><tr> 
  144.                   </tr></B></CODE>- to nic innego jak okre╢lenie wiersza 
  145.                   tabeli. W ramach znacznik≤w tabeli mo┐na umie╢ciµ wiele 
  146.                   wierszy, kt≤re pojawi▒ siΩ na ekraniku <BR> <B><td> 
  147.                   </td></B></CODE>- ten znacznik okre╢la ka┐d▒ pojedyncz▒ 
  148.                   kom≤rkΩ tabeli, kt≤rej zawarto╢µ mo┐e byµ wyr≤wnana 
  149.                   odpowiednim atrybutem znacznika  <table></CODE>. 
  150.                   Znacznik kom≤rki tabeli musi znajdowaµ siΩ pomiΩdzy 
  151.                   znacznikami  <tr> </tr></CODE>, aby 
  152.                   przegl▒darka wiedzia│a w jakim wierszu znajduje siΩ dana 
  153.                   kom≤rka. Przyk│adowa tabela mog│aby wiΩc wygl▒daµ 
  154.                   nastΩpuj▒co;<BR><BR>
  155.                   <TABLE align=center>
  156.                     <TBODY>
  157.                     <TR>
  158.                       <TD><table columns="4"><BR><!-- 
  159.                         akurat ta tabela sklada sie z czterech kolumn<BR>kolejne 
  160.                         kolumny oznaczylem kolejnymi liczbami a<BR>kolejne 
  161.                         wiersze literami --><BR><tr><BR><td>1a 
  162.                         </td><BR><td>2a </td><BR><td>3a 
  163.                         </td><BR><td>4a 
  164.                         </td><BR></tr><BR><!-- tutaj zaczyna siΩ 
  165.                         drugi wiersz--><BR><tr><BR><td>1b 
  166.                         </td><BR><td>2b </td><BR><td>3b 
  167.                         </td><BR><td>4b 
  168.                         </td><BR></tr><BR></table> </TD>
  169.                       <TD><IMG height=136 
  170.                         src="wml/tabela1.jpeg" 
  171.                         width=138 
  172.                   border=0></TD></TR></TBODY></TABLE><BR><BR><DFN><FONT 
  173.                   size=+1><img/></DFN></FONT> - to znacznik s│u┐▒cy do 
  174.                   wstawiania grafiki do naszej karty [ang. image]. Podstawowa 
  175.                   budowa tego znacznika ma postaµ  <img src="plik 
  176.                   graficzny"></CODE>, gdzie plik graficzny to oczywi╢cie 
  177.                   nazwa obrazu wraz z rozszerzeniem (.wbmp) je┐eli plik znajduje 
  178.                   siΩ w lokalnym folderze razem z kart▒ lub lokalizacja- adres 
  179.                   internetowy pliku w sieci. Opr≤cz src [ang. source], znacznik 
  180.                    <img></CODE> posiada tak┐e inne atrybuty;<BR>
  181.                   <UL>
  182.                     <LI> alt="tekst_alternatywny</CODE>" - czyli tekst, 
  183.                     kt≤ry jest wy╢wietlany, gdy nie mo┐na otworzyµ obrazka (np. 
  184.                     przegl▒darka nie obs│uguje grafiki b▒d╝ nie mo┐na znale╝µ 
  185.                     pliku pod wskazan▒ lokalizacj▒) 
  186.                     <LI> vspace="dlugosc"</CODE> - bia│a przestrze± 
  187.                     otaczaj▒ca obrazek- oddzielaj▒ca od innych element≤w karty. 
  188.                     Mo┐emy podawaµ j▒ w pikselach np. vspace="8" lub procentach; 
  189.                     vspace="25%". Procenty to jednak nie rozmiary obrazka, a 
  190.                     rozmiary wy╢wietlacza. 
  191.                     <LI> hspace="dlugosc"</CODE> - to samo tyle ┐e w 
  192.                     poziomie 
  193.                     <LI> height="dlugosc"</CODE> - rozmiar obrazka w 
  194.                     pionie. Umo┐liwia skalowanie obrazka do okre╢lonej liczby 
  195.                     pikseli (np. height="10") lub do procentowego rozmiaru 
  196.                     wy╢wietlacza (np. height="30%"). Tego atrybutu nale┐y u┐ywaµ 
  197.                     razem z atrybutem width; 
  198.                     <LI> width="dlugosc"</CODE> - jak wy┐ej, tyle ┐e w 
  199.                     poziomie 
  200.                     <LI> align="wyrownanie"</CODE> - okre╢la wyr≤wnanie 
  201.                     obrazka wzglΩdem otaczaj▒cego tekstu (top/middle/bottom) 
  202.                     </LI></UL>    Jak ju┐ napisa│em w 
  203.                   poprzednim artykule, dokumenty wml mog▒ zawieraµ jedynie 
  204.                   grafikΩ w formacie wbmp, kt≤re niestety nie s▒ zbyt okaza│e. 
  205.                   Aby poµwiczyµ rysowanie w nowym formacie kliknij w Nokia WAP 
  206.                   Toolkit; File-New-WBMP Image... i po ustaleniu rozmiaru 
  207.                   obrazka mo┐esz tworzyµ swoje wapowe dzie│a sztuki.<BR>WiΩcej o 
  208.                   narzΩdziach do wbmp w <A 
  209.                   href="http://www.pckurier.pl/webmaster/poradniki/wml/narzedzia.html">narzΩdziach</A> 
  210.                   <BR><BR>     Tabele i obrazy urozmaicaj▒ 
  211.                   nasz▒ wapow▒ witrynΩ, choµ nie napisa│em jeszcze przecie┐ jak 
  212.                   mo┐na │▒czyµ miΩdzy sob▒ karty aby m≤c przechodziµ z jednej do 
  213.                   drugiej, ale o tym ju┐ w nastΩpnym odcinku... <br></td>
  214.     </tr></table>
  215.     </div>
  216. </td>
  217. <td width="142" valign="top">
  218.  
  219.         <br>
  220.         <table border="0" cellpadding="0" cellspacing="0" width="142">
  221.         <tr>
  222.         <td width="142" valign="top"><img src="img/login.gif" border="0" width="142" height="13" alt="LOGIN"></td>
  223.         </tr>
  224.         <tr>
  225.         <td width="142" valign="top" background="img/okno1.gif">
  226.         
  227.             
  228.             <div align="center">
  229.             <table cellpadding="0" cellspacing="2" border="0" width="98%">
  230.             <form method="post" action="subskrypcja/login.php">
  231.             <tr><td width="30%"><span class="t">Login:</span></td><td width="68%"><input type="text" name="login" size="15" class="login"></td></tr>
  232.             <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>
  233.             
  234.             <tr><td colspan="2"><center><input type="image" src="img/ok.gif"></td></tr>
  235.             </form></table></div>
  236.         
  237.         </td>
  238.         </tr>
  239.         <tr>
  240.         <td width="142" valign="top"><img src="img/okno2.gif" border="0" width="142" height="10"></td>
  241.         </tr></table>
  242.  
  243.         <br>
  244.         <table border="0" cellpadding="0" cellspacing="0" width="142">
  245.         <tr>
  246.         <td width="142" valign="top"><img src="img/art.gif" border="0" width="142" height="13" alt="ARTYKULY"></td>
  247.         </tr>
  248.         <tr>
  249.         <td width="142" valign="top" background="img/okno1.gif">
  250.         
  251.         <span class="m">
  252.         
  253.          -<a href="index.php@id=1" class="menu">"Edytory HTML'a"</a><br>
  254.          -<a href="index.php@id=2" class="menu">"Publikowanie witryny"</a><br>
  255.          -<a href="index.php@id=3" class="menu">"PHP w domu"</a><br>
  256.          -<a href="index.php@id=4" class="menu">"Przeszukiwanie stron"</a><br>
  257.          -<a href="index.php@id=204" class="menu">"Wprowadzenie do Javy"</a><br>
  258.          -<a href="index.php@id=210" class="menu">"Grafika w PHP"</a>
  259.         </span>
  260.         
  261.         </td>
  262.         </tr>
  263.         <tr>
  264.         <td width="142" valign="top"><img src="img/okno2.gif" border="0" width="142" height="10"></td>
  265.         </tr></table>
  266.         
  267.         <br>
  268.         <table border="0" cellpadding="0" cellspacing="0" width="142">
  269.         <tr>
  270.         <td width="142" valign="top"><img src="img/stat.gif" border="0" width="142" height="13" alt="ARTYKULY"></td>
  271.         </tr>
  272.         <tr>
  273.         <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: 24210</span>        </ol>
  274.         <center><a href="http://stat.webmedia.pl/cgi-bin/anal?webarea" target="_blank">
  275. <img border=0 src="http://stat.webmedia.pl/cgi-bin/stat?webarea&stat4ur" alt="stat4u" width="40" height="10"></a></center>
  276.         </td></tr></table></div>
  277.         </td>
  278.         </tr>
  279.         <tr>
  280.         <td width="142" valign="top"><img src="img/okno2.gif" border="0" width="142" height="10"></td>
  281.         </tr></table>
  282.         
  283.         <br>
  284.         <table border="0" cellpadding="0" cellspacing="0" width="142">
  285.         <tr>
  286.         <td width="142" valign="top"><img src="img/sponsor.gif" border="0" width="142" height="13" alt="SPONSOR"></td>
  287.         </tr>
  288.         <tr>
  289.         <td width="142" valign="top" background="img/okno1.gif"><br>
  290.         <center><EMBED src="img/beep2.swf" quality=high bgcolor=#000000 WIDTH=120 HEIGHT=30></center>                            
  291.         </td>
  292.         </tr>
  293.         <tr>
  294.         <td width="142" valign="top"><img src="img/okno2.gif" border="0" width="142" height="10"></td>
  295.         </tr></table>
  296.  
  297.         <br>
  298.             <div align="center"><table border="0" cellpadding="2" cellspacing="0" width="120">
  299.             <tr>
  300.             <td width="120"><a href="button.php@id=1" target="_blank"><img src="img/cgi.gif" border="0"></a></td>
  301.             </tr>
  302.             <tr>
  303.             <td width="120"><a href="button.php@id=2" target="_blank"><img src="img/ygreg.gif" border="0"></a></td>
  304.             </tr>
  305.             <tr>
  306.             <td width="120"></td>
  307.             </tr>
  308.             </table>
  309.             </div>
  310.         
  311.  
  312. </td>
  313. </tr>
  314. <tr>
  315. <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>
  316. </tr></table></div>
  317.  
  318.  
  319. </body>
  320. </html>