Heim > Web-Frontend > CSS-Tutorial > Hauptteil

Wie implementiert man ein CSS-Schaltflächenhintergrundbild? (Codebeispiel)

云罗郡主
Freigeben: 2018-10-29 15:55:15
nach vorne
6049 Leute haben es durchsucht

Wie implementiert man ein CSS-Schaltflächenhintergrundbild? Ich glaube, dass viele Freunde, die gerade mit CSS in Kontakt gekommen sind, solche Fragen haben werden. In diesem Kapitel erfahren Sie, wie Sie Hintergrundbilder für CSS-Schaltflächen implementieren. Es hat einen gewissen Referenzwert. Freunde in Not können sich darauf beziehen. Ich hoffe, es wird Ihnen hilfreich sein.

Wie implementiert man ein CSS-Schaltflächenhintergrundbild? (Codebeispiel)

Viele Leute verwenden beim Absenden eines Formulars gerne ein Bild als Absendeschaltfläche. Die meisten Leute verwenden möglicherweise JS, um das Absenden des Formulars durchzuführen, d. h. wenn der Benutzer darauf klickt Das Bild wird verwendet, um das Formular zu senden. Tatsächlich gibt es eine andere Möglichkeit, den Bildhintergrund der SENDEN-Schaltfläche festzulegen direkt in der Schaltfläche, wie folgt:

<input type="submit" name="submit_button" value="" style="background:url(imagepath) no-repeat" />
Nach dem Login kopieren

Diese Einstellungsmethode ist unter FF sichtbar, aber nicht unter IE. Wie auch immer, sie war unter IE nicht sichtbar Ich habe es getestet. Es funktioniert nicht, wenn ich es wie folgt ändere:

Eine andere Methode besteht darin, es mit CSS festzulegen. Die Implementierungsmethode ist wie folgt:

<style type="text/css">
    .submitStyle {background:url(imagpath);border:0px}
</style>
Nach dem Login kopieren

Das Obige ist eine vollständige Einführung in die Realisierung des CSS-Button-Hintergrundbilds. Wenn Sie mehr überCSS3-Video-Tutorial erfahren möchten, schauen Sie sich bitte die chinesische PHP-Website an.


Das obige ist der detaillierte Inhalt vonWie implementiert man ein CSS-Schaltflächenhintergrundbild? (Codebeispiel). Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:lvyestudy.com
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage