Suche im Forum:
Suchen


« Vorheriges Thema anzeigen :: Nächstes Thema anzeigen »  
Autor Nachricht
Beitrag15.07.2008 um 17:00 (UTC)    
Titel: CSS-Code ohne style tags

Hi,
Ich hab mal ne Frage ,
ich hab mir ein CSS Design gemacht für Iceblue aber man kann ja statt Iceblue noch das Css Design Auswählen wo man den code nur ohne Style tags eingeben soll was bedeutet das (ohne Style tags ) und was brinds wenn ich dass CSS Design statt Iceblue Auswähle

mfg
______________
Günstiges Webhosting.
1 Domain + 3Gb Webspace + unlimited Traffic schon ab 2,90 Euro

http://Luckyhost.de
Beitrag15.07.2008 um 20:33 (UTC)    
Titel:

Hey,

Bei Iceblue kannst du nicht die Position an sich verändern bzw. es ist alles soweit fertig und an seinem Platz

Bei CSS-Design musst du noch die Position bestimmen, die Klassen umändern.

Wenn du jetzt dein Iceblue-Code in das CSS-Design einfügst, sieht es nicht unbedingt mehr nach deinem alten Design aus

Mfg
______________
THE JOY OF NOT BEING SOLD ANYTHING
Beitrag15.07.2008 um 20:36 (UTC)    
Titel:

Danke erst mal und noch was
Ich habe bei mir alles verschoben und zusammengesetzt jetzt hat man mit IE keine chance mehr wenn ich jetzt das Css Design wähle kann es dan auch der IE lesen und was sind style tags? das td. oder?
______________
Günstiges Webhosting.
1 Domain + 3Gb Webspace + unlimited Traffic schon ab 2,90 Euro

http://Luckyhost.de
Beitrag15.07.2008 um 20:39 (UTC)    
Titel:

Also style-tags sind das hier:
<style type=text/css> und das hier </style>

Ja mit der IE liest das auch, aber Firefox zeigt das Design bei mir auch falsch an. Anscheinend hast du da was falsch gecodet

Mfg
______________
THE JOY OF NOT BEING SOLD ANYTHING
Beitrag15.07.2008 um 20:42 (UTC)    
Titel:

hm... ok
Danke
______________
Günstiges Webhosting.
1 Domain + 3Gb Webspace + unlimited Traffic schon ab 2,90 Euro

http://Luckyhost.de


Zuletzt bearbeitet von jumpn-run am 15.07.2008, 21:42, insgesamt einmal bearbeitet
Beitrag15.07.2008 um 21:52 (UTC)    
Titel:

Noch mal übersichtlich:

Zitat:
<style type="text/css">
<!--

-->
</style>


Diese beiden Blöcke musst Du weglassen.

Du schreibst im CSS-Design nur die Anweisungen.
Beitrag15.07.2008 um 21:55 (UTC)    
Titel:

aber dan ist alles verschoben muss ich das td. auch weglassen?
______________
Günstiges Webhosting.
1 Domain + 3Gb Webspace + unlimited Traffic schon ab 2,90 Euro

http://Luckyhost.de
Beitrag15.07.2008 um 22:05 (UTC)    
Titel:

Die Codes selber müssen komplett rein,z.B.:

Zitat:
div#header{background-image:url(http://blabla);}
Beitrag15.07.2008 um 22:15 (UTC)    
Titel:

Ok ich werd mal ein bischjen basteln

danke für die Antworten
______________
Günstiges Webhosting.
1 Domain + 3Gb Webspace + unlimited Traffic schon ab 2,90 Euro

http://Luckyhost.de
Beitrag16.07.2008 um 01:37 (UTC)    
Titel:

Der Unterschied zwischen dem IceBlue und dem CSS-Design ist gar nicht so riesig.

