Focus Behavior

by maxibaezpy

HTML

<select>
  <option>Option 1</option>
  <option>Option 2</option>
  <option>Option 3</option>
  <option>Option 4</option>
  <option>Option 5</option>
</select>

CSS

select:active{
  border: 2px solid blue;
  outline:none;
}

select:visited{
  border: 2px solid green;
  outline:none;
}

select:focus, 
select:focus-visible{
   border: 2px solid red;
   outline:none;
}