CIO Tech Eksperten IT-JOB IT-Kurser Events Podcast Søg

Log ind eller opret profil

Du kan også logge ind via nedenstående tjenester

xorioz Nybegynder

02. januar 2009 - 16:15 Der er 8 kommentarer

at bygge en stile med 3 bg billeder

Jeg vil gerne høre om det er muligt at lave en div class med 3 bg billeder.

en der er fixet til toppen.
en der repeater i midten.
en der er fixet til bunden.

hvis dette ikke er muligt kan jeg vil også lave 3 div class'es der ligger bag min indholds class. men det første ville bare spare mig en del arbejde.

prøver at lave et design helt eller næsten uden html tags. kun css.

på fårhånd tak.
Mikkel H Sørensen.

Synes godt om

jensgram Nybegynder

02. januar 2009 - 16:21 #1

Ét baggrundsbillede pr. element, desværre. (Indtil videre ihvertfald - der er vist nogle ret avancerede muligheder for rammegrafik i CSS3-specifikationen, men det er lige vel tidligt at udnytt dem...)

Synes godt om

roenving Novice

02. januar 2009 - 16:57 #2

*LOL*

-- man kan _ikke_ lave html uden html-tags, så du skriver noget vrøvl ...

-- åbenbart en ret udbredt misforståelse, men det er sådan, at du bruger html til indhold og struktur og så er css så at sige beauty-boksen, som du kan bruge til at give dine html-elementer diverse synlige egenskaber !-)

Synes godt om

jensgram Nybegynder

02. januar 2009 - 20:48 #3

roenving > Hehe, ja så grundigt havde jeg naturligvis ikke læst spm :)

Synes godt om

xorioz Nybegynder

03. januar 2009 - 10:35 #4

yes.. godt roenving.. det var så ikke et svar på mit spm... at jeg tager en lille smule fejl er min dummer men læser du efter står der altså helt eller næsten uden html tags.

bruger pt kun html tags til at infører mine styles "self". og så til at difinere header og body.

fandt i øvrigt en fin løsning til mit prob. smider som sagt bare div bg billeder ind i forskellige styles og smider så dem oven på hindanden.. noget i den stil.

body {
width: 100%;
height: 100%;
margin: 0;
padding: 0;
color: #000;
background-color: #fff;
font: 76% Verdana, Arial, Helvetica, sans-serif;
}

html,
{ width: 100%;
height: 100%;
padding: 0;
margin: 0;
}

#container
{ width: 778px;
height: 100%;
margin: 0px auto 0px auto;
padding: 0;
position: relative;
top: 0px;
left: 0px;
border-left: solid 1px #000000;
border-right: solid 1px #000000;
}

#top
{ background: url(bg/top.png) fixed repeat-x top;
width: 778px;
margin: 0;
padding: 0;
position: absolute;
top: 0px;
bottom: 0px;
}

#bottom
{ background: url(bg/bottom.gif) fixed no-repeat bottom;
width: 778px;
height: 170px;
margin: 0;
padding: 0;
position: absolute;
bottom: 0px;
}

#main_a
{ background: url(bg/main.png) fixed repeat-x top;
width: 150px;
position: absolute;
top: 50px;
left: 6px;
bottom: 50px;
padding: 0;
margin: 0;
border-top: solid 1px #000000;
border-left: solid 1px #000000;
}

#main_b
{ background: url(bg/main.png) fixed repeat-x top;
width: 610px;
position: absolute;
top: 50px;
right: 6px;
bottom: 50px;
padding: 0;
margin: 0;
border-top: solid 1px #000000;
border-left: solid 1px #000000;
}

#bar_a
{ background: url(bg/bar.png) repeat-x;
width: 778px;
height: 20px;
position: absolute;
top: 24px;
padding: 0;
margin: 0;
border-bottom: solid 1px #000000;
border-top: solid 1px #000000;

}

