Wie kann ich ein Formular wie dieses erstellen? Verwenden von html5 und css3

Question

Das Formular enthält einen Rahmen mit Text an einer Ecke Ich bin fest, wie ein solches Layout zu machen.

Answer 1

<b> <div style='color:darkblue'> A Simple Form </div> </b> 
 
<i> <div> form fundametals </div> </i> 
 

 
<form> 
 
<fieldset> 
 
    <legend>Customer Info:</legend> 
 
    Name: <input type="text" name="name" placeholder="Enter Your Name"><br> 
 
    Telephone: <input type="tel" name="tel" placeholder="Pattern: 1-234-567-8910" ><br> 
 
    Email Address: <input type="email" name="email" placeholder="Enter Your Email Address"> 
 
</fieldset> 
 
    
 
    
 
<fieldset> 
 
    <legend> Book:</legend> 
 
    <input type="text"> Quantity (Maximum 5) <input type="number" name="quantity" max="5"> <br> 
 

 
</fieldset> 
 
    
 
<br> 
 
<input type="button" name="submit" value="Submit"> 
 
    
 
</form>

Answer 2

"wie können wir die abgerundete Kante zu bekommen?"

Durch hinzufügen von Stil zu diesem Element mit "border-Radius: 5px" zum Beispiel.

Answer 3

@ DanielaB67 ... Sie wollen dir auch gefallen ...

fieldset { 
 
    border: 2px solid #a1a1a1; 
 
    padding: 10px 10px; 
 
    background: #dddddd; 
 
    width: 300px; 
 
    border-radius: 25px; 
 
}

<b> <div style='color:darkblue'> A Simple Form </div> </b> 
 
<i> <div> form fundametals </div> </i> 
 

 
<form> 
 
<fieldset> 
 
    <legend>Customer Info:</legend> 
 
    Name: <input type="text" name="name" placeholder="Enter Your Name"><br> 
 
    Telephone: <input type="tel" name="tel" placeholder="Pattern: 1-234-567-8910" ><br> 
 
    Email Address: <input type="email" name="email" placeholder="Enter Your Email Address"> 
 
</fieldset> 
 
    
 
    
 
<fieldset> 
 
    <legend> Book:</legend> 
 
    <input type="text"> Quantity(Maximum 5)<br> <input type="number" name="quantity" max="5"> <br> 
 

 
</fieldset> 
 
    
 
<br> 
 
<input type="button" name="submit" value="Submit"> 
 
    
 
</form>