Hvordan få et bilde til å være bakgrunn?

9. april 2006

Hei! Jeg har sett på et par sider hvor de har et ( Eller flere ) bakgrunns bilder på en bestemt plass. Et godt eksempel på dette erEventob. Her ser du at det er striper øverst med ikke nederst. Hvordan gjør jeg dette?

mikk- · 9. april 2006

body {
background: url(img/bg.gif) repeat-x #5190ff;

}

«bakgrunn: bildet (img/bg.gif) skal repeteres langs horisontal akse (x-akse). Utover det, skal fargen #5190ff brukes»

9. april 2006

Skal den da plasseres i CSS koden?

EDIT: Jeg fikk det til nå. Men jeg lurer på en ting til. Hvordan midt stiller jeg siden?

Endret 9. april 2006 av medlem-77217

rønning · 9. april 2006

http://decalibration.net/artikler/sentrering/

Even. · 9. april 2006

body {

margin: 0 auto; /*midtiller siden i Opera, Firefox og andre skikkelige nettelsere*/

text-align: center; /*midtstiller siden i IE og andre evneveike browsere*/

}

Kult at noen bruker siden min som eksempel

9. april 2006

Dette skal da skrives i CSS koden skal det ikke?

Even. · 9. april 2006

Stemmer Hvis du allerede har et body element (siden du har lagt til den bakgrunnsgreien) legger du det inn i samme.

Endret 9. april 2006 av EvoZ

Haraldson · 9. april 2006

EvoZ: Merkelig måte du har for å midtstille sider... Sikker på at den er like "safe" som metoden det linkes til lenger opp?

Forresten, det skrives "portefølje" på norsk

Even. · 9. april 2006

EvoZ: Merkelig måte du har for å midtstille sider... Sikker på at den er like "safe" som metoden det linkes til lenger opp?

Forresten, det skrives "portefølje" på norsk

5893518[/snapback]

Et problem jeg har er at når jeg midtstiller enkelte divisjoner med margin: 0 auto; så blir også margin-top, margin-bottom osv. 0. Uansett om jeg har angitt dem seperat, derfor setter jeg margin: 0 auto; dirkete på dody elementet. Har ikke støtt på noen problemer enda

Den skriveleifen var jeg ikke klar over. Takker

Haraldson · 9. april 2006

Kan enkelt løses ved å bruke margin: 20px auto 100px auto; for eksempel

9. april 2006

Ok. Tror jeg har skjønt litt nå. Noen som kan si meg hva jeg gjør feil?

http://www.cssnorge.com/

Even. · 9. april 2006

/* CSS Document */

body {
background: #000000 url(img/bg.jpg) repeat-x;
margin: 20px auto 100px auto;   /*topp høyre bunn venstre*/
}

Såleis...la til litt forklaringer

rønning · 9. april 2006

da har jeg satt opp noen greier...

har satt opp de to filene du trenger....

index-filen:


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
 <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
 <title>cssnorge - Index</title>
 <link href="cssnorge.css" rel="stylesheet" type="text/css" />
</head>

<body>
<body>


<div id="center">

<div id="header">
</div>

<div id="menu">
 <div id="content1">
   Meny her
 </div>  
</div>

<div id="news">
 <div id="content1">
   Nyheter her
 </div>  
</div>

<div id="menu2">
 <div id="content2">
   noe her
 </div>  
</div>

<div id="news2">
 <div id="content2">
   noe annet her
 </div>  
</div>


</div>

</body> 

</html>

css-filen:


#center {
width: 730px;
margin: 20px auto 100px auto;
}

#header {
width: 730px;
height: 155px;
background: url('../img/header.jpg') no-repeat #fff;
margin: 0 0 20px 0;
}

#menu {
width: 250px;
height: 600px;
background: url('../img/menu.jpg') no-repeat #fff;
float: left;
}

#news {
width: 450px;
height: 600px;
background: url('../img/news.jpg') no-repeat #fff;
float: right;
}

#menu2 {
width: 250px;
height: 200px;
background: url('../img/menu2.jpg') no-repeat #fff;
float: left;
margin: 10px 0 0 0;
}

#news2 {
width: 450px;
height: 200px;
background: url('../img/news2.jpg') no-repeat #fff;
float: right;
margin: 10px 0 0 0;
}

#content1 {
margin: 70px 25px;
}

#content2 {
margin: 25px;
}

håper dette hjelper deg

Endret 9. april 2006 av rønning

9. april 2006

Hmm... Det hjalp meg ikke mye du. Bildene kom ikke opp ( Hvis det var meningen? )

rønning · 9. april 2006

prøv nå da...fikset på css-filen

Endret 9. april 2006 av rønning

10. april 2006

Hmm... Fant all shiten ut nå! Du hadde ikke skrevt URL'en til CSS-fila rett Men hvordan får jeg skrifter hvit?

Even. · 10. april 2006

Løsning 1:


body {

font-family: verdana, arial, helvetica;    /*skrifttype*/
font-size: 12px;                                   /*skriftstørrelse*/
color: #ffffff;                                       /*setter fargen til hvit*/

}

Løsning 2


/*brødtekst*/

p {

font-family: verdana, arial, helvetica;    /*skrifttype*/
font-size: 12px;                                   /*skriftstørrelse*/
color: #ffffff;                                       /*setter fargen til hvit*/

}

/*hovedoverskrift*/

h1 {

font-family: verdana, arial, helvetica;    /*skrifttype*/
font-size: 16px;                                   /*skriftstørrelse*/
color: #ffffff;                                       /*setter fargen til hvit*/

}

/*underoverskrift*/

h2 {

font-family: verdana, arial, helvetica;    /*skrifttype*/
font-size: 14px;                                   /*skriftstørrelse*/
color: #ffffff;                                       /*setter fargen til hvit*/

}

Løsning 2 gir mer fleksibilitet, fordi du slipper å angi skriftstørrelser o.l. i html dokumentet.

Du kan skriver f.eks bare:


<h1>Hovedsiden</h1>
<h2>Hvem er jeg?</h2>
<p>Jeg heter Kjell Rasmus og kommer fra Lofoten</p>

10. april 2006

Ok... Nå har jeg fått til det meste, men nå vil ikke bakgrunns bilde komme opp der det skal! LINK

rønning · 10. april 2006

det kommer opp der det skal hos meg (opera)

10. april 2006

Det svarte kommer opp til meg og, men ikke bilde...

Hvordan få et bilde til å være bakgrunn?

Anbefalte innlegg

Gjest medlem-77217

Lenke til kommentar

Videoannonse

Lenke til kommentar

Gjest medlem-77217

Lenke til kommentar

Lenke til kommentar

Lenke til kommentar

Gjest medlem-77217

Lenke til kommentar

Lenke til kommentar

Lenke til kommentar

Lenke til kommentar

Lenke til kommentar

Gjest medlem-77217

Lenke til kommentar

Lenke til kommentar

Lenke til kommentar

Gjest medlem-77217

Lenke til kommentar

Lenke til kommentar

Gjest medlem-77217

Lenke til kommentar

Lenke til kommentar

Gjest medlem-77217

Lenke til kommentar

Lenke til kommentar

Gjest medlem-77217

Lenke til kommentar

Opprett en konto eller logg inn for å kommentere

Opprett konto

Logg inn

Hvem er aktive 0 medlemmer