How To Create A Dropdown Using HTML And CSS

We want to create a drop down  where you have to click the arrow in order to open  the list yoy want to choose from.

Once you click on the drop down arrow, it will open the list from which you have to select only on element and then in closes itself.

<p>

<label for="country-Name">Country: </label>

<select name="country" id="country">

<option value="LOndon">London</option>

<option value="Washington DC">Washington DC</option>

<option value="Canberra">Canberra</option>

<option value="brazil">brazilia</option>

<option value="Egypt">Engypt</option>

<option value="kenya">Kenya</option>

<option value="China">China</option>

</select>

</p>

<p>

<label for="city">city: </label>

<select name="city-name" id="city">

<option value="uk">UK</option>

<option value="Nairobi">Nairobi</option>

<option value="">Benin</option>

<option value="Australia">Australia</option>

<option value="Cairo">Cairo</option>

<option value="USA">USA</option>

<option value="USA">Asia</option>

</select>

</p>

It's quite a very simple thing  and makes you minimize on space and coding pages.