login  Naam:   Wachtwoord: 
Registreer je!
 Forum

goede coding?

Offline sjak - 23/07/2006 13:02
Avatar van sjakHTML interesse
php code - Bekijk de code zonder highlighting - Klap code in 
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <style type="text/css">
  5.  
  6. body, code, table, td, pre { font-size: 9pt; color: #000000; font-family: Verdana, Arial, Helvetica, sans-serif }
  7. A:link {color:#000000}
  8. A:visited {color:#000000}
  9. A:hover {color:#0066FF}
  10. A:active {font-weight:bold; color:#0066FF; text-decoration:underline}
  11. A {font-weight:bold; color:#000000; text-decoration:none}
  12. </style>
  13. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  14. <title>Untitled Document</title>
  15. </head>
  16.  
  17. <body background="backg.png">
  18. <div align="center">
  19. <div><img src="header-boven.png" alt="" /></div>
  20. <div style="background-image:url(header-link.png); background-position:center; text-align:left; background-repeat:no-repeat; width:724px; padding:4px"><span  style="margin-left:40px;"</span>
  21. <a href="index.php">Home</a><a href="nieuws.php" style="padding-left:10px">Nieuws</a><a href="prg.php" style="padding-left:10px">Programma's</a>
  22. </span>
  23. </div>
  24. <div><img src="header-onder.png" alt="" /></div>
  25. <div style="background-image:url(content.png); background-position:center; background-repeat:repeat-y; width:742px; text-align:left; padding:4px"><p style="margin-left:50px">
  26. Welkom op SjakPrograms,<br />
  27. hier kan je al mijn programma's downloaden.<br /><br />
  28. voorlopig staat er nog maar een programma op, en dat is Windows Live Messenger Patch!<br />
  29. meer info over dit programma en de toekomstige andere programma's vind je bij de download.<br /><br />
  30.  
  31. <b>Laatste nieuws<br />
  32. ---------------------------------------------------</b><br />
  33. </p></div>
  34. <div><img src="onder.png" alt="" /></div>
  35. </div>
  36. </body>
  37. </html>


dit is mijn code, is het zo goed of wat moet er zegmaar anders?
dit is de eerste keer met divs en veel css dus wat ik net al vroeg wat moet er anders:p

9 antwoorden

Gesponsorde links
Offline michielvsb - 23/07/2006 13:03 (laatste wijziging 23/07/2006 13:04)
Avatar van michielvsb HTML interesse
php code - Bekijk de code zonder highlighting - Klap code in 
  1. <div><img src="header-onder.png" alt="" /></div>
Is totaal nutteloos. Je moet geen divs gebruiken om divs te gebruiken 
Offline sjak - 23/07/2006 13:07
Avatar van sjak HTML interesse
php code - Bekijk de code zonder highlighting - Klap code in 
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <style type="text/css">
  5.  
  6. body, code, table, td, pre { font-size: 9pt; color: #000000; font-family: Verdana, Arial, Helvetica, sans-serif }
  7. A:link {color:#000000}
  8. A:visited {color:#000000}
  9. A:hover {color:#0066FF}
  10. A:active {font-weight:bold; color:#0066FF; text-decoration:underline}
  11. A {font-weight:bold; color:#000000; text-decoration:none}
  12. </style>
  13. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  14. <title>Untitled Document</title>
  15. </head>
  16.  
  17. <body background="backg.png">
  18. <div align="center">
  19. <img src="header-boven.png" alt="" />
  20. <div style="background-image:url(header-link.png); background-position:center; text-align:left; background-repeat:no-repeat; width:724px; padding:4px"><span  style="margin-left:40px;"</span>
  21. <a href="index.php">Home</a><a href="nieuws.php" style="padding-left:10px">Nieuws</a><a href="prg.php" style="padding-left:10px">Programma's</a>
  22. </span>
  23. </div>
  24. <img src="header-onder.png" alt="" />
  25. <div style="background-image:url(content.png); background-position:center; background-repeat:repeat-y; width:742px; text-align:left; padding:4px"><p style="margin-left:50px">
  26. Welkom op SjakPrograms,<br />
  27. hier kan je al mijn programma's downloaden.<br /><br />
  28. voorlopig staat er nog maar een programma op, en dat is Windows Live Messenger Patch!<br />
  29. meer info over dit programma en de toekomstige andere programma's vind je bij de download.<br /><br />
  30.  
  31. <b>Laatste nieuws<br />
  32. ---------------------------------------------------</b><br />
  33. </p></div>
  34. <img src="onder.png" alt="" />
  35. </div>
  36. </body>
  37. </html>


zo of moeten de links en te content ook in andere tags?
Offline svm - 23/07/2006 13:08
Avatar van svm PHP ver gevorderde Ik zeg altijd maar zo:
Als het werkt, dan is het goed!
Offline Maarten - 23/07/2006 13:10
Avatar van Maarten Erelid En dan zeg ik altijd maar zo:
Slechte instelling, je kan je kofferbak vol stront leggen, je auto zal rijden, maar welke idioot doet dat nu 

Okey, serieus. Ik ga even je code in m'n kladblok gooien, want die kan veel beter, monumentje 
Offline sjak - 23/07/2006 13:12 (laatste wijziging 23/07/2006 13:15)
Avatar van sjak HTML interesse als ik die 2e code doe die ik postte dan werkt mijn site niet goed in ie met die divs wel moet ik de divs houden of ligt het ergens anders aan?

de fout is dat ik een leeg stukje tussen sommige divs en img zie

---
hieronder:

xhtml is bij mij altijd transitional en niet strict laat die code maar valideren hij was goed.
Offline Ultimatum - 23/07/2006 13:12
Avatar van Ultimatum PHP expert als je toch xhtml 1.0 wilt doen zoals alles afsluiten met een / waarom gebruik je dan nog <div align='center'> want dat is dan niet meer strict

ook zou ik gigantisch veel tabs op deze kleine code hebben gegooid omdat het dan toch ietsje overzichtelijker word 
Offline Maarten - 23/07/2006 13:20 (laatste wijziging 23/07/2006 14:42)
Avatar van Maarten Erelid
php code - Bekijk de code zonder highlighting - Klap code in 
  1. 1. Je zou die CSS-zone wat beter moeten uitlijnen als je daar achteraf nog iets in wilt terugvinden.
  2. 2. Normaal hoort na ieder 'argument' van CSS een ;, dus ook bij de laatste in de rij
  3. 3. Als je toch CSS gebruikt, regel dan ook zaken zoals de achtergrond van je body ermee
  4. 4. Je opent een <div> met een ellenlang style attribuut, het is dus beter om hier een class van te maken
  5. 5. Rond de afbeelding in url() hoort eigenlijk enkele quotes
  6. 6. Die <span> kan je weglaten, en die 10px margin los je op met alle url's in die div..
  7. 7. In plaats van iedere url een style attribuut mee te geven kan je alle a's binnen .menu gelijk opmaken (zie css)
  8. 8. Die margin-left rond je tekst is hetzelfde als padding voor hetgeen errond zit :)
  9. 9. Doordat ik een beetje ingesprongen heb zie je dat je onderaan eigenlijk een </div> teveel had.
  10. 10: <div align="center"> kan je vervangen door de margin-methode
  11.  
  12.  
  13.  
  14. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  15. <html xmlns="http://www.w3.org/1999/xhtml">
  16. <head>
  17. <style type="text/css">
  18. body, code, table, td, pre {
  19. 	font-size: 9pt;
  20. 	color: #000000;
  21. 	font-family: Verdana, Arial, Helvetica, sans-serif;
  22. 	background-image: url('backg.png');
  23. }
  24.  
  25. a:link {
  26. 	color:#000000;
  27. }
  28.  
  29. a:visited {
  30. 	color:#000000;
  31. }
  32.  
  33. a:hover {
  34. 	color:#0066FF;
  35. }
  36.  
  37. a:active {
  38. 	font-weight:bold;
  39. 	color:#0066FF;
  40. 	text-decoration:underline;
  41. }
  42.  
  43. a {
  44. 	font-weight:bold;
  45. 	color:#000000;
  46. 	text-decoration:none;
  47. }
  48.  
  49. .menu {
  50. 	background-image:url('header-link.png');
  51. 	background-position:center;
  52. 	text-align:left;
  53. 	background-repeat:no-repeat;
  54. 	width:724px;
  55. 	padding:4px;
  56. }
  57.  
  58. .menu a {
  59. 	padding-left: 10px;
  60. }
  61.  
  62. .bodyText {
  63. 	background-image:url(content.png);
  64. 	background-position:center;
  65. 	background-repeat:repeat-y;
  66. 	width:742px;
  67. 	text-align:left;
  68. 	padding:4px;
  69. 	padding-left: 54px;
  70. }
  71. </style>
  72. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  73. <title>Untitled Document</title>
  74. </head>
  75. <body>
  76. <div style="margin-left: auto; margin-right: auto; ">
  77. 	<img src="header-boven.png" alt="" />
  78. 	<div class="menu">
  79. 		<a href="index.php">Home</a>
  80. 		<a href="nieuws.php">Nieuws</a>
  81. 		<a href="prg.php">Programma's</a>
  82. 	</div>
  83. </div>
  84. <img src="header-onder.png" alt="" />
  85.  
  86. <div class="bodyText">
  87. 	Welkom op SjakPrograms,<br />
  88. 	hier kan je al mijn programma's downloaden.<br /><br />
  89. 	voorlopig staat er nog maar een programma op, en dat is Windows Live Messenger Patch!<br />
  90. 	meer info over dit programma en de toekomstige andere programma's vind je bij de download.<br /><br />
  91.  
  92. 	<b>Laatste nieuws<br />
  93. 	---------------------------------------------------</b><br />
  94. </div>
  95. <img src="onder.png" alt="" />
  96. </body>
  97. </html>


@hieronder: inderdaad, foutje van de organisatie 
Offline Grayen - 23/07/2006 13:49
Avatar van Grayen PHP ver gevorderde background-image: url('backg.png');
Offline sjak - 23/07/2006 14:21
Avatar van sjak HTML interesse thnx murfy! ik zal goed kijken hoe je het nou gedaan hebt:)
Gesponsorde links
Dit onderwerp is gesloten.
Actieve forumberichten
© 2002-2024 Sitemasters.be - Regels - Laadtijd: 0.24s