#bar_b
{ background: url(bg/bar.png) repeat-x;
width: 778px;
height: 20px;
position: absolute;
bottom: 24px;
padding: 0;
margin: 0;
border-bottom: solid 1px #000000;
border-top: solid 1px #000000;
}

dog virker dette ikke helt optimalt... har nu nogle andre problemer som jeg nok bliver nød til at oprette et nyt spm ang.

Synes godt om

xorioz Nybegynder

03. januar 2009 - 10:37 #5

her er så min index fil. kan virke lidt forvirende til at starte med men det er nok fordig designet er lavet som et drupal theme.

<head>
<title><?php print $head_title ?></title>
<?php print $head ?>
<?php print $styles ?>
<?php print $scripts ?>
<script type="text/javascript"><?php /* Needed to avoid Flash of Unstyle Content in IE */ ?> </script>
</head>

<body>

<div id="container">
<div id="bottom"></div>
<div id="top"></div>
<div id="main_a">
<?php print $left ?>
</div>
<div id="main_b">
<?php print $title ?>
<?php print $tabs ?>
<?php if ($show_messages) { print $messages; } ?>
<?php print $help ?>
<?php print $content; ?>
<?php print $feed_icons; ?>
</div>
<div id="bar_a"><?php print $breadcrumb ?></div>
<div id="bar_b">Design and Theme by Mikkel H Sørensen.</div>
</div>
<?php //menu ?>
<?php if (isset($secondary_links)) { ?><?php print theme('links', $secondary_links, array('class' => 'links', 'id' => 'subnavlist')) ?><?php } ?>
<?php if (isset($primary_links)) { ?><?php print theme('links', $primary_links, array('class' => 'links', 'id' => 'navlist')) ?><?php } ?>
<?php print $search_box ?>

</body>
</html>

Synes godt om

ssv Nybegynder

03. januar 2009 - 12:00 #6

Nu skal jeg nok se dit design "in action", men at positionere dine elementer på siden er _meget_ upraktisk i rigtigt mange tilfælde.

Og så ville det nok være smart at poste hele din CSS :-)

Synes godt om

olebole Juniormester

03. januar 2009 - 20:01 #7

<ole>

- og det kunne også være interessant at se din allerførste linje i markupkoden. Den afgør i høj grad, om CSS er enabled i dit dokument =)

Men derudover er der vist noget omkring CSS, du helt har misforstået, hvis du tror, det er godt at lave "et design helt eller næsten uden html tags. kun css". Det er en indgang, der næsten kun kan resultere i noget skidt ;o)

/mvh
</bole>

Synes godt om

xorioz Nybegynder

12. januar 2009 - 00:17 #8

ok det her løber ud i en side diskusion.. anyways. jeg har selv løst mit problem. har dog et nyt problem og opretter en nyg tråd til det. der vil være medfølgende kode fra alle mine nuværende 2 filer og et link hvor designet kan ses i aktion.

Synes godt om

Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Følg dette spørgsmål

Opret Preview

Webudvikling kurser

Vi tilbyder markedets bedste kurser inden for webudvikling

Se alle Webudvikling kurser

Flere spørgsmål fra HTML kategorien

Titel	Indlæg	Oprettet	Seneste aktivitet
Variabler som ikke virker Af Frits Jensen i HTML	2	30/10/202409:37	30/10/202413:04
Aldersbegrænsning på min hjemmeside Af ØLMANDEN i HTML	2	29/09/202410:58	30/09/202412:04
Bredde på div elementer Af dane022 i HTML	2	16/02/202408:29	20/02/202412:50
Hvilken mindste mobilstørrelse til hjemmeside Af CSharpRazor i HTML	2	21/12/202322:51	22/12/202308:03
validering <input tlfnr. Af slein55 i HTML	5	15/10/202311:43	15/10/202314:51

Se alle spørgsmål i kategorien Opret spørgsmål

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester

Alle kategorier på Eksperten

Seneste artiklerRSS