revision:
The placeholder attribute specifies a short hint that describes the expected value of a input field / textarea. The short hint is displayed in the field before the user enters a value. The placeholder attribute can be used on the following elements:<input> and <textarea>.
<element placeholder=" "></element >
The hint is the expected value, which gets displayed before the user enters a value.
<form style="margin-left:3vw;" action="/action_page.php">
<label for="phone">Enter a phone number:</label><br><br>
<input type="tel" id="phone" name="phone" placeholder="123-45-678"
pattern="[0-9]{3}-[0-9]{2}-[0-9]{3}"><br><br>
<small>Format: 123-45-678</small><br><br>
<input type="submit">
</form>
Who are you?
<p class="spec"> Who are you?</p>
<textarea style="margin-left:3vw;" rows="4" cols="50"
placeholder="Describe yourself here..."></textarea>
<div>
<input type="text" class="placeholder-custom" placeholder="Please enter user name to search">
<input type="text" placeholder="Please enter user name to search">
</div>
<style>
input {width: 15vw; height: 3vw; border: none; outline: none; display: block; margin: 1vw;
border: solid 1px #dee0e9; padding: 1vw; border-radius: 1.5vw;}
.placeholder-custom::-webkit-input-placeholder {color: #babbc1; font-size: 1.2vw;}
</style>