hallo
ik heb een mooi afbeelding (login) die wil ik gaan gebruiken
en geen standaart grijse submit knop

maar als ik die plaatjes gebruik dan doet die niks en als ik die grijse submit grbuik dan wel
dit is het form script, ik heb ook gehoord dar er met java word gewerkt dan?

PHP Code:

          <form method="post" action="?pagina=login">
          <input type="text" name="naam" class="input-login" onfocus="if(this.value=='Gebruikersnaam...'){this.value='';}" value="Gebruikersnaam..." />
          <input type="password" name="ww" class="input-login" onfocus="if(this.value=='Wachtwoord...'){this.value='';}" value="Wachtwoord..." />
          <input type="submit" name="submit" class="input-button" value="" />
          <img src="afbeeldingen/wwforgot.png" title="Wachtwoord vergeten?" />
          <a href="?pagina=registreren"><img src="afbeeldingen/registreer.png" border="0" /></a>
          </form> 


Kan met css. En dan met padding tekst op de juiste plek zetten.

input.form-login {
background: lol.jpg;
background-repeat: no-repeat;
outline: none;
border: none;
}

Je kunt er ook een button maken

button.submit-login{
background: button.png;
border: 0;
width: breedte;
height: hoogte;
}

en dan in je html
<button class="submit-login" name="submit"></button>

Beste Richard,

Voeg het volgende toe aan je .css file:

#submitInloggen
{
Background: url( images path hier) no repeat;
}

Hiermee zou het moeten lukken.

Met vriendelijke groeten,
Danny Postma
www.dpdesigns.nl

het is me al gelukt, maar bedank voor de hulp

Het src attribuut kan ook gebruikt worden op het input element;

<input type="submit" src="path/to/the/image.png" />

Dit kan voor bepaalde doeleinden makkelijk zijn wanneer je de afbeelding wilt definiëren in html.

<input type="image" src="image.png">

De type image wordt dan gebruikt als Submit button.
Zo simpel is dat..

Origineel gepost door Benny Polak

<input type="image" src="image.png">

De type image wordt dan gebruikt als Submit button.
Zo simpel is dat..

Da's niet waar. Maarja, antwoord is al gegeven.

Origineel gepost door Jeroen Visser

Da's niet waar. Maarja, antwoord is al gegeven.

Wat is mis met <input type='image'>?

Origineel gepost door Jeroen Visser

Da's niet waar. Maarja, antwoord is al gegeven.

Graag even onderbouwing hiervan. Input type image is hier, voor de tijd van css, voor gemaakt...

"Da's niet waar. Maarja, antwoord is al gegeven."

Dat is dus wel waar.
Bron: http://www.w3schools.com/TAGS/att_input_type.asp

"Input type image is hier, voor de tijd van css, voor gemaakt..."

Gedeeltelijk waar.

Er zijn heel veel elementen en attributen ontstaan voor de opmaak van een webpagina. Veel van deze elementen en attributen zijn in latere versies van html ook weer verdwenen (vooral in de strict variant hiervan) maar waarom bestaat deze dan nu nog wel? En gaat deze variant ooit verdwijnen?

Het antwoord is vrij logisch:

Een submit button is een vorm van "essentiële informatie" binnen de webpagina.

Wanneer je een submit knop opmaakt met alleen een afbeelding dus geen tekst (Vb: een knop met een pijl of een afbeelding waarin de tekst is verwerkt) en je definieert dit in css dan is deze vorm van informatie niet meer toegankelijk in een tekst browser zonder css ondersteuning, niet meer toegankelijk voor zoekmachines en voorlees computers (blinden en slechtzienden).

Fout:

Code:

<input type="submit" value="" class="submit" />

input.submit {
      background: url('path/to/the/image.png');
}

Goed:

Code:

<input type="image" src="path/to/the/image.png" alt="Verzendknop" />

De submit knop in mijn laatste voorbeeld is dus wel toegankelijk voor tekstbrowsers, zoekmachines en voorlees computers (mede dankzij het alt attribuut).

De reden voor het bestaan is dus volledig te refereren aan de Web Content Accessibility Guidelines (WCAG) en de Webrichtlijnen. Deze variant zal daarom niet verdwijnen.

Het mag een goede les zijn om deze variant vaker te gebruiken, voornamelijk wanneer je niets in het value="" attribuut schrijft.