Supportnet Computer
Planet of Tech

Supportnet / Forum / Webseiten/HTML

css schriftformatierung





Frage

Hallo, wie definiert man am besten einen Satz an verschiedenen schriftgrößen in einer separaten CSS-Datei? z.B.: brauche ich einfach Klassen mit 10,11 und 12 Punkten. Wenn ich das mit .txt_11 etc. definiere, und mit <p> aufrufe bleibt das ohne Wirkung, weil vielleicht im body p,td {font-size:12px} steht? Und was nimmt man am besten? em pt px ??? Meine try and error Versuche sind zu wirr geworden ... Vielen Dank für Eure Hilfe

Antwort 1 von rfb

Zitat:
zu wirr geworden
ist auch deine Problembeschreibung.

Bitte setz hier doch mal rein:
wie du die Klassen definiert hast
und wie du sie "aufrufst"
kurz gesagt: setz hier dein CSS und ein bisschen HTML rein.

Antwort 2 von m-a-d

Hallo galadriel

Es sei dir Selfhtml ans Herz gelegt. Da findest du alles benötigte. Am besten herunterladen und als Lesezeichen im Browser speichern. So hast du jederzeit, während deiner "try and error" Versuche Zugriff darauf.

NDT

m-a-d

Antwort 3 von galadriel

Hi,

selfhtml ist ne super Quelle, aber da steht leider nicht drin, wie man das ganze geschickt aufbaut.

Sorry für Wirrnes, wahrscheinlich ist auch das css wirr... :

body {
font-size: 1em;
font-family: Verdana;
font-weight: normal;
}

h1,h2,h3,h4,p,div,td{
font-family:Verdana,sans-serif; color:#2C446D;}

p,td {
font-size: 75%; /* sollen 12px sein */
}

.txt_12 {
font-size: 80%; /* sollen 12px sein */
}

.txt_11 {
font-size: 70%; /* sollen 12px sein */
}

.txt_10 {
font-size: 65%; /* entspricht 10x */
}

a:link, a:visited, a:hover, a:active{
color:#2C446D; text-decoration:none; font-weight:bold;
}

a:hover{
text-decoration:underline;
}

a.weiss {
color:#FFFFFF;
}

------------------------------------------------------------

Die Schriftgrößen sollten doch in jedem beliebigen tag aufgerufen werden können und funktionieren,

z.B.: <p class="txt_10 "
oder woanders als <td class="txt_10 "

Das funktioniert mal und mal nicht.

???

Antwort 4 von rfb

das Mischen von Anweisungen, dadurch dass p pauschal eine Schriftgröße von 75% hat und dann evtl als Klasse noch irgendwas anderes, führt zu sicherlich interessanten Effekten, aber nicht vorhersehbaren. Streiche am besten
p,td { 
font-size: 75%; /* sollen 12px sein */ 
}

und verwende ausschließlich Klassen.
Übrigens - du gibst überall nur relative Schriftgrößen an (was aus Sicht der Barrierefreiheit vorbildlich ist), dadurch sind aber deine Vorstellungen von "75%; /* sollen 12px sein */ " usw. höchstens auf deinem Rechner mit deinen Browsereinstellungen realistisch.

Außer SelfHTML ist www.css4you.de zu empfehlen.

Antwort 5 von galadriel

Hallo rfb,

Danke-Danke, aber wo sind die Anweisungen gemischt ...?

Hier etwa:
a:link, a:visited, a:hover, a:active{
color:#2C446D; text-decoration:none; font-weight:bold;
}
?

(Soll tatsächlich möglichst barrierefrei sein ...)

ok, und Klassen rufe ich dann egal wo auf, z.B. im td, oder p oder sonstwo?

Und sag mal, line-height, warum geht das nicht im IE???

Viele Grüße

Antwort 6 von rfb

gemischt sind Anweisungen wie
 <p class="txt_10 ">
da dann
p { font-size: 75%; } 
und
.txt_10 { font-size: 65%; }
gleichzeitig ausgeführt werden soll.

Klassen rufst du so auf wie du es auch geschrieben hast: <p class="...">

line-height funktioniert im IE !
Schau dazu mal auf CSS4You (s.o.), dort wird auch bei jeder CSS-Eigenschaft erklärt, welcher Browser die unterstützt (gegenüber SelfHTML hat CSS4You dabei den Vorteil akueller zu sein)

Antwort 7 von galadriel

Hallo rfb,

darf man denn line-height nur in bestimmten Tags anwenden?

#sub_menu {
line-height:16px;
}

macht nur Firefox, nix IE

Dafür zeigt firefox kein background-image an wenn ich ein float tag verwende, ist das ein bekanntes Phänomen?

Hab ein content Layer mit dem background-image
darin zwei Layer mit je float:left

Vielen Dank für die Hilfe

Antwort 8 von rfb

Zitat:
darf man denn line-height nur in bestimmten Tags anwenden?
Antwort aus CSS4You:
Zitat:
Anwendbar auf: Alle Elemente
- bevor du weitere Fragen in dieser Art stellst solltest du dich vielleicht mal dort schlau machen.

Mit der Layer-Problematik-Beschreibung (ich hoffe mal du meinst eigentlich <div> und nicht das veraltete <layer>) kann ich nicht soviel anfangen - auch da hilft nur Quelltext (oder wenn es eine spezielle Firefox-Frage ist, die Firefox-Freunde haben ein eigenes Forum)

Ich möchte kostenlos eine Frage an die Mitglieder stellen:


Ähnliche Themen:


Suche in allen vorhandenen Beiträgen: