Ga naar inhoud

Website in elkaar steken met css

lolleflikker
 Delen

Aanbevolen berichten

lolleflikker Vaste Klant

lolleflikker

Geplaatst:
Geplaatst:

Hallo,

ik heb namelijk al een header en een favicon. Maar nu moet ik mijn site in elkaar steken en het lukt niet.

Dit is wat ik al heb

index.html

<HTML>

<HEAD>

<TITLE>ComputerWeb :: Home</TITLE>

<link href="layout.css" rel="stylesheet" type="text/css" />

<link rel="shortcut icon" type="image/x-icon" href="favi.ico">

</HEAD>

<BODY>

</BODY>

</HTML>

layout.css

body {

font-family: Verdana; background-color: 999999;

a:link { color: black; text-decoration: none;

a:visited { color: black; text-decoration: none;

a:hover { color: FF6633; text-decoration: none;

a:active { color: FF6633; text-decoration: none;

}

Wat ik wil.

Ik zou graag mijn header, header.jpeg genaamd in het midden van de pagina hebben. Kan iemand dat voor mij doen? Dank u!

Gast zero

Gast zero

Geplaatst:
Geplaatst:

<center><img src="header.jpg"></center>

lolleflikker Vaste Klant

lolleflikker

Geplaatst:
  • Auteur
Geplaatst:

Oké, bedankt! Maar hoe kan ik nu nog het volgende doen?

Ik heb namelijk met PS (PhotoShop) mijn layout verder gemaakt en deze als webpagina formaat opgeslagen. Ik heb boven mijn header een doorzichtige zwarte balk gemaakt die het menu zal moeten voorstellen. Nu is mijn vraag hoe ik in html tekst boven op die balk zet. En dan heb ik nog een vraag. Ik heb ook al onder mijn header een plaats voor de tekst zelf. Maar als je mij dan uitlegt hoe ik tekst boven die zwarte balk kan typen zal het waarschijnlijk toch hetzelfde zijn om er tekst op te typen. Maar als je dan b.v. tekst van 10 regels typt zal de lay-out neet langer worden vrees ik. Iemand die kan uitleggen hoe ik dit doe?

Alvast héél erg bedankt,

groeten Ruben (DragoCha)

  • 3 weken later...
leroy Mentor

leroy

Geplaatst:
Geplaatst:

ik snap de vraag niet precies maar met div tags kun je over een afbeelding heen typen.

bijvoorbeeld:

<div style="background-image:url(http://locatie_van_de_afbeelding.jpg)">

hier de tekst die je over het plaatje wilt hebben (dit staat gecentreerd)

</div>

dit is een mogelijkheid maar er zijn nog meerder mogelijkheden. met bijvoorbeeld frames, maar dit raad ik ten zeer strengste af.

normaal gezien zou dit stukje code op elke browser moeten werken, het kan zijn dat het niet precies goed werkt, en dat de breedte en de hoogte van de div tag ingegeven moeten worden, dit moet dan zo:

<div style="background-image:url(http://locatie_van_de_afbeelding.jpg); width:100px; height:100px">

hier de tekst die je over het plaatje wilt hebben (dit staat gecentreerd)

</div>

deze div tag is nu 100px hoog en 100px breed.

het kan ook zijn dat hij niet helemaal precies werkt naar behoren, omdat ik dit nu ook maar even snel uit de "losse hand" geschreven heb.

lukt het niet moet je het maar even laten weten. lukt het wel is er de mooie bedank knop :biggrin:

  • 1 maand later...
lolleflikker Vaste Klant

lolleflikker

Geplaatst:
  • Auteur
Geplaatst:

Oke, maar hoe kan ik nu bv. instellen waar het prentje precies moet komen? Ik heb dus in plaats van tekst een afbeelding op mijn header gezet. Het is een button die home heet (dient dus voor menu die button). Maar, die home staat links vanboven. Hoe zet ik die rechts vanonder? Ook voor de tekst zo, hoe bepaal ik waar de tekst precies moet komen te staan?

leroy Mentor

leroy

Geplaatst:
Geplaatst:

de tekst die in de div tag staat staat meestal al gecentreerd... je afbeelding niet...

als je de tekst in het midden van je afbeelding wilt hebben moet je de div tag net zo groot maken als je afbeelding hier kom je achter door als je afbeelding online staat rechtermuisknop erop en dan eigenschappen... daar staan de gegevens van de hoogte en de breedte van de afbeelding...

deze vul je in op de plek van de hoogte en de breedte van de div tag (die ik ook had voorgedaan) en je tekst zal in het midden gecentreerd worden... dus krijg je een soort knopje met afbeelding erachter

ik hoop dat het verder lukt... anders moet je misschien de tekst in de afbeelding verwerken met paint bijvoorbeeld... en dan zo gebruiken...

Gast
Dit topic is nu gesloten voor nieuwe reacties.
 Delen
Ga naar topic overzicht
Logo

OVER ONS

PC Helpforum helpt GRATIS computergebruikers sinds juli 2006. Ons team geeft via het forum professioneel antwoord op uw vragen en probeert uw pc problemen zo snel mogelijk op te lossen. Word lid vandaag, plaats je vraag online en het PC Helpforum-team helpt u graag verder!

SITEMAP

×
×
  • Nieuwe aanmaken...

Belangrijke informatie

We hebben cookies geplaatst op je toestel om deze website voor jou beter te kunnen maken. Je kunt de cookie instellingen aanpassen, anders gaan we er van uit dat het goed is om verder te gaan.