hallo forumleden ,

Ik heb een nu men layout af in photoshop , slices gemaakt in image ready en dan met dreamweavr nog wat doen .
Nu ik de hele namiddag er mee bezig geweets ben en van de ene naar de andere fout liep .
Uiteindelijk zat ik weer eens vast en vroeg ik een vriend om hulp .
Die vertelde me leer is css.
Hij kende erzelf ook niet veel van en zei dat ik de standaars layout maar eens moest maken in css .
Nu heb ik dus enkel de code in HTML en zou ik graag weten hoe ik dit nu verwerk tot een css document .
Of gewoon hoe ik het best kan beginnen met css .
Wat er voor nodig is hoe het werkt , ...
mijn HTML ziet er als volgt uit :
<html>
<head>
<title>index1</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body bgcolor="#FFFFFF" leftmargin="100" topmargin="0" marginwidth="0" marginheight="100">
<!-- ImageReady Slices (index1.psd) -->
<table id="Table_01" width="748" height="800" border="0" cellpadding="0" cellspacing="0">
<tr>
<td colspan="2">
<img src="images/index1_01.gif" width="748" height="125" alt=""></td>
</tr>
<tr>
<td width="148">
<img src="images/index1_02.gif" width="148" height="29" alt=""></td>
<td width="600" rowspan="13" valign="top" background="images/index1_03.gif">&nbsp;</td>
</tr>
<tr>
<td>
<img src="images/index1_04.gif" width="148" height="28" alt=""></td>
</tr>
<tr>
<td>
<img src="images/index1_05.gif" width="148" height="19" alt=""></td>
</tr>
<tr>
<td>
<img src="images/index1_06.gif" width="148" height="22" alt=""></td>
</tr>
<tr>
<td>
<img src="images/index1_07.gif" width="148" height="28" alt=""></td>
</tr>
<tr>
<td>
<img src="images/index1_08.gif" width="148" height="27" alt=""></td>
</tr>
<tr>
<td>
<img src="images/index1_09.gif" width="148" height="26" alt=""></td>
</tr>
<tr>
<td>
<img src="images/index1_10.gif" width="148" height="25" alt=""></td>
</tr>
<tr>
<td>
<img src="images/index1_11.gif" width="148" height="25" alt=""></td>
</tr>
<tr>
<td>
<img src="images/index1_12.gif" width="148" height="27" alt=""></td>
</tr>
<tr>
<td>
<img src="images/index1_13.gif" width="148" height="24" alt=""></td>
</tr>
<tr>
<td>
<img src="images/index1_14.gif" width="148" height="25" alt=""></td>
</tr>
<tr>
<td>
<img src="images/index1_15.gif" width="148" height="370" alt=""></td>
</tr>
</table>
<!-- End ImageReady Slices -->
</body>
</html>

er zit nog wel een fout in want als ik tekst typ dan veranderd de tabel van vorm .
Nu zou ik graag weten hoe ik zo iets nu maak in css .
De layout blijft over de hele site het zelfde .
er moet enkel in het midden tekst komen .

Alvast bednakt voor jullie hulp
grtz gert
Heb je hier een voorbeeld van online staan?
Ten eerste: Gebruik geen fotoshop om je layout te slicen. Maak gewoon zelf stukken en gebruik dat als achtergronden in je website.

Ten tweede: Als je met CSS gaat werken, is het wel zo handig om ook meteen met div's te werken ipv tabellen.
klik dat is een voorbeeld
ok dus zelf slicen
en div's ? wat houd dat juist en hoe pas ik dat toe ?
Div's maken je code overzichtelijk...

Bij jou zou het zoiets worden

_____________________
| |
| Div 1 |
|____________________|
| | |
| | |
| Div 2 | Div 3 |
| | |
| | |
|_____|______________|


En met CSS kan je dat dan helemaal opmaken: Achtergrond, kleur tekst, font, groote, plaats etc etc...
a ok die div 's lijken me wel handig
als ik het goed voor heb maak ik dan een style.css file met div1 en div2 en div3 , ja ?
moet ik an men eigen slices gwn in 3 delen ?
zodat he bijna werk bij frames ?
Dit is ook een mooi voorbeeld.
Willem-Jan schreef op 11.01.2006 20:34
Ten eerste: Gebruik geen fotoshop om je layout te slicen. Maak gewoon zelf stukken en gebruik dat als achtergronden in je website.


Waarom niet?
Ikgebruik altyd Photoshop om te slicen. Mijn layouts zien er altyd lekker uit ;-)
ik stukken knippen
en alvast voor die mooie link :D
sewes eens proberen

Reageren