[css] onderscheid tussen input box en input type=image

[whitehouse]

ik ben bezig met een style sheet voor een webpagina waarbij ik de webpagina niet kan aanpassen..

nu is er op de pagina een regel, waarop een input box staat (voor een zoek-string) en daarnaast een plaatje van het type input type=image (INPUT title="Zoek CD" type=image alt="Zoek CD" )

nu heb ik een plaatje als achtergrond van de input box, zodat er een mooi schaduw randje achter de zoekstring-box ontstaat ... maar nu staat dit schaduwtje ook achter mijn zoek-knop ...

is er in css een onderscheid te vinden tussen deze 2 verschillende inputs ?

[Verwijderd]

Met de vrij uitgebreide CSS2 selectors is dit heel eenvoudig te doen. Helaas is dit in Internet Explorer niet geïmplementeerd waardoor het eigenlijk compleet zinloos is om te gebruiken. Maar style classes aan, en ken aan het ene type input veld een andere class toe dan aan de ander.

[ Voor 4% gewijzigd door Verwijderd op 22-10-2003 19:55 ]

[whitehouse]

ehm..kan in de body geen dingen veranderen...

[r0bert]

Als je geen beveiligingproblemen krijgt:

met js getElementsByTagName alle INPUT elementen opvragen .. nalopen en alle elemten met bepaalde propertie, bijv type="text" eruit vissen en daar een class aan toe kennen ..

[Verwijderd]

Is het mogelijk om de 2 verschillende input types op de volgende manier aan te roepen, dus zonder gebruik van een 'class' in je tag?

input.image { <stijl voor plaatje> }
input.txt { <stijl voor textbox> }

[Verwijderd]

nee, dat had je zelf ook wel na kunnen zoeken/testen imho

een class selector selecteerd niks als er geen class is, zie verder reply van Cheatah

[ Voor 4% gewijzigd door Verwijderd op 06-07-2005 12:25 ]

[André]

Ja

code:

input[type=submit][type=reset][type=image] {
  color: #000000;
}

http://www.w3.org/TR/1998....html#attribute-selectors

[Verwijderd]

Perfect, dat zocht ik. Dank je wel.

[McVirusS]

André schreef op woensdag 06 juli 2005 @ 12:27:
Ja

code:

input[type=submit][type=reset][type=image] {
  color: #000000;
}

http://www.w3.org/TR/1998....html#attribute-selectors

Dat werkt dus niet in IE en is dus vrij zinloos zoals Cheatah al veel eerder opmerkte.

[Verwijderd]

Het is niet in alle gevallen zinloos.

In mijn geval, bijvoorbeeld, is er een site met:

code:

INPUT { border-width: 1px; }

Internet Explorer geeft input velden met het image attribuut dan zonder border weer, wat het wel zou moeten doen. Firefox geeft 'm correct weer, met border.

Als je de border niet wilt bij de images, is het dus nuttig om dit er wel bij te zetten.