Published - | Updated - May 28, 2021 12:24 am
158 Views
This post was last updated on May 28th, 2021 at 12:24 am
Hello Dev,
Today, i we will show you how to change arrows select option. This article will give you simple example of how to change arrows select option. you will learn how to change arrows select option. So let’s follow few step to create example of how to change arrows select option.
Example
<!DOCTYPE html>
<html>
<head>
<title>How To Change Arrows Select Option - Codeplaners</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
select {
border: 1px solid silver;
-webkit-appearance: none;
-moz-appearance: none;
padding-right: 25px;
background: url(data:image/gif;base64,R0lGODlhCwALAJEAAAAAAP///xUVFf///yH5BAEAAAMALAAAAAALAAsAAAIPnI+py+0/hJzz0IruwjsVADs=);
background-repeat: no-repeat;
background-position: 95% 42%;
}
</style>
</head>
<body>
<h2>How To Change Arrows Select Option</h2>
<select class="pro_select">
<option value="laravel">Laravel</option>
<option value="html">Html</option>
<option value="css">Css</option>
<option value="bootstrap" >Bootstrap</option>
</select>
</body>
</html>