Allgemeine Anfänger-Fragen zu CSS

Status
Nicht offen für weitere Antworten.
M

Markus Strässle

Grünschnabel
Guten Abend, Leute..

Endlich mal ein kompetentes Forum, so wie das hier aussieht.. ;)

Also, meine Page in der ungefähr 5. Version entstand aus HTML, PHP und einigen anderen Codes, die Dreamweaver gleich selber generiert hat..

Nun will ich in Version 6 meiner Page aber wirklich ALLES selber machen, das heisst von A-Z alles selber proggen.. Natürlich gibt das gleich nochmal so viel Arbeit, aber was solls, wenn mans gern macht..

Ich hab mal versucht auf SelfHTML ein bisschen Grundwissen für CSS zu bekommen. Dieses habe ich zwar, ich kann es aber irgendwie nicht anwenden. Dazu habe ich nun auch die Fragen: Es muss doch möglich sein, dass ich Formationsdefinitionen auch selber benennen kann, ohne die vorgegebenen wie <h1>, <p>, usw.. verwenden zu müssen. Also wenn ich für den Titel alles gleich machen will, dann würde ich gern was in diesem Sinne machen:
Code: 
titel { size-font:18pt; font-color:red; }
Aber SO funkts nicht, ich nehm mal an, dass ich nen saublöden Fehler mache..!? Aber sag mir doch mal kurz einer was für einen.. :mad:

Ich will übrigens eine separate CSS-Datei machen, bzw. habe ich schon gemacht..

Auf selfHTML habe ich Anfangs ein paar negative Äusserungen gelesen, so zum Beispiel die Kompatibilität zu IE, Opera, Netscape, usw..
Oder auch die nicht genau formatierte Schriftgrösse, was hat es damit auf sich, sind die Nachteile vernachlässigbar

Und noch eine Frage: Ist es rein mit CSS möglich einen Mouseover-Effekt mit Bildern zu erstellen? Also ohne Java und dergleichen? Dreamweaver generiert mir zwar nen Code, der ist aber extrem unübersichtlich uns ausserdem im <head>-Tag eingebetten, das will ich ganz und gar nicht..

So, das wars erstma..
 
Zuletzt bearbeitet:
da du eine "selbstbenannte Klasse (class) hast muss dies mit einem Punkt ( . ) beginnen.

Beispel:

Code: 
.headline
{
color : #ffcc00;
}

Einsatz:

Code: 
<div  class="headline">Text hier</div>
 
css-basics

Hallo Markus,

dein Beispiel-Code ist leider fehlerhaft:

1. Das HTML-Element title lässt sich mit CSS nicht gestalten

2. Es heisst font-size: und color:

Ansonsten gilt, was Thomas dir schon mitgeteilt hat...

.title /* CSS-klasse */
{
font-size: 18pt;
color: red;
}

Resumé: überprüf deinen CSS-code auf bugs (=Fehler)!
 
@ Michael:
Ne, ich wollte auch gar nicht das <title>-Tag definieren, ich wollte nur eine Class mit Namen "Titel" machen und dazu hab ich ja nur den Punkt vergessen, so funktz nämlich sogar.. (erstes Erfolgserlebnis..)

Nun habe ich aber schon die nächste Frage: Wie sieht das denn aus, wenn ich Tabellen formatieren will. Ich will dazu nicht Selektoren wie <td> verwenden sondern auch Klassen zur Hilfe nehem, da es verschiedene geben wird und auch wegen der Übersicht..

Nun, wie ich die Klassen definiere ist ja mal klar - ich nehme an, das funkt genau gleich mit
Code: 
.tableer { font-size:18pt; font-color:red; }
ODER?

Aber meine Frage ist eigentlich, wie ich nun in der Tabelle auf diese Klasse zugreife Ich will lieber nicht einfach nur ausprobieren, da ich eine technisch saubere und wenigstens mehr oder weniger korrekte Page machen will..

Danke für eure Hilfe ;)
 
Das Einbinden der CSS-Klassen in HTML-Elementen funktioniert immer gleich.

1. CSS-klasse(n) für Tabellen im Stylesheet anlegen:

table.style1
{
font-size:18pt;
color:red;
}

table.style2
{
font-size:18pt;
color:black;
}


2. CSS-Klasse(n) in HTML-Element(en) aufrufen:

<table class="style1">
<tr>
<td>... content </td>
</tr>
</table>

<table class="style2">
<tr>
<td>... content </td>
</tr>
</table>
 
Ok, sehr gut, aber muss ich dazu den table-selektor verwenden oder geht das auch mit allgemeiner Klasse ohne Selektor, also wie beim obigen Beispiel so..

.layout1 {xxx}


EDIT:
Und wenn ich das Layout nicht für die Tabelle sondern für die einzelnen Zellen verwenden will, dann muss ich dann in deinem Beispiel einfach anstelle von "table.layout1" den Code "td.layout1" verwenden
 
Zuletzt bearbeitet:
css-selektor

Selbstverständlich geht's auch ohne...

...dient nur der besseren übersicht im CSS-Code!
( = bei umfangreichen Webprojekten)
 
Und wenn ich das Layout nicht für die Tabelle sondern für die einzelnen Zellen verwenden will, dann muss ich dann in deinem Beispiel einfach anstelle von "table.layout1" den Code "td.layout1" verwenden
Zum Vergrößern anklicken....
Korrekt...!
 
css-class

Generell empfehle ich dir, das entsprechende HTML-Element im CSS-Code
vor der CSS-klasse zu notieren - so vermeidest du evtl. Konflikte und bugs.

Und wie schon erwähnt, du verlierst im CSS-Code nicht den überblick,
welche Klassen zu welchen Eelementen gehören...!
 
Danke Micheal

Ich hab das jetzt so gemacht: td.tableer {xxx} und so funkt das wunderbar.. Danke!

Ich hab aber schon die nächste Frage: Ich hab's schonmal angesprochen.. Auf selfHTML wird etwas negativ über CSS berichtet, z.B. seien bei Schriftarten keine Grössenangaben möglich, die auf allen Bildschirmen, bzw. je nach Auflösung gleich aussehen..!? Stimmt das so, oder wie ist das gmeint? Wird das sauber, wenn ich die Grösse in Punkten angebe oder gibt es eine bessere Möglichkeit
 
Status
Nicht offen für weitere Antworten.

Neue Beiträge

Zurück