[CSS]Własny button Opcje

[Turson]

Mam obrazek do buttona, w css:

[HTML] pobierz, plaintext 
.button, input[type="submit"] {
background: transparent url(button1.jpg) 0 0;
}
[HTML] pobierz, plaintext 

HTML

[HTML] pobierz, plaintext 
<input class="button"  type="button" value="Start"/>
[HTML] pobierz, plaintext 

Jedynie zmienia sie tło, a mi chodzi o totalnie własny layout ;/ mam go wyciętego z PS w pliku jpg

[pedro84]

Wybacz, ale co ma się zmienić jeszcze jak podałeś TYLKO tło? Ma zacząć się sam animować? Layout strony? Ke?

[Lars_18]

Możesz użyć go jako obrazka i dodać do tego kod JavaScript/jQuery (submit()).

[pedro84]

Możesz użyć go jako obrazka i dodać do tego kod JavaScript/jQuery (submit()).

Po co?

[Turson]

Wybacz, ale co ma się zmienić jeszcze jak podałeś TYLKO tło? Ma zacząć się sam animować? Layout strony? Ke?

[HTML] pobierz, plaintext 
<div id="main">
<div id="text" class="text">
<form method="post" id="upload_form" enctype="multipart/form-data" action="upload.php">
 
		<input name="userfile[]" type="file" size="50" /> <br />
<input name="userfile[]" type="file" size="50" /> <br />
<input name="userfile[]" type="file" size="50" /> <br />
		<span id="more_file_inputs"></span> <br />
 
 
                <br /><br />
 
 
		<div id="upload" class="upload"><input class="button"  type="button" value="Start"/></div>
	</p>
</form>
</div>
</div>
[HTML] pobierz, plaintext 

[HTML] pobierz, plaintext 
body {
background: url(bg.png);
font-family: Arial, Verdana, Helvetica, sans-serif;
font-size: 75%;
padding:0;
}
#main {
background: url(kwadratin.jpg) repeat-x;
vertical-align: top;
width:900px;
height:60%;
margin:0px auto;
padding:0;
}
 
.menu_gora {
background: url(menugora.jpg) repeat-x top;
height: 80px;
padding: 2px;
color:white;
font-size:30px;
}
.mgp {
float:right;
color:white;
font-size:20px;
padding: 0px;
word-spacing:6pt
}
.mgl {
float:left;
color:white;
font-size:20px;
padding: 0px;
word-spacing:6pt
}
 
.logo {
margin: 10;
}
.text {
float:left;
color:white;
font-size:20px;
padding: 0px;
margin-top:40px;
margin-left:50px;
}
.upload {
vertical-align: top;
margin:0px auto;
padding:0;
}
.button, input[type="submit"] {
background: transparent url(button1.jpg) 0 0;
width: 145px;
	}
[HTML] pobierz, plaintext 

[krzysztof_kf]

Powinno działać obrazek na button ? jakiej przeglądarki używasz nie za duży ten obrazek ? tak na marginesie masz błędu w klasie


.logo margin: 10; ?
akapit p linia 79


EDIT

A zresztą masa tematów była już o tym

Ten post edytował krzysztof_kf 9.07.2010, 19:48:14

[Turson]

Powinno działać obrazek na button ? jakiej przeglądarki używasz nie za duży ten obrazek ? tak na marginesie masz błędu w klasie


.logo margin: 10; ?
akapit p linia 79


EDIT

A zresztą masa tematów była już o tym

Używam MF/GC

Tak wygląda button który chcę



Wrzuciłem

[HTML] pobierz, plaintext 
.button, input[type="submit"] {
background:transparent url(wyslij2.jpg) ;
font-size:18px;
font-weight:bold;
height:105;
width:292;
color:white;
}
[HTML] pobierz, plaintext 

Działa, ale ramka jest niepotrzebna

Ten post edytował TursoN 9.07.2010, 21:20:08

[gigzorr]

Jeśli dobrze rozumuje to daj

[HTML] pobierz, plaintext 
border-width: 0px;
[HTML] pobierz, plaintext 

a jeśli taka ramke masz w obrazku?zle wyciety to musisz zapisac go jako .png ew. gif zeby mial przezroczystosc.

[Turson]

Tak to wygląda




border-width: 0px; pomogło. Wielkie dzięki.

Ten post edytował TursoN 10.07.2010, 11:15:42