|
CSS Problem
|
| boss159 |
Geschrieben am 18. April 2009 19:01:57
|
Anwender
Posts: 357
Registriert seit: 09.02.09
Halb-ProfiNächstes Level: 357/500
Scores: gesperrt
Verwarnstatus: 
|
Moin Moin
Habe mich mal an CSS versucht und bekomme keinen Hintergrund mehr rein woran kann das liegen ?
Code
<html>
<head>
<title>Layout 1</title>
<style type="text/css">
body {
color: black; background-color: white;
font-size: 100.01%;
font-family: Helvetica,Arial,sans-serif;
margin: 0; padding: 1em 0;
text-align: center;
}
div#Seite {
text-align: left;
margin: 0 auto;
width: 760px;
padding: 0;
background: #ffffe0 url(hintergrund.gif) repeat-y;
border: 2px ridge silver;
}
h1 {
font-size: 1.5em;
margin: 0; padding: 0.3em;
text-align: center;
background: red url(logo.gif) no-repeat 100% 45%;
border-bottom: 1px solid silver;
}
ul#Navigation {
font-size: 0.83em;
float: left; width: 200px;
margin: 0 0 1.2em; padding: 0;
}
ul#Navigation li {
list-style: none;
margin: 0; padding: 0.5em;
}
ul#Navigation a {
display: block;
padding: 0.2em;
font-weight: bold;
}
ul#Navigation a:link {
color: black; background-color: gray;
}
ul#Navigation a:visited {
color: #666; background-color: gray;
}
ul#Navigation a:hover {
color: black; background-color: gray;
}
ul#Navigation a:active {
color: white; background-color: gray;
}
div#Inhalt {
margin: 0 0 1em 220px;
padding: 0 1em;
}
* html div#Inhalt {
height: 1em;
margin-bottom: 0;
}
div#Inhalt h2 {
font-size: 1.2em;
margin: 0.2em 0;
color: navy;
}
div#Inhalt p {
font-size: 1em;
margin: 1em 0;
}
p#Fusszeile {
clear: both;
font-size: 0.83em;
margin: 0; padding: 0.1em;
text-align: center;
background-color: red;
border-top: 1px solid silver;
}
</style>
</head>
<body>
<div id="Seite1">
<h1>CSS-1</h1>
<ul id="Navigation">
<li><a href="index.htm">Test</a></li>
<li><a href="index.htm">Test</a></li>
<li><a href="index.htm">Test</a></li>
<li><a href="index.htm">Test</a></li>
</ul>
<div id="Inhalt">
<h2>inhalt</h2>
<p>test test test test test test test test test test test test test test test test test
test test test test test test test test test test test test test test test test test
test test test test test test test test test test test test test test test test test
test test test test test test test test test test test test test test test test test
test test test test test test test test test test test test test test test test test
test test test test test test test test test test test test test test test test test
test test test test test test test test test test test test test test test test test</p>
<p>test test test test test test test test test test test test test test test test test
test test test test test test test test test test test test test test test test test
test test test test test test test test test test test test test test test test test
test test test test test test test test test test test test test test test test test
test test test test test test test test test test test test test test test test test
test test test test test test test test test test test test test test test test test
test test test test test test test test test test test test test test test test test</p>
<p>test test test test test test test test test test test test test test test test test
test test test test test test test test test test test test test test test test test
test test test test test test test test test test test test test test test test test
test test test test test test test test test test test test test test test test test
test test test test test test test test test test test test test test test test test
test test test test test test test test test test test test test test test test test
test test test test test test test test test test test test test test test test test</p>
</div>
<p id="Fusszeile">test</p>
</div>
</body>
</html>
|
 |
