Druckbare Version
Also.
Ich möchte, das meine Überschriften komplett in Großbuchstaben geschrieben werden. Dabei soll der erste Buchstabe noch ein bisschen größer sein, als die anderen. Auf flare3d ist das mit dem CSS-Tag "font-variant" gelöst.
Wenn ich aber versuche, das mit Font-Variant zu lösen, wird alles gleichgroß groß geschrieben.
Muss man da irgendwas beachten?
Müsste eigentlich gehen, ich weiß nur nicht, welche Browser das unterstützen. Ansonsten eben einen <span /> mit um den ersten Buchstaben von einer Überschrift und dannHTML-Code:h1 {
text-transform:uppercase;
font-size:15px;
}
h1:first-letter {
font-size:18px;
}
HTML-Code:h1 {
text-transform:uppercase;
font-size:15px;
}
h1 span {
font-size:18px;
}
Hm...
Ich habe mich wohl unklar ausgedrückt.
Wenn ich first-letter verwende, wird, soweit ich weiß, nur der erste Buchstabe des Textes groß geschrieben. Ich will aber den Anfang jedes Wortes größer haben.
Damit werden Kapitälchen erzeugt, sprich: Großbuchstaben werden normal dargestellt und Kleinbuchstaben als verkleinerte Großbuchstaben.Code:.klasse { font-variant: small-caps }
Verschiedene Browser zeigen das aber verschieden an. Opera und FF machen Größen, die in kleineren Schriftarten kaum zu unterscheiden sind, Konqueror macht Großbuchstaben gleich fast doppelt so groß.
@Coras: Nein, soweit ich weis gibt es keine CSS-Anweisung, um die Differenz zu ändern.
Das ist richtig, jedenfalls in der Theorie.Zitat:
Zitat von Jesus_666
Ich habe genau dieses Tag einem <span>, einem <font> und einem <td> Element zugewiesen und immer wurden Groß- und Kleinbuchstaben gleich groß dargestellt.
In meinem Forum jedoch ging es komischerweise, obwohl sowohl auf der Hauptseite, als auch im Forum Tahoma als Font eingestellt ist.
Dann gehe ich davon aus, daß da irgendeine andere Regel ist, die die Darstellung stört. Wenn du nicht gerade einen andern Browser nimmst wird die selbe Formatierung immer gleich angezeigt.
Ja, davon gehe ich auch aus.
Habe nur leider nichts gefunden (übrgiens, was den Browser angeht: Ich benutze FireFox 1.0).
HTML-Code:<style type="text/css">
body {
margin: 0px;
}
.content {
background-image: url(./images/content_background.jpg);
background-repeat: no-repeat;
background-position: center;
margin: 0px;
spacing: 0px;
}
.navilinks, td, table, .content {
font-family: tahoma;
color: #c0c0c0;
text-decoration: none;
}
a:link, a:active, a:visited {
font-family: tahoma;
color: #cccccc;
text-decoration: none;
}
a:hover {
font-family: tahoma;
color: #818D98;
text-decoration: none;
}
input, textarea {
background-image: url(./images/input.jpg);
background-repeat: repeat-x;
background-color: #373737;
font-weight: 700;
font-size: 10px;
font-family: tahoma;
color: #cccccc;
text-decoration: none;
border-width: 1px;
border-style: solid;
border-color: #000000;
}
.title {
font-weight: 700;
font-size: 12px;
font-family: tahoma;
font-variant: small-caps;
}
</style>
Das funktioniert bei mir (Mozilla/5.0 (X11; U; Linux i686; de-DE; rv:1.7.5) Gecko/20041108 Firefox/1.0) genau so, wie es sollte. Allerdings könnte es sein, daß du die Großschreibung einfach nicht erkennst - bei Tahoma sind die Großbuchstaben nur wenig größer als die Kleinbuchstaben.
Flgender Code brachte bei mir absolut korrekte Ergebnisse:
In der Zeile mit Schriftgröße 24 sieht man die Groß- und Kleinschreibung deutlicher.Code:<html>
<head>
<!-- Stylesheet wurde weggelassen, da schon gepostet - hier bitte einfügen -->
</head>
<body>
<div class="title">Dies ist ein Satz mit Groß- und Kleinschreibung, oh ja.</div>
<div class="title" style="font-size: 24pt">Dies ist ein Satz mit Groß- und Kleinschreibung, oh ja.</div>
</body>
</html>
BTW, Angaben in Pixeln sollte man vermeiden; font-size wird besser mit pt angegeben; das entspricht den normalen Schriftgrößen.
X_X
...
Danke für die Hilfe - aber das hätte alles garnicht sein müssen, wie mir gerade auffällt. Ich habe nur ein "$title = strtoupper($title)" in der PHP File übersehen... naja, danke. Vielen Dank!
Nein, für den Bildschirm ist px besser, weil andere Einheiten erst umgerechnet werden müssen und auch je nach OS variierenZitat:
Zitat von Jesus_666
Pt ist nur für den Auisdruck gedacht. (Am besten ist es aber, die Schriftgrößen in em (1 em entspricht der eingestellten Schriftgröße) zu definieren, weil sie sich sonst im IE nicht vergrößern lassen)
Angaben in Pixeln haben den Nachteil, daß sie sich nicht an dan Bildschirm anpassen: Wenn der Text eine Größe von 12 Pixeln hat, dann ist er auf einem 800×600-Bildschirm 12 Pixel groß und auf einem SUXGA (2048×1536)-Bildschirm auch. Allerdings richten sich andere Formate AFAIK nach der DPI-Einstallung des Betriebssystems, womit die Schriftarten auch auf großen Bildschirmen lesbar bleiben.
Nein, das stimmt nicht, habs grade getestet, ich habe zwei <span>s genommen, der eine hatte 12pt und der andere 16px und die beiden <span>s wurden auf 1600x1200 und 800x600 immer beide genau gleich groß dargestellt obwohl 1 Pixel auf 800x600 ja doppelt so groß istZitat:
Zitat von Jesus_666
Das Problem ist, daß AFAIK die px-Angabe tatsächlich auf Pixelgrößen bezogen ist. Deshalb könnten einige Renderengines tatsächlich den Text immer n Pixel groß machen.