Suche im Forum:
Suchen


« Vorheriges Thema anzeigen :: Nächstes Thema anzeigen »  
Autor Nachricht
Beitrag16.04.2009 um 21:08 (UTC)    
Titel: Bild im nav container einfügen + Newsbox im Header , wie?

Hallo , also ich wollte die alte box ersetzen , und habe in der gelichen größe eine neue box angerfertig , mit bildern etc drin fertig , wollte diese dann in den code einrbingen nur es geht irgendwie nicht.
Kennt jemand den code wie es gehen kann , hier mein Code ,


#nav_container {
float: right;
color: #333;
border: 1px solid #add8e6;
margin: 0px 0px 0px 0px;
padding: 10px;
height: 320px;
width: 140px;
display: inline;
background: #add8e6;}

wie kann ich da nun den nromalen kasten wegmachen und mein Kasten einfügen ..?
____________________________________________________________________

Dann wollte ich in meinem header , wie auf Poddi.de.tl , eine newsbox einfügen , kennt jemand den code dafür? Und weiß wo ich ihn einfügen muss ?

Dankeschonmal für die Hilfe Razz
Mfg
Beitrag17.04.2009 um 12:12 (UTC)    
Titel: Re:Newsbox

Für die Newsbox fragst du am bestzen poddi selbst oder suchst im Forum.
Ich hab da mal einen Artikel gesehen da hat er es inem anderen erklärt.[/quote]
Beitrag17.04.2009 um 12:44 (UTC)    
Titel:

Mh , und wie kann ich ein bild im nav_container einfügen? , also das nicht nur eine hintegrudnfarbe dort ist ..
Beitrag17.04.2009 um 14:06 (UTC)    
Titel: Tutorials "Newsbox im Header!

So dann fang ich mal an!

So ersellst du eine Newsbox im Header genauso wie es auf meiner Homepage ist:

»1. Du benötigst auf alle Fälle ein CSS Design!

Layouts findet man hier:
http://www.homepage-baukasten.de/forum/viewtopic.php?t=62368

»2. Code den Header! Das kann dann ungefähr so aussehen:
Zitat:
#Header {
background-image: url(Bild URL);
width : 900px;
height : 150px;
float : left;
margin : 0px 0px 0px 0px;}

Wichtig: Der Header darf auf keinen Fall #Header_oben genannt werden, da dieser schon vordefiniert ist!

In das Feld "CSS Code ohne Style-tags" einfügen!

»3. Header definieren:

Füge folgenden Code in das feld "Text über dem Design" ein

Zitat:
<div id="Header"></div>


»4. Code eine Box (Newsbox) Das kann dann so aussehen:

Zitat:

#Newsbox{
color: #FFFFFF;
margin: 20px 30px 0px 0px;
background-image: url(Bild_URL);
width: 250px;
height: 120px;
float: right;}


Die Margin Werte geben an wie groß der Abstand von der oberen rechten Ecke des Header ist!


»5. Definiere auch diese Newsbox!

bei diesem vorigen Code

Zitat:
<div id="Header"></div>


Muss dazwischen noch folgendes rein:
Zitat:

<div id="Newsbox"></div>


Also so:

Zitat:
<div id="Header"><div id="Newsbox"></div></div>


Jetzt haste da eine Box!
Aber um dann das so hinzubekommen wie ich es habe brauchst du list-elemente die du modifizierst.



»6. List-Elemente (Hover) coden

Dafür gibts folgenden code (beliebig änderbar)
Zitat:

#news ul, #news li{
list-style-type: none;}

#news li a {
display: block;
width:260px;
padding: 10px;}

#news a:link, #news a:visited {
color: #000000;
background-color: #FFFFFF;}

#news #akt {
color: #000000;
background-color: #FFFFFF;}

#news a:hover, #news a:hover#akt {
color: #ff0000;
background-color: #000000;}


Am besten experimentierst du damit!...


»7.So damit das aber wirksam wird musst du natürlich dies definieren:

Dieser Code:
Zitat:

<ul id="news">
<li><a href="URL">Newszeile</a></li>
<li><a href="URL">Newszeile</a></li>
<li><a href="URL">Newszeile</a></li>
<li><a href="URL">Newszeile</a></li>
<li><a href="URL">Newszeile</a></li>
</ul>

muss noch dazwischen:
Zitat:
<div id="Header"><div id="Newsbox"></div></div>

also:
Zitat:
<div id="Header"><div id="Newsbox">
<ul id="news">
<li><a href="URL">Newszeile</a></li>
<li><a href="URL">Newszeile</a></li>
<li><a href="URL">Newszeile</a></li>
<li><a href="URL">Newszeile</a></li>
<li><a href="URL">Newszeile</a></li>
</ul></div></div>


Somit hast du eine Newsbox im Header mit verlinkten Zeilen ähnlich wie auf Poddi.de.tl!

ich hoffe ich habe dir (euch) geholfen!
Ich finde es allerdings nicht so gut, wenn ich später 100e seiten mit so ner Newsbox im Header sehen würde Wink

