Hej,
Jag tycker min nuvarande CSS-kod gör att mina formulärknappar blir väldigt stela och tråkiga. Bifogar en bild på hur det ser ut nu. Finns det någon som har en formulärknappsdesign med CSS-kod som gör knapparna lite mer levande?! :)
6 svar · 589 visningar · startad av lillebror
Hej,
Jag tycker min nuvarande CSS-kod gör att mina formulärknappar blir väldigt stela och tråkiga. Bifogar en bild på hur det ser ut nu. Finns det någon som har en formulärknappsdesign med CSS-kod som gör knapparna lite mer levande?! :)
HEJ!
Det är bara att styla på på lämpligt sätt!
<html>
<head>
<style>
.submit{
padding:0 5px;
border:solid 1px #000;
background-color:#faa;
color:#fff;
}
</style>
</head>
<body>
<input type="submit" id="submit" value="Anmäl »»" class="submit" />
</body>
</html>
Det finns på någon webbplats som jag inte kommer ihåg nu en "fullständig" genomgång om hur olika formulärelement ser ut i olika webbläsare. Kontentan är i alla fall att du inte kan räkna med att det ser likadant ut överallt.
Så här har jag löst det:
<input type="[red]image[/red]" class="goclear" name="Submit"
[red]src="http://dindomän.com/images/go.gif"[/red] alt="go" title="go" value="kommentera" />
Då kan du skapa en egen bild i ex photoshop och lägga in absolut url till bilden i koden. Snyggt blir det också :)
Tack för tipsen. Ska testa och se vad jag kan åstadkomma :) I'll be back!
Det går att lägga en vanlig bakgrundsbild på en <input type="submit">.
tjenare zcorpan! vet att det var ett tag sedan du skrev detta, men hur lägger man en bild på en inputknapp. Jag har problemet att jag vill ha 2 olika knappar som båda laddar om sidan och först så kollas vilken av knapparna som var nertryckta. Det ska alltså både vara en bild och ett id på knappen.
Tack på förhand!
//Andreas
#knapp1 { background:url(...); }
#knapp2 { background:url(...); }
Det är dock lite klurigt att "få bort" texten i knappen, om texten redan finns med i bilden.