Ciao a tutti, come faccio a mettere un'immagine dentro un:
...? Ho visto in alcuni siti che ci riescono..ma ora non ricordo quali! XD..Codice PHP:<input type="text" name="nome" />
Voi lo sapete fare?
Grazie 1000...ciao Davide! ^^
Printable View
Ciao a tutti, come faccio a mettere un'immagine dentro un:
...? Ho visto in alcuni siti che ci riescono..ma ora non ricordo quali! XD..Codice PHP:<input type="text" name="nome" />
Voi lo sapete fare?
Grazie 1000...ciao Davide! ^^
Come sfondo.
Ciao!
No..proprio deve essere dentro allineata a sinistra...prima del testo ossia:
Ciao! :)Codice PHP:<input type="text" name="ciao" value="IMG testo" />
Come fondo e poi vai di padding
:???: perchè no?
Tutti i campi che hai visto con una immagine al loro interno sono stati realizzati in questo modo.
Puoi allineare l'immagine di sfondo dove vuoi, farla ripetere o meno, dargli desgli spazi esterni ed interni (per esempio per non farci sovrapporre il testo che si scrive)...
Ciao!
...un esempio pratico? Lo sfondo è diverso dall'immagine...
Io devo mettere una casetta per esempio ma non come sfondo..deve restare 16x16px..
Ciao! :)
Sarà banale ma non potresti fare così?
Codice HTML:<img src="linkimm"> <input type="text" value="">
Ma guarda che lo sfondo mica si distorce!
L'immagine messa come sfondo mantiene le su caratteristiche, come se fosse richiama con il tag <img>
Ciao!
E con un pò di CSS la posizioni dove vuoi ed eviti che venga ripetuta per riempire tutto lo spazio a disposizione.
Ok..ma se io volessi che l'immagine risultasse con la posizione del testo??
Nel senso che ogni volta che metto un immagine il testo accanto ad essa sale...perchè?
-IMG- ciao come stai?
Ossia fosse allineata con il testo..
Ciao! :)
Citazione:
Originalmente inviato da debug
Ciaooooo!
Ti servono i seguenti attributi, null'altro:
background-image
background-position
background-repeat
padding
I primi tre poi si possono tranquillamente racchiudere nell'unica proprietà background
Ciao Zorinik, ho creato tre esempi di form con immagini di sfondo per il text-area che si modificano al focus; il problema è che solo Firefox riconosce questo CSS.. Qualcuno mi saprebbe dire il perché e come farlo cross-browser ?Citazione:
Originalmente inviato da Zorinik
Questa è la pagina con tre esempi: http://consapevolezza.altervista.org/b-form.html
.
Ci sono riuscito..ma ora l'immagine non è allineata al testo dentro l'input e dopo il testo viene scritto sopra! :(
Ecco lo "stamp":Codice PHP:<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>Nuova pagina 1</title>
<style>
.bgx {
background: url(icons/accept.png) no-repeat scroll left top;
}
</style>
</head>
<body>
<form method="POST">
<p><input type="text" name="asd" size="20" class="bgx" value="asdas"><input type="submit" value="Invia" name="B1"><input type="reset" value="Reimposta" name="B2"></p>
</form>
</body>
</html>
http://i29.tinypic.com/iepg2b.png
Ciao! :)
beh semplicemente perché non usi il padding :-)
alla classe bgx metti un padding-left di circa 20px, così il testo viene scritto spostato a destra ^^
mentre per allineare l'immagine di sfondo modifica 'top' con 'center' :)
Fai così:Citazione:
Originalmente inviato da sIM
Codice:<style>
.bgx {
background: url(icons/accept.png) no-repeat 3px 1px ;
padding: 2px 0px 3px 24px;
}
</style>