Ejercicios de práctica de CSS

Ejercicio 3

Aplica la pseudoclase :focus a un campo de formulario y cambia el color del borde cuando el campo esté enfocado.

Lo resolví del siguiente modo:

CSS:

            input {
                padding: 10px;
                font-size: 16px;
                border: 2px solid #ccc;
                transition: border-color 0.3s;
            }

            input:focus {
                border-color: #007bff;
                outline: none;
            }
            

HTML:

            <form>
            <label for="campo">Escribe algo:</label>
            <input type="text" id="campo" name="campo">
            </form>