FAVOR MIRAR EL VIDEO

BORDES
BORDES EN CSS
Las propiedades de borde de CSS le permiten especificar
el estilo, el ancho y el color del borde de un elemento.

La border-style propiedad especifica qué tipo de borde

mostrar.

Ejemplo:
P
 {
  border-style: solid;

}
 BORDES EN CSS
La border-width propiedad especifica el ancho de los
cuatro bordes.

El ancho se puede establecer como un tamaño

específico (en px, pt, cm, em, etc.) o usando uno de
los tres valores predefinidos: fino, medio o grueso.
Ejemplo:

p { p {
  border-style: solid;   border-style: dotted;
  border-width: 5px;   border-width: 2px;
} }
p{ p {
  border-style: solid;   border-style: dotted;
  border-width: medium;   border-width: thick;
}
}
 BORDES EN CSS
La border-width propiedad puede tener de uno a cuatro valores (para el borde
superior, el borde derecho, el borde inferior y el borde izquierdo).

Ejemplo:
p {
  border-style: solid
  border-width: 5px 20px; 
}
p {
  border-style: solid;
  border-width: 20px 5px;
p {
  border-style: solid;
  border-width: 25px 10px 4px 35px; 
}
BORDES EN CSS

La border-color propiedad se utiliza para establecer el color de los cuatro bordes.

Nota: si border-color no se establece, hereda el color del elemento.

El color se puede configurar mediante:

 nombre - especifique un nombre de color, como "rojo"
 HEX: especifique un valor HEX, como "#ff0000"
 RGB: especifica un valor RGB, como "rgb(255,0,0)"
 HSL: especifique un valor HSL, como "hsl(0, 100%, 50%)"
 transparente
BORDES EN CSS

Ejemplo:

p {
  border-style: solid;
  border-color: red;
}

La border-color propiedad puede tener de uno a cuatro valores (para el borde superior, el borde
derecho, el borde inferior y el borde izquierdo).
BORDER EN CSS
En CSS, también hay propiedades para especificar
cada uno de los bordes (superior, derecho, inferior
e izquierdo).

Ejemplo:

p {
  border-style: dotted solid double dashed;
}
Propiedad abreviada
Para acortar el código, también es posible especificar todas las
propiedades de borde individuales en una propiedad.

La border propiedad es una propiedad abreviada para las siguientes

propiedades de borde individuales:

p {
  border: 5px solid red;
}
BORDES EN CSS

También puede especificar todas las

propiedades de borde individuales para
un solo lado:

p {
  border-left: 6px solid red;
}
BORDES EN CSS

La border-radius propiedad se usa

para agregar bordes redondeados a un
elemento.

p {
  border: 2px solid red;
  border-radius: 5px;
}
PRÁCTICA
Tomando en cuenta la anterior explicación implementa las propiedades y por los
menos 3 valares distintos en una página nueva llamada Borde-Css:

1. border-style
2. border-width
3. border-color
4. border-radius
5. Border

Nota: hacer capturas del código y la ejecución, recordar comentar el código.