Du bekommst bei beiden Designs ein fertiges HTML-Grundgerüst gestellt. Die Fähigkeiten von HTML sind allerdings mehr als gering. Du kannst um genau zu sein nicht viel mehr als einen Text erstellen, ihn mit Absätzen formatieren, vielleicht eine Tabelle oder ein Bild hinzufügen. Um jetzt mehr möglichkeiten bei der Gestalltung zu haben gibt es CSS. Mit CSS kannst du z.B. die Schriftfarben und Größen, die Postion eines Bildes im Viewport (So wird der sichtbare Bereich deines Browserfensters genannt, oder auch das Verhalten wie der Text um deine Bilder herumläuft. Es können Abstände festgelegt werden und und und...

Alle das passiert intern auch in Schreibprogrammen wie Word.

Jetzt hast du beim IceBlue-Design schon einen fertigen CSS-Code der das Aussehen deiner Seite regelt und du änderst das Aussehen, indem du neuen CSS-Code hinzufügst. Der Browser liest diesen von oben nach unten und das zu letzt gesagte gilt. Jetzt kannst du dir denken, dass es nicht sehr sinnvoll ist, wenn der Browser erst Befehle einliest, die dann später doch wieder in andere geändert werden, weil es deine Seite langsamer macht.

Diese Probleme hast du im CSS-Design nicht, weil dort kein CSS-Code vorgegeben ist. Du musst ihn ganz selber schreiben. (Soviel ist es allerdings auch nicht was man wissen muss und später hat man viel weniger Probleme.)
Der größte Vorteil ist sicherlich, dass man das Layout seiner Seite komplett den eigenen Wünschen anpassen kann.

Wie gesagt. Der HTML-Code ist ja schon vorgegeben und mit ihm auch die Klassen. Über diese kannst du dann deinen CSS-Code bearbeiten. Eine Klasse oder eine ID ist ein Hilfsmittel.
Der Text einer Webseite kann aus vielen Absätzen bestehen. Wenn du einen von ihnen kursiv geschrieben haben möchtest, dann kannst du diesem Absatz eine ID geben.

Code:

<p id="dingsda"> ... </p>



Eine Id nutzt man wenn man auf ein einziges Element der Webseite zugreifen will. Wenn du jetzt mehre Absätze deiner Webseite bearbeiten willst dann gibst du ihnen eine Klasse. Dazu schreibst du in jeden Tag die Klasse hinzu.

Code:

<p class="vieledingsdas"> ... </p>


Wenn du nun mal deinen Quellcode im Browser betrachtest wirst du feststellen, dass deine Seite viele Klassen hat. Diese kannst du mit CSS bearbeiten.

Mit einem Punkt am Anfang greifst du auf eine Klasse zu.


Code:

.vieledingsgas {
...
}


Eine Raute steht für eine ID.

Code:

#dingsda {
...
}


zwischen die geschweiften Klammern schreibst du nun die Befehle, die regeln wie etwas auf deiner Seite dargestellt wird.


Hier wäre ein Beispiel für einen Code. Er ist natürlich nicht fetig, aber du kannst ihn als ausgangspunkt zum experimentieren benutzen.



Code:

#extraDiv1 {display: none;}
#extraDiv2 {display: none;}
#extraDiv3 {display: none;}
#extraDiv4 {display: none;}
#extraDiv5 {display: none;}
#extraDiv6 {display: none;}
#pre_header {display: none;}
#post_header {display: none;}
#pre_content {display: none;}
#nav_heading{display: none;}
div.header{display: none;}
h1#title{display: none;}
h2#title span {display: none;}

a:link {
color:#7b7b7b;
font-size:12px;
text-decoration:none;
}

a:visited {
color:#7b7b7b;
font-size:12px;
text-decoration:none;
}

a:hover {
color:gray;
font-size:12px;
text-decoration:none;
}

a:active {
color:gray;
font-size:12px;
text-decoration:none;
}

body {
z-index:1;
background-image:url();
background-repeat:no-repeat;
background-color:white;
margin-top:0px;
margin-left:0px;
top:0%;
left:0%;
font-family:serif;
}

