Los últimos tutoriales de desarrollo web
 

Style borderStyle Property

<Estilo de objeto

Ejemplo

Añadir un "solid" borde a un <div> elemento:

document.getElementById("myDiv").style.borderStyle = "solid";
Inténtalo tú mismo "

Definición y Uso

Los conjuntos de propiedades borderStyle o devuelve el estilo de borde de un elemento.

Esta propiedad puede tomar de uno a cuatro valores:

  • Uno de los valores, como: P {border-style: sólido} - los cuatro bordes serán sólidos
  • Dos valores, como: P {border-style: sólido punteada} - parte superior y borde inferior serán sólidos, a la izquierda y se salpicado borde derecho
  • Tres valores, como: P {border-style: el doble de puntos sólida} - borde superior será sólido, se fue y será salpicado borde derecho, borde inferior será el doble
  • Cuatro valores, como: P {border-style: sólido de puntos discontinua doble} - borde superior será sólido, será salpicado borde derecho, será doble, se precipitó borde izquierdo borde inferior

Soporte del navegador

Internet ExplorerFirefoxOperaGoogle ChromeSafari

La propiedad borderStyle es compatible con todos los principales navegadores.


Sintaxis

Devolver la propiedad borderStyle:

object .style.borderStyle

Establecer la propiedad borderStyle:

object .style.borderStyle= Valores de propiedad
Valor Descripción
none Define ninguna frontera. Esto es por defecto
hidden Lo mismo que "none" , excepto en la resolución de conflictos de borde para los elementos de tabla
dotted Define un borde de puntos
dashed Define un borde punteado
solid Define un borde sólido
double Define dos fronteras. La anchura de los dos bordes son los mismos que el valor frontera-ancho
groove Define un borde acanalado 3D. El efecto depende del valor de border-color
ridge Define un borde estriado 3D. El efecto depende del valor de border-color
inset Define una frontera inserción 3D. El efecto depende del valor de border-color
outset Define un borde de inicio 3D. El efecto depende del valor de border-color
initial Establece esta propiedad a su valor por defecto. Lea acerca inicial
inherit Hereda esta propiedad de su elemento padre. Lea acerca de heredar

Detalles técnicos

Valor por defecto: ninguna
Valor de retorno: Una cadena, que representa el estilo de borde de un elemento
Versión CSS CSS1

Más ejemplos

Ejemplo

Cambiar el estilo de los cuatro bordes de un <div> elemento:

document.getElementById("myDiv").style.borderStyle = "dotted solid double dashed";
Inténtalo tú mismo "

Ejemplo

Devolver el estilo de borde de un <div> elemento:

alert(document.getElementById("myDiv").style.borderStyle);
Inténtalo tú mismo "

Ejemplo

Una demostración de todos los diferentes valores:

var listValue = selectTag.options[selectTag.selectedIndex].text;
document.getElementById("myDiv").style.borderStyle = listValue;
Inténtalo tú mismo "

Páginas relacionadas

CSS tutorial: CSS Frontera

Referencia CSS: border-style property

Referencia HTML DOM: border property


<Estilo de objeto