¿Es posible orientar un con una opción específica seleccionada?

Digamos que tengo el siguiente HTML:

 Closed Open  

Me gustaría agregar un borde a la que depende del valor seleccionado actualmente:

  • Borde rojo cuando se selecciona Closed
  • Borde verde cuando se selecciona Open

seleccionar abierto abierto

¿Hay un selector de CSS que apunte a solo cuando su valor es 0 o 1 ?

Esto no es posible solo en CSS, ya que CSS no comprende las option desplegables seleccionadas. (Incluso si lo hiciera, no sería posible hacer coincidir la option luego volver a la select principal).

Como tal, JavaScript es su única opción aquí. Puedo proporcionar un ejemplo, pero no etiquetó la pregunta JavaScript, así que no sé si esta es una opción para usted.

si está usando jquery puede hacer algo como esto

 $(".select_box").on('change',function(){ if($(".select_box").find(":selected").text() == 'Open'){ $(".select_box").css('border-color','green'); } else{ $(".select_box").css('border-color','red'); } }); 

el violín completo

No, no puedes hacerlo solo con CSS. Use Javascript o jQuery. Por ejemplo: – $('#id :selected')