If you remember back when you learnt about HTML, we finished the session with an input tag.
⭐ Now it's time to style our input with some CSS touches.
1. First go into your body tag and create an input.
<input type="text" placeholder="type-in-whatever-you-want" class="inp">
2. Save it and see if your code worked. If it worked go and try to write on it.
⭐ You can see that at the time you try to put an input
an outline surrounds your input.
3.To style our outline open a style tag in the head and select the input with its class.
<html>
<head>
<style>
.inp {
}
</style>
</head>
<body>
<input type="text" placeholder="type-in-whatever-you-want" class="inp">
</body>
</html>
4. Inside the selected input open a property of 'outline' and give it a value of none. This will not display an outline when you click on your input. Go and try.
🙂 You can also give color using the outline-color property.
.inp {
outline: none;
}
or
.inp {
outline-color: purple;
}