nicht angemeldet
Buttons mit CSS gestalten
Hallo!
Ich würde gerne JavaScript-Buttons per CSS farblich verändern. Ich habe es schon hinbekommen, die Schriftart und -farbe auf den Buttons mit folgenden Befehlen zu ändern
input, textarea, select, IFRAME, checkbox {
font-family: "Tempus Sans ITC"; color: #000000; border:#CFDEEF 1px dotted}
Ich habe das allerdings von einer anderen HP kopiert und schaffe es nicht, herauszufinden, wofür "input, textarea, select, IFRAME, checkbox" jeweils stehen.
Das größere Problem ist jedoch, dass ich es nicht schaffe, die Farbe der Buttons selbst zu ändern.
Kann mir vielleicht jemand sagen, wie das funktionieren könnte?
Danke im vorraus,
Eva
-
Hallo Eva,
Ich würde gerne JavaScript-Buttons per CSS farblich verändern.
was sind Javascriptbuttons?
input, textarea, select, IFRAME, checkbox {
font-family: "Tempus Sans ITC"; color: #000000; border:#CFDEEF 1px dotted}was ist den 'Tempus Sans ITC' für eine Schrift?
Ich habe das allerdings von einer anderen HP kopiert
mal ehrlich, wenn du nichtmal sowas hinbekommst, solltest du dich erstmal mit dem css-Kapitel von selfhtml beschäftigen, bevor du hier fragst.
wofür "input, textarea, select, IFRAME, checkbox" jeweils stehen.
das sind die Tags auf die die Eigenschaften angewendet werden sollen in dem Fall also <input>, <textarea>, <select> und <iframe> für was da allerdings checkbox steht weiß ich nicht weil es afaik kein <checkbox>-Tag gibt, wenn man checkboxen formatieren will, muss man input[type=checkbox] verwenden (siehe Selektor-Kapitel in selfhtml) aber ich glaube der IE ist sowieso zu blöd dafür.
Das größere Problem ist jedoch, dass ich es nicht schaffe, die Farbe der Buttons selbst zu ändern.
einfach den Wert hinter 'color:' ändern.
Grüße aus Nürnberg
Tobias-
Ich würde gerne JavaScript-Buttons per CSS farblich verändern.
was sind Javascriptbuttons?Ach, ich wusste nicht, wie ichs anders nennen sollte. halt <input type="button">
input, textarea, select, IFRAME, checkbox {
font-family: "Tempus Sans ITC"; color: #000000; border:#CFDEEF 1px dotted}
was ist den 'Tempus Sans ITC' für eine Schrift?Eine sehr schöne. Ich verwende sie aber nicht, keine Sorge, das ist nur ein Beispiel.
Ich habe das allerdings von einer anderen HP kopiert
mal ehrlich, wenn du nichtmal sowas hinbekommst, solltest du dich erstmal mit dem css-Kapitel von selfhtml beschäftigen, bevor du hier fragst.Hee! Ich kenne den ganzen CSS-Teil von SELFHTML praktisch auswendig! Ich habe da auch erst nachgeguckt, aber mit dem Syntaxverzeichnis kam ich einfach nciht weiter.. entschuldige bitte.
Aber ich bin nur zufällig auf den Kram gestoßen, wozu soll ich ihn dann nochmal selbst schreiben?! Man muss doch nciht immer von alleine auf alles kommen... Ich lass mich halt gern woanders inspirieren!
wofür "input, textarea, select, IFRAME, checkbox" jeweils stehen.
das sind die Tags auf die die Eigenschaften angewendet werden sollen in dem Fall also <input>, <textarea>, <select> und <iframe> für was da allerdings checkbox steht weiß ich nicht weil es afaik kein <checkbox>-Tag gibt, wenn man checkboxen formatieren will, muss man input[type=checkbox] verwenden (siehe Selektor-Kapitel in selfhtml) aber ich glaube der IE ist sowieso zu blöd dafür.Das ist gut zu wissen. Dann gucke ich doch gelich mal in SELFHTML nach, was diese JavaScript Elemente bewirken, denn DASS ist es, was ich nicht weiß. Aber danke.
Das größere Problem ist jedoch, dass ich es nicht schaffe, die Farbe der Buttons selbst zu ändern.
einfach den Wert hinter 'color:' ändern.Nee, das geht nicht. Dann ändert sich die Schriftfarbe. Ich denke es geht mit background-color.
Vielen Dank jedenfalls,
Eva
-
-
Hallo Eva,
input, textarea, select, IFRAME, checkbox {
font-family: "Tempus Sans ITC"; color: #000000; border:#CFDEEF 1px dotted}Tempus Sans ITC ist keine gute Idee, da nicht sehr verbreitet, besser waere z.B.
font-family: "Tempus Sans ITC", Arial, Helvetica, sans-serif;
also die Angabe von alternativen Fonts, die jeder auf seinem System hat."input, textarea, select, IFRAME, checkbox" stehen fuer Input felder aller Art, Text-Areas, Select-Controls usw. (Siehe Selhtml --> Formulare)
Deine Buttons sind entweder mit <input type="submit"...> oder <button type="...>text</button> angegeben
Entsprechend musst Du einen Style haben:
button, input {background-color: #FF0000} oder was immer die Farbe sein soll.Ich wuerde die Variante mit <button> bevorzugen. Schau mal in SelfHTML unter Klickbutton und unter CSS fuer naehere Infos.
Dieter
-
Tempus Sans ITC ist keine gute Idee, da nicht sehr verbreitet, besser waere z.B.
font-family: "Tempus Sans ITC", Arial, Helvetica, sans-serif;
also die Angabe von alternativen Fonts, die jeder auf seinem System hat.Hab ich, das war nur ein Beispiel! ;-) Ich benutze Verdana und Arial, Helevtica wär wohl auch keine schlechte Idee...
Entsprechend musst Du einen Style haben:
button, input {background-color: #FF0000} oder was immer die Farbe sein soll.Ahh! Danke! das muss ich gleich mal probieren.
Liebe Grüße
Eva
-
-
Hallo Eva,
input, textarea, select, IFRAME, checkbox {
font-family: "Tempus Sans ITC"; color: #000000; border:#CFDEEF 1px dotted}Ich habe das allerdings von einer anderen HP kopiert und schaffe es nicht, herauszufinden, wofür "input, textarea, select, IFRAME, checkbox" jeweils stehen.
Das bedeutet, daß die HTML-Elemente <input ...>, <textarea>, <select>, <iframe> und <checkbox> (gibt es das?) auf deiner Seite gemäß den obigen CSS-Angaben formatiert werden sollen.
Das größere Problem ist jedoch, dass ich es nicht schaffe, die Farbe der Buttons selbst zu ändern.
Dafür mußt du das CSS-Attribut 'background-color' verwenden.
http://selfhtml.teamone.de/css/eigenschaften/hintergrund.htmWenn es nur für buttons und nicht für andere <input>-Elemente gelten soll, kannst du z.B. sowas machen:
.button { background-color: red; color: white; }
<input class="button" type="submit" ...>oder gleich <button> benutzen:
button {...}
<button type="submit"...>...</button>
(das funktioniert allerdings nur in neueren Browsern)Schau dir am besten mal das ganze CSS-Kapitel in selfhtml an:
http://selfhtml.teamone.de/css/index.htm
und beachte, daß das Formatieren von Formularelementen mit CSS in einigen Browsern Probleme machen kann. Also: testen, testen, testen...Gruß, Jan
-
Hallo Eva,
Das bedeutet, daß die HTML-Elemente <input ...>, <textarea>, <select>, <iframe> und <checkbox> (gibt es das?) auf deiner Seite gemäß den obigen CSS-Angaben formatiert werden sollen.
Hm, ja, danke, das dachte ich mir.
Schau dir am besten mal das ganze CSS-Kapitel in selfhtml an:
http://selfhtml.teamone.de/css/index.htmHab ich, kenne das praktisch auswendig. Nur da ich mich mit JavaScript nicht so auskenne, wusste ich nicht, welche Elemente ich beeinflussenn kann.
und beachte, daß das Formatieren von Formularelementen mit CSS in einigen Browsern Probleme machen kann. Also: testen, testen, testen...
Jou, ich weiß.
Vielen Dank für die Tipps!
-
Hi nochmal,
Schau dir am besten mal das ganze CSS-Kapitel in selfhtml an:
http://selfhtml.teamone.de/css/index.htm
Hab ich, kenne das praktisch auswendig. Nur da ich mich mit JavaScript nicht so auskenne, wusste ich nicht, welche Elemente ich beeinflussenn kann.Mit Javascript hat das eigentlich nichts zu tun. Die Buttons sind ja ganz normale HTML-Elemente (ob du dann z.B. bei 'onclick' JS-Code ausführen läßt ist egal). Und diese HTML-Elemente kannst du selbstverständlich mit CSS formatieren.
Gruß, Jan
-
Mit Javascript hat das eigentlich nichts zu tun. Die Buttons sind ja ganz normale HTML-Elemente (ob du dann z.B. bei 'onclick' JS-Code ausführen läßt ist egal). Und diese HTML-Elemente kannst du selbstverständlich mit CSS formatieren.
Danke für die Info! Man lernt ja wirklich nie aus. Habe mich wahrscheinlich von dem ganzen button etc. Kram verwirren lassen, weil ich diese Dinge für gewöhnlich nicht benutze.
MfG
Eva
-
-
-