|
|
|
|
| Gr@n@dE |
Geschrieben am 18. April 2009 21:16:05
|
Posts: 850
Registriert seit: 09.09.08
ProfiNächstes Level: 894/1000
Scores: gesperrt
|
Stimmt der Pfad den zu den Bildern den?
Gruß Ralf
__________________________________
KEIN Support per Mail, ICQ oder PN ! |
| |
|
|
|
|
| boss159 |
Geschrieben am 18. April 2009 21:25:57
|
Anwender
Posts: 357
Registriert seit: 09.02.09
Halb-ProfiNächstes Level: 357/500
Scores: gesperrt
Verwarnstatus:
|
Moin Moin
Der Pfad zum Hintergrundbild ja
habe das bilder auf dem Desctop
hat auch super funktzioniert bis ich die farben und den text unten verendert habe ( im Menü )
Ps : die grösse stimt auch nicht mehr es soll 760px haben aber es geht über den ganzen bildschierm
Editiert von boss159 am 18. April 2009 21:28:28 |
| |
|
|
|
|
| Kevin |
Geschrieben am 10. Juni 2009 17:04:02
|
Stammgast
Posts: 194
Registriert seit: 06.10.08
Erfahrener BenutzerNächstes Level: 196/250
Scores: gesperrt
Verwarnstatus:
|
Hallo alle zusammen !
Weiss nich ob das hier hin gehört aber ich versuche es einfach.
Ich habe die folgende Seite erstellt:
http://carstensen.../test.html
Die Seite ist schon relativ gut soweit. LEider muss man noch scrollen und die Seite ist nicht so mittig also das sie genau mittig ist.
Ich bin ein relativ neuer der gerade CSS lernt und daher wird wohl der ein oder andere Verbesserungs Vorschlag kommen.
DIe CSS ist hier zu finden
http://carstensen.../style.css
Hier eine Skize wie es aussehen sollte... Praktisch das rumherum noch weiss is und die Seite mittig is und nich scrollbar sein muss zu mindest die wo wenig Text wäre.
http://carstensen..._hp(1).jpg
Es wäre Klasse wenn mir jemand dabei helfen kann das man am Rand noch ein wenig mehr weises sieht und auch nicht scrollen muss.
DIe blauen umrandungen sollten auch weg.
EDIT: Ja kein Problem hier der Screen
http://carstensen...screen.jpg
Hier mal der css Code
Code body {
background-color: #FFFFF;
background-repeat: no-repeat;
background-attachment: fixed;
background-position: center
}
body {
margin-top: 200px;
margin-right: 380px;
margin-bottom: 10px;
margin-left: 380px;
}
h1 {
color: #FFFFFF;
background-color: #FFFFFF;
border-width: thick;
border-style: dotted;
border-color: white;
position:absolute;
top: 210px;
left: 10px;
}
h2 {
color: #FFFFFF;
background-color: #FFFFFF;
border-width: thick;
border-style: dotted;
border-color: white;
position:absolute;
top: 290px;
left: 10px;
}
h3 {
color: #FFFFFF;
background-color: #FFFFFF;
border-width: thick;
border-style: dotted;
border-color: white;
position:absolute;
top: 370px;
left: 10px;
}
h4 {
color: #FFFFFF;
background-color: #FFFFFF;
border-width: thick;
border-style: dotted;
border-color: white;
position:absolute;
top: 490px;
left: 10px;
}
h5 {
color: #FFFFFF;
background-color: #FFFFFF;
border-width: thick;
border-style: dotted;
border-color: white;
position:absolute;
top: 570px;
left: 10px;
}
h6 {
color: #FFFFFF;
background-color: #FFFFFF;
border-width: thick;
border-style: dotted;
border-color: white;
position:absolute;
top: 100px;
left: 280px;
}
h7 {
color: #FFFFFF;
background-color: #FFFFFF;
border-width: thick;
border-style: dotted;
border-color: white;
position:absolute;
top: 130px;
left: 10px;
}
h8 {
color: #FFFFFF;
background-color: #FFFFFF;
border-width: thick;
border-style: dotted;
border-color: white;
position:absolute;
top: 40px;
left: 390px;
}
h9 {
color: #FFFFFF;
background-color: #FFFFFF;
border-width: thick;
border-style: dotted;
border-color: white;
position:absolute;
top: 280px;
left: 250px;
}
h10 {
color: #FFFFFF;
background-color: #FFFFFF;
border-width: thick;
border-style: dotted;
border-color: white;
position:absolute;
top: 670px;
left: 10px;
}
h11 {
color: #FFFFFF;
background-color: #FFFFFF;
border-width: thick;
border-style: dotted;
border-color: white;
position:absolute;
top: 750px;
left: 10px;
}
h12 {
color: #FFFFFF;
background-color: #FFFFFF;
border-width: thick;
border-style: dotted;
border-color: white;
position:absolute;
top: 740px;
left: 310px;
}
Hier der HTML Code
Code <html>
<head>
<title>Helfer-Helfen Die Homepage gegen Armut in Deutschland - Home</title>
<link rel="stylesheet" type="text/css" href="style.css" />
</head>
<body>
<h1><a href="index2.html"><img src="anmeldung.JPG" alt="Anmelden" /></a></h1>
<h2><a href="index2.html"><img src="fotos.JPG" alt="Zu den Fotos" /></a></h2>
<h3><a href="index2.html"><img src="unser-logo.JPG" alt="Zu den Fotos" /></a></h3>
<h4><a href="index2.html"><img src="gaestebuch.JPG" alt="Zum Gästebuch" /></a></h4>
<h5><a href="index2.html"><img src="impressum.JPG" alt="Zum Impressum" /></a></h5>
<h6><a href="index2.html"><img src="zahlen.JPG" alt="Zu den Zahlen und Fakten" /></a></h6>
<h7><a href="index2.html"><img src="tun-wir.JPG" alt="Das tun Wir !" /></a></h7>
<h8><a href="index2.html"><img src="wir.JPG" alt="Das sind Wir !" /></a></h8>
<h9><a href="index2.html"><img src="helfer-helfen-armut.JPG" alt="" /></a></h9>
<h10><a href="index2.html"><img src="chat.JPG" alt="Zum Chat" /></a></h10>
<h11><a href="index2.html"><img src="kontakte.JPG" alt="Zum Kontaktformular" /></a></h11>
<h12><a href="index2.html"><img src="zur-aktion.JPG" alt="Zur aktuellen Aktion" /></a></h12>
<br><center>Du befindest dich auf der Helfer-Helfen Seite. Die Homepage gegen Armut in Deutschland.<br>Demnächst mehr.</p>
</body>
</html>
Also beim IE sieht das ganz anders aus da ist das total verschoben. Ich möchte Praktisch das die Seite in die Mitte eingezogen wird und dann an den Seiten es weiß ist. Hoffe ihr wisst was ich meine.
Und das blaue um die Buttons soll weg.
Villeicht kann mir jemand die CSS so umbauen damit das so ist wie ich das haben möchte. Darüber würde ich mich sehr freuen. ODER sagen was ich ändern muss und wo es hin soll.
ICH HOFFE JEMAND KANN MIR SO HELFEN WIE ICH ES GERNE HÄTTE
EDIT: Datalus ich wollte das die gesamte Seite mittig ist. Und an den Rand noch viel weiß ist also das die Seite eingezogen wird.
Das Problem mit dem Scrollen hat sich erledigt meine Auflösung war verstellt. ABER nun soll die gesamte Seite mittig sein und mit dem center im HTML Code klappt das nicht. Alles soll Mittig die Buttons usw.
Mit dem Code baue ich doch nur ein Bild ein oder ?
Freu mich auf eure Hilfe
LG Kevin
Editiert von Kevin am 11. Juni 2009 16:43:56 |
| |
|
|
|
|
| Blubba |
Geschrieben am 10. Juni 2009 17:07:16
|
Anwender
Posts: 219
Registriert seit: 27.11.08
Erfahrener BenutzerNächstes Level: 223/250
Scores: gesperrt
Verwarnstatus:
|
Da ich keine blauen umrandungen sehe denk ich mal du meinst die Bilder. das geht mit border='0'.
Edit: Ein Scrollbalken hab ich auch nirgends. Kannst du mal ein Screen machen bei dir?
grüße
Chrissi
Editiert von Blubba am 10. Juni 2009 17:09:42 |
| |
|
|
|
|
| jan |
Geschrieben am 10. Juni 2009 21:53:12
|
Posts: 411
Registriert seit: 07.10.08
Halb-ProfiNächstes Level: 419/500
Scores: gesperrt
|
also frage welche Auflösung benutzt du ?? Kevin
bei mir ist nähmlich auch nichts zum Scrollen :S
Code <html>
<head>
<title>Helfer-Helfen Die Homepage gegen Armut in Deutschland - Home</title>
<link rel="stylesheet" type="text/css" href="style.css" />
</head>
<center><body>
<h1><a href="index2.html"><img src="anmeldung.JPG" alt="Anmelden" /></a></h1>
<h2><a href="index2.html"><img src="fotos.JPG" alt="Zu den Fotos" /></a></h2>
<h3><a href="index2.html"><img src="unser-logo.JPG" alt="Zu den Fotos" /></a></h3>
<h4><a href="index2.html"><img src="gaestebuch.JPG" alt="Zum Gästebuch" /></a></h4>
<h5><a href="index2.html"><img src="impressum.JPG" alt="Zum Impressum" /></a></h5>
<h6><a href="index2.html"><img src="zahlen.JPG" alt="Zu den Zahlen und Fakten" /></a></h6>
<h7><a href="index2.html"><img src="tun-wir.JPG" alt="Das tun Wir !" /></a></h7>
<h8><a href="index2.html"><img src="wir.JPG" alt="Das sind Wir !" /></a></h8>
<h9><a href="index2.html"><img src="helfer-helfen-armut.JPG" alt="" /></a></h9>
<h10><a href="index2.html"><img src="chat.JPG" alt="Zum Chat" /></a></h10>
<h11><a href="index2.html"><img src="kontakte.JPG" alt="Zum Kontaktformular" /></a></h11>
<h12><a href="index2.html"><img src="zur-aktion.JPG" alt="Zur aktuellen Aktion" /></a></h12>
<br><center>Du befindest dich auf der Helfer-Helfen Seite. Die Homepage gegen Armut in Deutschland.<br>Demnächst mehr.</p>
</body></center>
</html>
versuch mal denn Html code damit könnte es schon Mittig sein bin mir aber nicht sicher *stress*
LG Jan
edit : kann es sein das du am Laptop Arbeitest??
Editiert von jan am 10. Juni 2009 21:54:09 |
| |
|
|
|
|
| Datalus |
Geschrieben am 10. Juni 2009 21:54:05
|
Posts: 780
Registriert seit: 08.09.08
ProfiNächstes Level: 785/1000
Scores: gesperrt
|
füge unter body { folgendes ein:
body {
background : url('der pfad zu deinem bild/bildname.jpg') fixed;
Dieser Code zeigt dir dann ein HG Bild auf deiner hp an.
LG Micha
Editiert von Datalus am 10. Juni 2009 21:54:29
.: Computer sind die intelligentesten Idioten, die es gibt :. |
| |
|
