Zmiana koloru pola po kliknięciu na nazwę użytkownika lub hasło.

Question

Witam.

Co należy wpisać do HTML albo CSS, aby po kliknięciu w pole, np. "nazwa użytkownika" albo "hasło", zmienił się kolor tła, np. na żółty? Po kliknięciu ustawiony jest standardowo kolor biały.

<form method="post" action="formularz.php">
	<label for="username">Nazwa użytkownika:</label>
	<input type="text" placeholder="Login" id="username" name="username" class="inpUsername">
	<label for="email">Adres e-mail:</label>
	<input type="email" placeholder="Twój adres e-mail" id="email" name="email" class="inpEmail">
	<label for="password">Hasło:</label>
	<input type="password" placeholder="Hasło" id="password" name="password" class="inpPassword">
	<input type="submit" value="Załóż konto" class="inpKonto" />
</form>

input.inpUsername[type="text"]
{
	margin-bottom: 20px;
	position: relative;
	left: 200px;
}

input.inpEmail[type="email"]
{
	margin-bottom: 20px;
	position: relative;
	left: 200px;
}

input.inpPassword[type="password"]
{
	margin-bottom: 90px;
	position: relative;
	left: 200px;
}

 

Answer 1

Jak ma się na stałe zmienić kolor to użyj pseudoklasy :focus i zmień background-color

Answer 2

input.inpUsername[type="text"]:focus {
     background-color: #000000;
}

W taki sposób :)

Comments

Dzięki. Właśnie o to mi chodziło :)

Answer 3

Pseudoklasa active: http://kodcss.pl/kurs-css/selektory/pseudoklasy/selektor-active.

Comments

:active odnosi się do elementu, na którym aktywny jest klik myszki. W wypadku zaznaczenia pola tekstowego :focus będzie odpowiednim selektorem.

---

Rzeczywiście... nie popatrzyłem zbytnio na pytanie i nie wiedziałem, jakie ma to mieć zastosowanie.