geen ruimte tussen plaatjes

Status
Niet open voor verdere reacties.
daniel518

daniel518

Gebruiker
Lid geworden
26 mei 2010
Berichten
255
hey mensen,

sinds een tijdje wil ik een website maken, hier ben ik vandaag aan begonnen.
ik ben al klaar met de header en de knoppen enz. maar ik kom nu op het volgende probleem:
er zit ruimte tussen de header en de knoppen (en waarschijnlijk, als ik dadelijk van de knoppen andere plaatjes maak om er goede links van te maken, komt daar ook ruimte tussen)
ik heb eff snel mijn website naar een domein ge-upload:
http://linuxedit.woelmuis.nl/
dit is de code die ik heb (niet veel natuurlijk =P):
Code: 
<!DOCTYPE html>
<html>
<body>

<img src="header.jpg">
<img src="buttons.jpg">

</body>
</html>
ook <span> en </span> werken niet :S

alvast bedankt voor de moeite,
Daniel518
 
Dit is simpel op te lossen met CSS. Of je zet die 2 plaatjes in 1. Maar ik ga kijken wat ik voor je kan doen met CSS
 
larsojo zei:
Dit is simpel op te lossen met CSS. Of je zet die 2 plaatjes in 1. Maar ik ga kijken wat ik voor je kan doen met CSS
Klik om te vergroten...
1 ik kan er niet 1 plaatje van maken aangezien het de knoppen zijn om mee te navigeren.
2 bedankt =)
 
Veldar zei:
Die vier cijfertjes staan voor de coördinaten van de linker bovenhoek van je button of waar de mensen moeten op klikken en de rechter benedenhoek :)

Dus simpelweg : x van de linker bovenhoek , y van de linker bovenhoek , x van de rechter beneden hoek , y van de rechter beneden hoek

Nu vraag je je mss af hoe kan je dat bepalen ??? Simpelweg door je lay-out te openen in paint en dan recht beneden zie je 2 cijfertjes waar je muis zich bevind en dat is dus ook weer x,y

Hopelijk snap je het een beetje :)
Klik om te vergroten...

bedankt <3 ik zal het morgen proberen
 
Hoi Daniel518,
Een image is normaal gesproken een "inline" element. Dat wil zeggen dat een img gewoon in een regel gezet kan worden waar ook tekst in staat.
Nu heeft tekst sommige letters die onder de regel uitkomen: de neerhaaltjes van de p, q, enz.
Een image houdt daar rekening mee, door onderaan op de regel te gaan staan, en niet aan de onderkant van de neerhaaltjes.
Dat geeft dus wat speling onder een image!

Je kan er van af komen met css. Dan zet je bv. in de <head> van je pagina:
Code: 
<style type="text/css">
img {
    vertical-align: top;
    }
</style>

Vervolgens kan je op elk (los) knop-image een link zetten om het menu te laten draaien.
Zet je er in de css ook nog bij:
Code: 
a img {
    border: 0;
    }
... dan komt er in Internet Explorer geen vette gekleurde rand om een image als dat een link is.

Daar is geen verder géén image-map voor nodig, zoals in het w3schools-voorbeeld! :)
Met een image-map kunnen trouwens geen hover-versies van een knop gemaakt worden, wat met css wel kan.

Wil je het helemaal mooi doen, dan kan je van alle knoppen wel een gecombineerd image maken waarbij de links met css bediend worden (een "css-sprite").

Met vriendelijke groet,
Csshunter
 
Status
Niet open voor verdere reacties.
                    Steun ons                    

Nieuwste berichten

Terug
Bovenaan Onderaan