#header_container {
display:block;
position:absolute;
z-index:2;
top:50px;
left:0px;
width:1000px;
height:150px;
background-image:url();
background-repeat:no-repeat;
background-color:black;
border:none;
}

#content {
display:block;
position:absolute;
z-index:3;
top:200px;
left:200px;
width:800px;
padding-top:0px;
padding-bottom:0px;
padding-left:0px;
padding-right:0px;
color:black;
font-size:12px;
background-image:url();
background-repeat:no-repeat;
background-color:transparent;
border-style:none;
border-width:0px;
border-color:transparent;
overflow:auto;
text-align:justify
}

#nav_container {
display:block;
position:absolute;
z-index:4;
left:0px;
top:200px;
width:200px;
background-image:url();
background-repeat:no-repeat;
background-color:transparent;
border-style:none;
border-width:0px;
border-color:transparent;
overflow:auto;
}

li.nav_element {
list-style-type:none;
position:relative;
border-style:none;
border-width:0px;
border-color:transparent;
width:140px;
height:25px;
text-align:center;
font-size:0px;
z-index:5;
}

li.nav_element a{
display:block;
background-image:url();
background-color:transparent;
text-decoration:none;
color:white;
}

li.nav_element a:hover {
display:block;
text-decoration:none;
color:lime;
background-position: 0px 50px;
background-color:transparent;
}

li.nav_element a:active {
display:block;
text-decoration:none;
color:lime;
background-position: 0px 25px;
background-color:transparent;
}

#counter {
display:block;
position:absolute;
z-index:6;
left:750px;
top:10px;
width:10px;
height:20px;
font-size:12px;
}
Beitrag16.07.2008 um 14:44 (UTC)    
Titel:

Danke....

Ich habe das Grundegrüst verwendet und alles past perfkt ich habe nur ein Problem und zwar wo ist die recht box/en in den code ?

mfg
______________
Günstiges Webhosting.
1 Domain + 3Gb Webspace + unlimited Traffic schon ab 2,90 Euro

http://Luckyhost.de
Beitrag16.07.2008 um 15:40 (UTC)    
Titel:

Die rechten Boxen musst du dir extra erstellen.



Code:

<style type="text/css">
table.Name der Klasse{position:absolute;left:750px;top:250px;width:250px;height:500px; z-index:10}
</style>

<table style="border:none" class="Name der Klasse"><tr><td>
Inhalt der rechten Box
</td></tr></table>


Den Code musst du dann an deine Seite anpassen. Jede Box braucht eine Klasse der du einen Namen gibst. Damit ordnest du die Box dem CSS-Code zu. left ist der Abstand von Links, top, der Abstand von oben, width die Breite, height die Höhe der Box.

Das alles kopierst du in "Text über dem Design".

Ich habe einen Generator geschrieben mit dem du dir solche Boxen erstellen kannst.

http://glattwalzwerk.de.tl/Rechte-Boxen.htm
Beitrag16.07.2008 um 16:05 (UTC)    
Titel:

Also wenn ich das richtig verstanden und ein hintergrundbild einfügen will so oder:
(habe jetz leider keine zeit um es auszuprobieren)

Code:
<style type="text/css">
table.News{position:absolute;left:750px;top:250px;width:250px;height:500px;background-image:url(URL); z-index:10}
</style>

<table style="border:none" class="News"><tr><td>
HIER DEN INHALT DER RECHTEN BOX
</td></tr></table>

______________
Günstiges Webhosting.
1 Domain + 3Gb Webspace + unlimited Traffic schon ab 2,90 Euro

http://Luckyhost.de
Beitrag17.07.2008 um 00:07 (UTC)    
Titel:

Genau. So wird es funktionieren.
Beitrag17.07.2008 um 08:57 (UTC)    
Titel:

Ok Danke nochmal
______________
Günstiges Webhosting.
1 Domain + 3Gb Webspace + unlimited Traffic schon ab 2,90 Euro

http://Luckyhost.de
Beiträge der letzten Zeit anzeigen:   


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