ďťż

[html]zmiana Tabel Na Div

       

Podstrony


telcocafe

Nie potrafię zrobić czegoś konkretnego na div'ach :( . Stworzyłem więc stronę na tabeli. Mam takie pytanko, czy ktoś mógłby mi przerobić krój strony z tabel na div'y? Podaję poniżej kod html:
<table cellspacing="0" cellpadding="0" align="center" class="tabGlowna"> <tr> <td class="logo" colspan="3"> <a href="http://rakiop.ovh.org/"><img border="0" src="http://rakiop.ovh.org/images/logo.gif" width="900px" align="center"></a> </td> </tr> <tr> <td class="menuGora" colspan="3"> <script language="javascript" type="text/javascript"> MG.Pokaz(0,0,0,'block'); </script> </td> </tr> <tr> <td width="900px" height="15px"> &nbsp; </td> </tr> </table> <table cellspacing="0" cellpadding="0" align="center" class="tabGlowna"> <tr> <td valign="top"> <table border="0" cellpadding="0" cellspacing="0" width="160"> <tbody> <tr> <td class="tytulMenu"> <b>&nbsp;Menu gł&oacute;wne</b> </td> </tr> <tr> <td width="160"> <a href="http://127.0.0.1/" class="linkMenu">Strona gł&oacute;wna</a> <a href="http://rakiop.ovh.org/praca.php" class="linkMenu">Download</a> <a href="http://rakiop.ovh.org/praca.php" class="linkMenu">Galeria</a> <a href="http://rakiop.ovh.org/praca.php" class="linkMenu">Kontakt</a> <a href="http://rakiop.ovh.org/faq.php" class="linkMenu">FAQ</a> </td> </tr> </tbody> </table> <br> <table border="0" cellpadding="0" cellspacing="0" width="160"> <tbody> <tr> <td class="tytulMenu"> <b>&nbsp;Webmastering</b> </td> </tr> <tr> <td width="160"> <a href="#php/mysql" id="php/mysql" class="linkMenu" onclick="expandcontent('sc1')">PHP/MySQL</a> <div style="display: none;" id="sc1" class="switchcontent" valign="top" align="right"> <a href="http://rakiop.ovh.org/php_mysql/" class="linkMenu2">&nbsp;&nbsp;|-Og&oacute;lnie</a> <a href="http://rakiop.ovh.org/php_mysql/php/" class="linkMenu2">&nbsp;&nbsp;|-<b>PHP</b> </a><a href="http://rakiop.ovh.org/PHP_MySQL/php/kurs" class="linkMenu2">&nbsp;&nbsp;|--Kurs</a> <a href="http://rakiop.ovh.org/PHP_MySQL/php/porady/" class="linkMenu2">&nbsp;&nbsp;|--Porady</a> <a href="http://rakiop.ovh.org/PHP_MySQL/php/skrypty/" class="linkMenu2">&nbsp;&nbsp;|--Skrypty</a> <a href="http://rakiop.ovh.org/PHP_MySQL/php/linki.php" class="linkMenu2">&nbsp;&nbsp;|--Linki</a> <a href="http://rakiop.ovh.org/php_mysql/mysql/" class="linkMenu2">&nbsp;&nbsp;|-<b>MySQL</b> </a><a href="http://rakiop.ovh.org/PHP_MySQL/mysql/kurs" class="linkMenu2">&nbsp;&nbsp;|--Kurs</a> <a href="http://rakiop.ovh.org/PHP_MySQL/mysql/porady/" class="linkMenu2">&nbsp;&nbsp;|--Porady</a> <a href="http://rakiop.ovh.org/PHP_MySQL/mysql/linki.php" class="linkMenu2">&nbsp;&nbsp;|--Linki</a> <a href="http://rakiop.ovh.org/php_mysql/" class="linkMenu2">&nbsp;&nbsp;|-<b>PHP + MySQL</b> </a><a href="http://rakiop.ovh.org/PHP_MySQL/porady/" class="linkMenu2">&nbsp;&nbsp;|--Porady</a> <a href="http://rakiop.ovh.org/PHP_MySQL/skrypty/" class="linkMenu2">&nbsp;&nbsp;|--Skrypty</a> </div> <a href="#html/css" id="html/css" class="linkMenu" onclick="expandcontent('sc2')">(X)HTML/CSS</a> <div style="display: none;" id="sc2" class="switchcontent" valign="top" align="right"> <a href="http://rakiop.ovh.org/HTML_CSS/" class="linkMenu2">&nbsp;&nbsp;|-Og&oacute;lnie</a> <a href="http://rakiop.ovh.org/HTML_CSS/html/" class="linkMenu2">&nbsp;&nbsp;|-<b>(X)HTML</b> </a><a href="http://rakiop.ovh.org/HTML_CSS/html/kurs" class="linkMenu2">&nbsp;&nbsp;|--Kurs</a> <a href="http://rakiop.ovh.org/HTML_CSS/html/porady/" class="linkMenu2">&nbsp;&nbsp;|--Porady</a> <a href="http://rakiop.ovh.org/HTML_CSS/html/szablony/" class="linkMenu2">&nbsp;&nbsp;|--Szablony</a> <a href="http://rakiop.ovh.org/HTML_CSS/html/linki.php" class="linkMenu2">&nbsp;&nbsp;|--Linki</a> <a href="http://rakiop.ovh.org/HTML_CSS/css/" class="linkMenu2">&nbsp;&nbsp;|-<b>CSS</b> </a><a href="http://rakiop.ovh.org/HTML_CSS/css/kurs" class="linkMenu2">&nbsp;&nbsp;|--Kurs</a> <a href="http://rakiop.ovh.org/HTML_CSS/css/porady/" class="linkMenu2">&nbsp;&nbsp;|--Porady</a> <a href="http://rakiop.ovh.org/HTML_CSS/css/linki.php" class="linkMenu2">&nbsp;&nbsp;|--Linki</a> <a href="http://rakiop.ovh.org/HTML_CSS/css/razem.php" class="linkMenu2">&nbsp;&nbsp;|-<b>(X)HTML + CSS</b> </a><a href="http://rakiop.ovh.org/HTML_CSS/porady/" class="linkMenu2">&nbsp;&nbsp;|--Porady</a> </div> <a href="#js" id="js" class="linkMenu" onclick="expandcontent('sc3')">Javascript</a> <div style="display: none;" id="sc3" class="switchcontent" valign="top" align="right"> <a href="http://rakiop.ovh.org/js/" class="linkMenu2">&nbsp;&nbsp;|-Og&oacute;lnie</a> <a href="http://rakiop.ovh.org/js/kurs/" class="linkMenu2">&nbsp;&nbsp;|-Kurs</a> <a href="http://rakiop.ovh.org/js/porady/" class="linkMenu2">&nbsp;&nbsp;|-Porady</a> <a href="http://rakiop.ovh.org/js/skrypty/" class="linkMenu2">&nbsp;&nbsp;|-Skrypty</a> <a href="http://rakiop.ovh.org/js/linki.php" class="linkMenu2">&nbsp;&nbsp;|-Linki</a> </div> <a href="#ajax" id="ajax" class="linkMenu" onclick="expandcontent('sc4')">Ajax</a> <div style="display: none;" id="sc4" class="switchcontent" valign="top" align="right"> <a href="http://rakiop.ovh.org/Ajax/" class="linkMenu2">&nbsp;&nbsp;|-Og&oacute;lnie</a> <a href="http://rakiop.ovh.org/Ajax/advAjax/" class="linkMenu2">&nbsp;&nbsp;|-<b>advAjax</b></a> <a href="http://rakiop.ovh.org/Ajax/advAjax/porady/" class="linkMenu2">&nbsp;&nbsp;|--Porady</a> <a href="http://rakiop.ovh.org/Ajax/advAjax/linki.php" class="linkMenu2">&nbsp;&nbsp;|--Linki</a> <a href="http://rakiop.ovh.org/Ajax/sajax/" class="linkMenu2">&nbsp;&nbsp;|-<b>Sajax</b> </a><a href="http://rakiop.ovh.org/Ajax/sajax/porady/" class="linkMenu2">&nbsp;&nbsp;|--Porady</a> <a href="http://rakiop.ovh.org/Ajax/sajax/linki.php" class="linkMenu2">&nbsp;&nbsp;|--Linki</a> <a href="http://rakiop.ovh.org/Ajax/ajaxAgent/" class="linkMenu2">&nbsp;&nbsp;|-<b>AjaxAgent</b> </a><a href="http://rakiop.ovh.org/Ajax/ajaxAgent/porady/" class="linkMenu2">&nbsp;&nbsp;|--Porady</a> <a href="http://rakiop.ovh.org/Ajax/ajaxAgent/linki.php" class="linkMenu2">&nbsp;&nbsp;|--Linki</a> <a href="http://rakiop.ovh.org/Ajax/xAjax/" class="linkMenu2">&nbsp;&nbsp;|-<b>xAjax</b> </a><a href="http://rakiop.ovh.org/Ajax/xAjax/porady/" class="linkMenu2">&nbsp;&nbsp;|--Porady</a> <a href="http://rakiop.ovh.org/Ajax/xAjax/linki.php" class="linkMenu2">&nbsp;&nbsp;|--Linki</a> </div> </td> </tr> </tbody> </table> <br> <table border="0" cellpadding="0" cellspacing="0" width="160"> <tbody> <tr> <td class="tytulMenu"> <b>&nbsp;Programming</b> </td> </tr> <tr> <td width="160"> <a href="#delphi" id="delphi" class="linkMenu" onclick="expandcontent('sc10')">Delphi</a> <div style="display: none;" id="sc10" class="switchcontent" valign="top" align="right"> <a href="http://rakiop.ovh.org/praca.php" class="linkMenu2">&nbsp;&nbsp;|-Porady</a> <a href="http://rakiop.ovh.org/praca.php" class="linkMenu2">&nbsp;&nbsp;|-Kurs</a> <a href="http://rakiop.ovh.org/praca.php" class="linkMenu2">&nbsp;&nbsp;|-Skrypty</a> <a href="http://rakiop.ovh.org/praca.php" class="linkMenu2">&nbsp;&nbsp;|-Komponenty</a> <a href="http://rakiop.ovh.org/praca.php" class="linkMenu2">&nbsp;&nbsp;|-Linki</a> </div> <a href="#c" id="c" class="linkMenu" onclick="expandcontent('sc11')">C/C++/C#</a> <div style="display: none;" id="sc11" class="switchcontent" valign="top" align="right"> <a href="http://rakiop.ovh.org/praca.php" class="linkMenu2">&nbsp;&nbsp;|-Porady</a> <a href="http://rakiop.ovh.org/praca.php" class="linkMenu2">&nbsp;&nbsp;|-Kurs</a> <a href="http://rakiop.ovh.org/praca.php" class="linkMenu2">&nbsp;&nbsp;|-Skrypty</a> <a href="http://rakiop.ovh.org/praca.php" class="linkMenu2">&nbsp;&nbsp;|-Komponenty</a> <a href="http://rakiop.ovh.org/praca.php" class="linkMenu2">&nbsp;&nbsp;|-Linki</a> </div> </td> </tr> </tbody> </table><td>&nbsp;&nbsp;</td></td><td valign="top"> <table width="50" border="0" cellspacing="0" cellpadding="10"> <tbody> <tr> <td class="ramka"> <br><h3>Strona główna</h3> Ta strona jest dopiero tworzona. proszę się więc nie dziwić częstemu napisowi <B>"Strona w przygotowaniu"</B>. Strona będzie co dziennie rozwijana o nowe dane(na moim PC, a do internetu jak zdążę). Strona upodobała sobie Mozille, ale co będę zaśmiecał index -> przed kożystaniem zaglądnijcie do <A href="./faq.php" class="a">FAQ</a>. To naprawdę dobra rada, bo jak masz inne ustawienia PC to strona nie bądzie poprawnie działać. <br> </td> </tr> </tbody> </table> <br></td><td>&nbsp;&nbsp;</td> <td valign="top"> <table width="160" border="0" cellspacing="0" cellpadding="0"> <tr> <td class="tytulMenu"> <b>&nbsp;Z forum</b> </td> </tr> <tr> <td width="160px" class="trescMenu" onmouseover="onv2(this);" onmouseout="ont(this);"> Brak tematów </td> </tr> </table> <br /> <table width="160" border="0" cellspacing="0" cellpadding="0"> <tr> <td class="tytulMenu"> <b>&nbsp;Szukaj</b> </td> </tr> <tr> <td width="160px" class="trescMenu" onmouseover="onv2(this);" onmouseout="ont(this);"> <b>Wyszukiwarka zostanie dodana w przyszłości </td> </tr> </table> <br /> <table width="160" border="0" cellspacing="0" cellpadding="0"> <tr> <td class="tytulMenu"> <b>&nbsp;Polecamy</b> </td> </tr> <tr> <td width="160px"> <a href="http://forum.ks-ekspert.pl" class="linkMenu">Forum KS-Ekspert</a> <a href="http://4programmers.net" class="linkMenu">4programmers.net</a> <a href="http://sky-net.prx.pl" class="linkMenu">Sky-Net.prx</a> <a href="http://livenet.pl" class="linkMenu">LiveNet.pl - domeny+hosting</a> <a href="http://skrypty.gery.pl" class="linkMenu">Skrypty.Gery.pl</a> <a href="http://cba.pl" class="linkMenu">Hosting - CBA.pl</a> <a href="http://yoyo.pl" class="linkMenu">Hosting - YOYO.pl</a> <a href="http://krasnal.tk" class="linkMenu">KRASNAL Serv</a> <a href="http://pablo.org" class="linkMenu">Pablo</a> <a href="http://przemo.org" class="linkMenu">Przemo</a> <a href="http://phpbb2.net" class="linkMenu">phpBB2</a> </td> </tr> </table> </td> </tr> </table><br> <table cellspacing="0" cellpadding="0" align="center" class="tabGlowna"> <tr> <td class="stopka" align="center"> Powered by <B>Rakiop</B> | Website by <B>Rakiop.net</B> </td> </tr> </table>Niżej jest CSS
html{ overflow-x: auto; /* fixes MSIE scrollbar bug DO NOT REMOVE, has no effect in Mozilla, or Opera */ } body{ background: #E4EFDF; color: #222; font-family: Verdana, Tahoma, Arial, Trebuchet MS, Sans-Serif, Georgia, Courier, Times New Roman, Serif; font-size: 11px; line-height: 135%; margin: 0; padding: 0; /* required for Opera to have 0 margin */ } /* ustawienia table */ table, tr, td{ /* required for text in tables, because tables do not inherit from body */ background: transparent; color: #222; font-size: 11px; line-height: 135%; } .tabGlowna{ width: 900px; border: 0px; } td.logo { width: 900px; } .menuGora { width: 900px; } .tytulMenu{ background: transparent url(http://rakiop.ovh.org/images/tile_sub.gif); border-bottom: 1px solid #469F43; color: #466D39; font-size: 10px; font-weight: bold; letter-spacing: 1px; margin: 0; padding: 5px; width: 162px; display: block; } .trescMenu{ background: #C7E0BF; border: 1px solid #0D8608; font-weight: normal; width: 170px; display: block; } .stopka{ background: transparent url(http://rakiop.ovh.org/images/tile_foot.gif); border-bottom: 1px solid #469F43; color: #466D39; font-size: 10px; font-weight: bold; letter-spacing: 1px; margin: 0; padding: 5px; width: 900px; display: block; } } /* Input */ input { width: 100%; color: #226840; } .login { width: 170px; color: #226840; } .loginMenu { width: 100%; color: #226840; } .zaloguj { width: 100px; color: #226840; }



Na tym forum nie prosimy o gotowce - marginesy, szerokość, wysokość, float i stronka gotowa (tak było u mnie) - możesz zobaczyć kod jakiejś stronki na divach.
Użytkownik Capitan V edytował ten post 05 luty 2007, 14:11

Nie potrafię zrobić czegoś konkretnego na div'ach :( . Stworzyłem więc stronę na tabeli. Mam takie pytanko, czy ktoś mógłby mi przerobić krój strony z tabel na div'y? ...

Jak sam tego nie przerobisz to sie nie nauczysz !!! Wiem z własnego doświadczenia ;)
Poszukaj jakiegoś kursu i spróbuj :)

Czyżbym się mylił czy to już było na łamach Eksperta? Chyba było, ale przed kilkoma laty... Nawet w KŚ w poradniku webmastera było o tym tylko nie pamiętam adresów...



Zawsze też możesz skorzystać z jakiegoś kreatora stron, a później przeanalizować kod i dostosować go do własnych potrzeb, to chyba najlepszy sposób na nauczenie się nie tylko tego.

Właśnie w KŚ było to na generatorze...
Tak poza tym to CLICK...


Właśnie w KŚ było to na generatorze...
Tak poza tym to CLICK...
Bardzo ciekawe. I ciekawe jet również to, co zwraca google ^^''
Już prędzej polecam stronę :P

  • zanotowane.pl
  • doc.pisz.pl
  • pdf.pisz.pl
  • nvm.keep.pl

  • Sitedesign by AltusUmbrae.