GENAUERES TUTORIAL DEMNÄCHST AUF PODDi-DESIGNS.DE.Tl UND EVTL. HIER IM FORUM !!!

mfg Poddi
Beitrag17.04.2009 um 15:02 (UTC)    
Titel: Mh

Danke , habe die Box nun eingefügt wie du es sagtest , nun bin ich am rumprobieren , wie ich die box oben in den header bekomme , es will iregdnwie nicht funktionieren , sie bleibt immer unter dem header ..
gibt es da noch eine Möglichkeit?
Beitrag17.04.2009 um 15:26 (UTC)    
Titel: Re: Mh

habbovirgin hat Folgendes geschrieben:
Danke , habe die Box nun eingefügt wie du es sagtest , nun bin ich am rumprobieren , wie ich die box oben in den header bekomme , es will iregdnwie nicht funktionieren , sie bleibt immer unter dem header ..
gibt es da noch eine Möglichkeit?


Die Box sollte eigentlich wenn du alles so gemacht hast, wie ich dir gesagt habe im Header sein!!!

Für welche Seite machst du denn die Box??
Beitrag17.04.2009 um 16:26 (UTC)    
Titel:

habbovirgin , nur ich bekomme die box nur unter den header , und kann selber kein bild einfügen Razz bei url , wirds nicht angezeigt , deswgen tat ich sie wieder rauß.
Beitrag17.04.2009 um 17:41 (UTC)    
Titel:

#sidebar_container { position:absolute; left:540px; top:18px; padding:5px; width:250px; height:170px; background-color:#CCCCCC; filter:alpha(opacity=80); -moz-opacity: 0.8; opacity: 0.8; color:#000000; } #sidebar_heading { margin:0; padding:0; overflow:auto; }

wenn du das benutzt kannste deinen text einfach bei der ersten rechten box eingeben. musst halt mit den werten das ändern, das ist jetzt die box von www.jn-vorlagen.de.tl

Rot = Breite der Box
Orange = Höhe der Box
Grün = Abstand zum linken Rand
Blau = Abstand zum oberen Rand
Violett = Hintergrund arbe
Cyan = Textfarbe
______________
*klick* Hier das Bild, wo die-baukasten-typen für andere Anbieter Werbung machen


Zuletzt bearbeitet von slackline am 17.04.2009, 18:44, insgesamt 2-mal bearbeitet
Beitrag17.04.2009 um 18:49 (UTC)    
Titel:

oh!!

Naja wie ihr meint... wenn du so gemacht hättest wie beschrieben, wär was draus gewordn und die version von slckline hat nur tücken xDDD
Beitrag18.04.2009 um 21:59 (UTC)    
Titel:

Ok poddi , habs so gemacht wie dus beschrieben hast , nun haeb ich die box oben , habe dabei jedoch hilfe bekommen .

Mein problem ist nun die verlinkung einzubauen ,

die beiden codes , wo sollen die hin , das hattest du nicht genau erklärt ? ^^
Code:

#news ul, #news li{
list-style-type: none;}

#news li a {
display: block;
width:260px;
padding: 10px;}

#news a:link, #news a:visited {
color: #000000;
background-color: #FFFFFF;}

#news #akt {
color: #000000;
background-color: #FFFFFF;}

#news a:hover, #news a:hover#akt {
color: #ff0000;
background-color: #000000;}


Und
Code:
<div id="Header"><div id="Newsbox">
<ul id="news">
<li><a href="URL">Newszeile</a></li>
<li><a href="URL">Newszeile</a></li>
<li><a href="URL">Newszeile</a></li>
<li><a href="URL">Newszeile</a></li>
<li><a href="URL">Newszeile</a></li>
</ul></div></div>

?
danke nochmals.
Beitrag03.05.2009 um 17:52 (UTC)    
Titel:

Code:

#news ul, #news li{
list-style-type: none;}

#news li a {
display: block;
width:260px;
padding: 10px;}

#news a:link, #news a:visited {
color: #000000;
background-color: #FFFFFF;}

#news #akt {
color: #000000;
background-color: #FFFFFF;}

#news a:hover, #news a:hover#akt {
color: #ff0000;
background-color: #000000;}


Der muss ins Feld "CSS Code ohne Style-tags"


Code:
<div id="Header"><div id="Newsbox">
<ul id="news">
<li><a href="URL">Newszeile</a></li>
<li><a href="URL">Newszeile</a></li>
<li><a href="URL">Newszeile</a></li>
<li><a href="URL">Newszeile</a></li>
<li><a href="URL">Newszeile</a></li>
</ul></div></div>

?
danke nochmals.[/quote]

Der muss ins feld "Text über dem Design"
Beitrag22.01.2010 um 20:32 (UTC)    
Titel: Geht das auch beim Iceblue Design?

Geht das auch beim Iceblue Design?

bitte um antworten
______________
Beitrag29.01.2010 um 18:36 (UTC)    
Titel:

push!
______________
Beiträge der letzten Zeit anzeigen:   


Powered by phpBB © 2001, 2005 phpBB Group
Deutsche Übersetzung von phpBB.de