Text mit css formatieren
lima-city → Forum → Die eigene Homepage → Grafikdesign
auto
background
beispiel
beitrag
blabla
body
boxen
datei
fehler
formatierung
fragen
inhalt
klugscheier
korrektur
margin
meinst
none
orange
schreibe
tag
-
Hallo!!!!!
Gibt es eine m?glichkeit jede arten von text die auf einer page erscheinen mit css zu formatieren, also ob nun link oder einfach nur geschreibsel kann ich e sirgendwie mit nur einem css tag formatieren???
DANKE f?r die antworten!!!!! -
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage
-
Hi
Meinst du, dass ein bestimmter link blau ist, und so?
wenn ja:
a.blau {
color: blue;
}
dann muss der link so sein: <a href="URL" class="blau">Klick Mich!</a>
b2k-fan -
body steht f?r alles au?er links, daher musst du die links (a) mit eintragen
Nein, body steht nur f?r den body-Tag.
Aber alles was sich darin befindet erh?lt diese Formatierung aber.
Schreibt man z.B. "body { font-size:50% }"
Ist das nicht das selbe, wenn du schreibst "body, div, a { font-size: 50% }"
Folgende Komination ist z.B. m?glich:
<body>
<div>
<a href="...">Link</a>
</div>
</body>
Das w?rde dann z.B. bewirken, dass die Schriftgr??e des Links nur noch 12,5 % der eigentlichen Schriftgr??e ist.
(50% f?r body, 25 % f?r div & 12,5% f?r den Link)
Es ist also sehr wohl ein Unterschied.
Und um zu deiner Frage zur?ckzukommen:
Ja, man kann alles formatieren, Bilder, Inhalt, Links, Ticker, usw.
Ein gutes CSS-Tutorial ist ?brigens hier:
http://de.selfhtml.org/css/
a.blau {
color: blue;
}
Ist nicht ganz korrekt. Das w?rde auch bewirken, dass z.B. ein <a name="..." class="blau">-Tag so verf?rbt wird.
F?r Links muss das so aussehen:
a.blau:link {
color: blue;
}
Und die allgemeinen Link-Formatierungen gibt's nochmal hier:
http://de.selfhtml.org/css/eigenschaften/pseudoformate.htm#link_visited_hover_active_focus
H2O -
es l?sst sich auch ohne css alles formatieren, ist zwar eine veraltete methode und mittlerweile wird einem auch davon abgeraten, es noch zu verwenden, aber m?glich w?rs eben auch so:
<p><font color="#0000FF">blauer text</font></p>
alternative kannst du auch die g?ngigen Farbnamen verwenden z.b:
<p><font color="red">roter text</font></p>
Ein Tabelle mit allen m?glichen Farbnamen von navy ?ber cyan bis purple findest dubestimmt irgendwo im Netz...
Aber an sich ists halt mit css am besten, bzw wenn du das nicht kannst benutzt wenigsten die hexadezimalcodes. -
<p><font color="#0000FF">blauer text</font></p>
Arggghhhh, les mal das:
http://de.selfhtml.org/html/text/schrift.htm#art_groesse_farbe
Man sollte es m?glichst ?berhaupt nicht mehr benutzen.
Zitat:
Die hier beschriebenen HTML-Elemente sind als deprecated eingestuft, das hei?t, sie sollen in Zukunft aus dem HTML-Standard entfernt werden.
H2O
Beitrag ge?ndert am 9.12.04 21:30 von h2o -
Ja, es gibt eine m?glichkeit alles auf der Page einzustellen mit css
Ganz einfach. Du musst mit einem Texteditor erst mal die Css Datei schreiben, beispiel
/* schriftstil,abst?nde */
body
{margin-top: 0px; margin-left: 0px; margin-right: 0px;margin-bottom: 0px; color: silver; background-color:#000000; font-family: verdana,arial; font-size: 9pt;}
table, tr, td
{ color: silver ;font-family: verdana,arial; font-size: 10pt}
/* scrolleiste internet explorer ab vers.5.5 */
body
{scrollbar-arrow-color: #ff0000; scrollbar-base-color: #000000;
scrollbar-highlight-color : orange; scrollbar-shadow-color : #ff0000;
SCROLLBAR-TRACK-COLOR: #000000;}
/* menue linke seite */
#menu1 a {display: block;
background-color:#000000;
color:#ffffff; text-decoration:none ;font-family:verdana, sans-serif; font-size: 9pt;
width:175px;
padding-left: 2px; padding-bottom: 2px;padding-top: 2px;margin: 0px auto;
border:solid 1px 566d94;
}
#menu1 a:visited{background-color:#000000;
color:#ffffff;text-decoration:none;font-family:verdana, sans-serif; font-size: 9pt; width:175px;
padding-left: 2px; padding-bottom: 2px; padding-top: 2px;margin: 0px auto;
border:solid 1px orange;
}
#menu1 a:active{background-color:#000000; color:silver;text-decoration:none;font-family:verdana, sans-serif; font-size: 9pt;width:175px;
padding-left: 2px; padding-bottom: 2px; padding-top: 2px;margin: 0px auto;
border:solid 1px orange;
}
#menu1 a:hover {background-color:#000000;
color: #ffffff;
text-decoration:none ;font-family:verdana, sans-serif;
font-size:9pt;
width:175px;
padding-left: 2px; padding-bottom: 2px;
padding-top: 2px;margin: 0px auto ;
border:solid 1px red;
}
/* leiste f?r js-scripte oben und unten */
.leiste {background-color:#000000; color:silver; text-decoration:none ;font-family:verdana, sans-serif; font-size: 10pt;
padding-left: 2px; padding-bottom: 2px; padding-top: 2px;margin: 0px auto;
height:19px;
}
/* allgemeine links im text */
a:link{ color: silver; text-decoration:underline; ;font-family: verdana; font-size: 10pt;}
a:visited{color: silver;text-decoration:underline;font-family: verdana; font-size: 10pt;}
a:active{ color:silver;text-decoration:underline;font-family: verdana; font-size: 10pt; }
a:hover{ color: #000000;background-color:#ffffff; text-decoration:none;font-family: verdana; font-size: 10pt; }
/* uhr - datum */
input.datum {
font-size:9pt;
background-color:#000000;
color:silver;
border:solid 1px #566D94;
}
input.zeit{
font-size:9pt;
background-color:#000000;
color:silver;
border:solid 1px #566D94;
}
form {margin-bottom:0px;}
Diese Datei einfach zum beispiel format.css nennen
dann musst du in der HTML Datei folgendes einbinden
<link rel="stylesheet" type="text/css" href="format.css" >
(bei href musst du den Pfad eingeben, hier gehen wir mal davon aus, das die css datei im gleichen ordner ist.)
Jetzt wird alles nach dieser CSS Datei formatiert.
Fertig! Noch Fragen? Einfach hier posten -
margin-top: 0px; margin-left: 0px; margin-right: 0px;margin-bottom: 0px;
Kann man zusammenfassen zu:
margin:0px;
font-family: verdana,arial;
Am Besten am Ende noch ,sans-serif angeben, dann gibt sich der Validator zufrieden ;)
font-size: 9pt;
Schlechte Einheit f?r Schriftgr??en.
Besser ist px, und am Allerbesten % !
body
{scrollbar-arrow-color: #ff0000; scrollbar-base-color: #000000;
scrollbar-highlight-color : orange; scrollbar-shadow-color : #ff0000;
SCROLLBAR-TRACK-COLOR: #000000;}
Muss ich wohl keinen Kommentar zu abgeben...
Sollte man in eine andere Datei auslagern, und dann eine if-IE Abfrage starten.
border:solid 1px 566d94;
Das geht bestimmt nur im IE! Wenn dann #566d94;
Dann folgt noch eine falsche Reihenfolge der Link-Angaben, siehe http://de.selfhtml.org/css/eigenschaften/pseudoformate.htm#link_visited_hover_active_focus
dann musst du in der HTML Datei folgendes einbinden
<link rel="stylesheet" type="text/css" href="format.css" >
Im head der Datei.
Fertig! Noch Fragen? Einfach hier posten
Nein, aber hast du noch Fragen? Einfach hier posten
H2O -
Und weil hier jeder so sch?n mit seinen CSS-Kenntnissen rumprassen darf:
Kann man zusammenfassen zu:
margin:0px;
Und selbst wenn man unterschiedlich margins haben will kann man daraus (zB)
margin: 0px 5px 10px 5px
machen. Startet mit oben und geht im Uhrzeigersinn rum...
Schlechte Einheit f?r Schriftgr??en.
Besser ist px, und am Allerbesten % !
Am besten sind em. ungewollte Vererbungseffekte und so...
Muss ich wohl keinen Kommentar zu abgeben...
Sollte man in eine andere Datei auslagern, und dann eine if-IE Abfrage starten.
Und ganz Schlaue ben?tigen daf?r nichtmal Java oder PHP sondern verwenden Conditional Comments...
Fertig! Noch Fragen? Einfach hier posten
Nein, aber hast du noch Fragen? Einfach hier posten
H2O
Denn hier werden sie geholfen.
Beitrag ge?ndert am 9.12 22:11 von alarich -
Looooooooool da haben wir einen Klugscheisser was? (meine h2o)
Du brauchst hier keine korrekturen f?r mich zu machen, ich weiss schon was ich schreibe. Diese Datei benutze ich selber und die l?uft einwandfrei und ohne Fehler. Also was hast du da zu meckern? Das war nur ein Beispiel und ich schreibe das 99 % so ! Html 4.0 unterst?zt bereits Zeichenangaben OHNE DIE RAUTE (#) daher ist die nicht wirklich sehr wichtig! Daher ist das wurscht! Ich weiss du hast es gut gemeint, aber wenn dus nicht glaubst dann kopier es ab und teste es selber. Es l?uft einwandfrei!
Beitrag ge?ndert am 9.12 22:14 von hirbod
Beitrag ge?ndert am 9.12 22:16 von hirbod
Beitrag ge?ndert am 9.12 22:16 von hirbod -
Looooooooool du haben wir einen Klugscheisser was? (meien h2o)
Du brauchst hier keine korrekturen f?r mich zu machen, ich weiss schon was ich schreibe. Diese Datei benutze ich selber und die l?uft einwandfrei und ohne Fehler. Also was hast du da zu meckern? Das war nur ein Beispiel und ich schreibe das 99 % so ! Html 4.0 unterst?zt bereits Zeichenangaben OHNE DIE RAUTE (#) daher ist die nicht wirklich sehr wichtig! Daher ist das wurscht! Ich weiss du hast es gut gemeint, aber wenn dus nicht glaubst dann kopier es ab und teste es selber. Es l?uft einwandfrei!
Beitrag ge?ndert am 9.12 22:14 von hirbod
Lol mal nicht so rum und probier die CSS Formatierung im Mozilla und ohne die Raute... Da funktionierts n?mlich nicht mehr.
EDIT: Und auf allen deinen 3 Seiten verwendest du entweder die Raute oder die Angabe ?ber colour:rgb(x y z);
Der HexCode ohne Raute wird nicht angenommen.
Den Klugscheisser hab ich nie in den Mund genommen; es gab ja auch noch andere die hier ihr komplettes Stylesheet runtergerattert haben...
:Endlich mal wieder ein kleiner Flamewar:
Beitrag ge?ndert am 9.12 22:25 von alarich -
Der ist Zwar nicht runtergeladen, aber wenn du das meinst, dann ist ja gut. Ich verwende dies ?berall (also wenn ich auf diese Art von design aus bin) und es hat immer Funktioniert, sei es mit oder Ohne Raute. Sicherlich ist es mit der Raute besser, da es bei einigen zu Probleme kommt, aber man kann sich doch auch mal vertippen oder???
Der Stylesheet funzt und jetzt ist gut! Schon vergessen das wir dem Typen, der die Frage gestellt hat helfen wollten und nicht damit wir uns gegenseitig down machen! -
Ja meine s??en ganz ruhig wegen ein paar sch?nheitsfehlern braucht ihr euch nicht zu zanken...
Also ich habs kapiert un es funkt,aber noch ne frage:
Wie kann ich ohne!!! <body> tag sagen welches body er verwende soll denn ich ahbe mehrere body.box, body.index etc... -
Hi
Du kannst anstatt body { blabla } auch "html { blabla }" benutzen.
Aber Body ist empfehlenswerter!
b2k-fan -
Wieso ohne <body> ist es nicht viel einfacher du machst den <body> tag wieder hin? Dann kannst das so verwenden...
-
wh000t? Mehrere Bodies? Geht nicht... Du kannst nur einen Body haben, in den kommt der gesamt sichtbare Teil der Seite (ausser der CSS-Formatierung).
Ich w?rde an deiner Stelle Text-Tags (p, span, h1, h2...) f?r Text verwenden, div-tags f?rs Layot, List-tags f?r alles was in Listen aufgef?hrt wird (zB Men?s). H?ngt aber auch davon ab, wie deine Seite aufgebaut werden soll.
Die Zuweisung der id oder klasse ist relativ einfach:
In der CSS-Datei:
div.class1 {Formatierung}
div.class2 {Formatierung}
div#id1 {Formatierung}
div#id2 {Formatierung}
[...]
In der Html-Datei
<div class="class1">Inhalt</div>
<div class="class1">Inhalt</div>
<div class="class2">Inhalt</div>
<div class="class2">Inhalt</div>
<div id="id1">Inhalt</div>
<div id="id2">Inhalt</div>
ACHTUNG:
id's mit gleichem Namen d?rfen nur f?r ein einziges Div verwendet werden, es sind eindeutige Zuweisungen. Besonders empfehlenswert, wenn es sich um gro?e Teile des Layouts handelt (zB Header, Content oder Footer...)
class wird f?r mehrere divs verwendet. So kann man zB sich wiederholende Einheiten formatieren (zB Post im G?stebuch). -
Looooooooool da haben wir einen Klugscheisser was? (meine h2o)
Na wenn du so einen Mist schreibst um jemandem etwas beizubringen muss dich schlie?lich irgendwer korrigieren...
Du brauchst hier keine korrekturen f?r mich zu machen, ich weiss schon was ich schreibe. Diese Datei benutze ich selber und die l?uft einwandfrei und ohne Fehler. Also was hast du da zu meckern? Das war nur ein Beispiel und ich schreibe das 99 % so ! Html 4.0 unterst?zt bereits Zeichenangaben OHNE DIE RAUTE (#) daher ist die nicht wirklich sehr wichtig! Daher ist das wurscht!
Die Datei ist aber z.B. nicht valide und ob sie in wirklich allen Browsern so l?uft...
Ich weiss du hast es gut gemeint, aber wenn dus nicht glaubst dann kopier es ab und teste es selber. Es l?uft einwandfrei!
Nujaaaa... Wie gesagt, die Datei ist wohl kaum valide...
H2O -
sry h2o aber das muss sein ;) :
http://jigsaw.w3.org/css-validator/validator?uri=http%3A%2F%2Fh2o.pyrokar.lima-city.de%2Findex.php&warning=1&profile=css2&usermedium=all
^^ -
Meldels ich komm gleich r?ber und mach mit und dann setzts was!!!!
Also h?rt schon auf, oder macht es per pn oder icq oder sonstwas sonst ist das spam!!!!
Also da meine frage falsch verstanden wurde:
Ich habe eine style.css f?r merere dateien. aber nicht alle sollen den gleichen body haben...
Somit frage ich nun wie das damit aussieht, ob ich einen body {} tag einer datei zuweisen kann, oder ob ich <body class="???"> schreiben muss... -
Am besten im CSS-sheet:
body#seite1 {}
body#seite2 {}
etc
und in den Seite jeweils
<body id='seite1'>
[...]
</body>
und
<body id='seite2'>
[...]
</body>
etc.
Da body ein "einmaliges" Element in einer Seite ist, sollte man sowas eher ?ber die id machen. -
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage