XHTMLforum

XHTMLforum (http://xhtmlforum.de/index.php)
-   (X)HTML (http://xhtmlforum.de/forumdisplay.php?f=72)
-   -   Schaltflächen in CSS (http://xhtmlforum.de/showthread.php?t=74173)

taotao2 12.01.2021 17:34

Schaltflächen in CSS
 
Hallo,

ich wollte mal fragen, wie auf der folgenden Webseite die Schaltflächen 1-9 gemacht wurden. Zuerst dachte ich, dass das Bilder wären. Mir ist nicht ganz klar wie die Ecken rund werden und wie die Schaltflächen ein Schatten werfen, wenn es keine Bilder sind:
https://www.regionalstatistik.de/gen...scookies=false

cloned 12.01.2021 18:08

das geht mit:

box-shadow: 0 0 0.5rem #a5a5a5;
border-radius: 0.25rem;

Wird von browsern mittlerweile seit gut 10 Jahren (oder sind es noch mehr? :D ) unterstützt.

top 13.01.2021 11:35

10 Jahre kommt ungefähr hin. ( Meint jedenfalls: https://caniuse.com/?search=border-radius ;) )

Um verschiedene Werte auszuprobieren, nutze ich immer noch gerne den hier: http://css3generator.com

Die zusätzlichen Prefix-Ergänzungen ( -moz-... -ms-... usw.) braucht es heutzutage meistens nicht mehr. Im Zweifel mal bei "Can I Use" nachschauen, wie die verschiedenen Browser-Versionen es unterstützen.

taotao2 13.01.2021 15:45

Vielen Dank,

ich muss zu meiner Rechtfertigung sagen, dass ich nur ab und zu was im Webbereich mache. :lol:

taotao2 14.01.2021 17:15

Ich habe jetzt Standard submit Button geändert.
Aber der Standard Button für Formular hat noch irgendwie so einen Rand.
Wie bekomme ich den weg und welche css-Elemente hat der Standard Button? Wo könnte man so was herausfinden?

-edit-
Ich habs einfach mit border weggemacht, aber wo kann man sehen, welche CSS-Elemente standardmäßig so ein Objekt hat.

cloned 15.01.2021 14:37

Rechtsklick im Browser und "Untersuchen / Inspect / ..:" auswählen (Bzw. F12 drücken)

Damit siehst du für jedes Element jederzeit welche Styles es hat und kannst sie auch direkt im Browser bearbeiten.


Alle Zeitangaben in WEZ +2. Es ist jetzt 09:59 Uhr.

Powered by vBulletin® Version 3.8.11 (Deutsch)
Copyright ©2000 - 2024, vBulletin Solutions, Inc.

© Dirk H. 2003 - 2023