The following code sample illustrates the CSS3 selectors/combinators usage in html documents.
<html>
<style>
section > hgroup{color:#0FFFF}
#form1{margin:20px;font-size:30px;width:300px;border:5px solid green;padding-left:20px}
label:hover {color:red}
p{border:10px solid black}
form:hover {color:blue;font-weight:bold}
b{text-decoration:underline;text-shadow:2px 2px 2px gray,0 0 10px red;
font-weight:bold}
label label{font-size:20cm}
</style>
<body>
<section>
<hgroup>
<h1>Demo</h1>
<p><b>Registration</b></br></br>
Please fill out the following registration form with valid values.</p>
<form id="form1">
<label for="fName">First Name</label><input name="fName" type="text" placeholder="Enter Your Name" required="required"> </br></br>
<label for="lName">Last Name</label><input name="lName" type="text" placeholder="Enter Your Last Name" required="required"></br></br>
<label for="phone">Phone</label><input name="phone" type="text" placeholder="Enter Your Phone Number" pattern="\d\d\d-\d\d\d-\d\d\d\d" required="required"></br></br>
<label for="Email">Email</label>
<input type="email" placeholder="yourName@tdd.com" required="required">
</br></br>
<input type="submit" value="save">
</form>
</hgroup>
</section>
</body>
</html>