Fix index.md format (#29684)

Fixed broken code snippets
This commit is contained in:
Gerardo Blanco
2019-08-06 15:43:52 -05:00
committed by Randell Dawson
parent b075654b4f
commit 04bbc700bd

View File

@ -8,7 +8,10 @@ localeTitle: Propiedad de la frontera
Nuestro atributo personal favorito de CSS, le permite personalizar completamente los bordes que aparecen alrededor de los elementos HTML. Con HTML, solía ser imposible colocar un borde alrededor de un elemento, excepto la tabla. Los bordes de CSS le permiten crear estilos de bordes personalizados y nítidos con muy poco trabajo, en comparación con los métodos anticuados de HTML. Nuestro atributo personal favorito de CSS, le permite personalizar completamente los bordes que aparecen alrededor de los elementos HTML. Con HTML, solía ser imposible colocar un borde alrededor de un elemento, excepto la tabla. Los bordes de CSS le permiten crear estilos de bordes personalizados y nítidos con muy poco trabajo, en comparación con los métodos anticuados de HTML.
La propiedad abreviada de `border` establece todas las propiedades de borde en una declaración. \`\` \`css borde: 1px sólido # 000; La propiedad abreviada de `border` establece todas las propiedades de borde en una declaración.
```css
border: 1px sólido # 000;
``` ```
The properties that can be set, are (in order): The properties that can be set, are (in order):
1. `border-style` 1. `border-style`
@ -17,9 +20,8 @@ The properties that can be set, are (in order):
4. `border-radius` 4. `border-radius`
It does not matter if one of the values above are missing, for example: It does not matter if one of the values above are missing, for example:
``` ```css
border: rojo sólido;
css borde: rojo sólido;
``` ```
The above code is also valid CSS. The above code is also valid CSS.
@ -41,14 +43,12 @@ The above code is also valid CSS.
Based on the property you choose, these styles can be mismatched. Based on the property you choose, these styles can be mismatched.
You can style each side seperately: You can style each side seperately:
``` ```css
estilo de borde superior: sólido; estilo de borde izquierdo: punteado; estilo de borde derecho: punteado; estilo de borde inferior: doble;
css estilo de borde superior: sólido; estilo de borde izquierdo: punteado; estilo de borde derecho: punteado; estilo de borde inferior: doble;
``` ```
Or you can style them all at once: Or you can style them all at once:
``` ```css
estilo de borde: punteado sólido con puntos dobles;
css estilo de borde: punteado sólido con puntos dobles;
``` ```
As shown, the border property allows you to select different sections of it. [top, bottom, left, right] As shown, the border property allows you to select different sections of it. [top, bottom, left, right]
@ -59,10 +59,7 @@ As shown, the border property allows you to select different sections of it. [to
values: thin, medium, or thick. values: thin, medium, or thick.
Example: Example:
``` ```css
css
table { border-width: 7px; border-style: outset; } td { border-width: medium; border-style: outset; } p { border-width: thick; border-style: solid; } table { border-width: 7px; border-style: outset; } td { border-width: medium; border-style: outset; } p { border-width: thick; border-style: solid; }
``` ```
### Border Color ### Border Color
@ -71,36 +68,38 @@ table { border-width: 7px; border-style: outset; } td { border-width: medium; bo
of your website. Border colors can be any color defined by RGB, hexadecimal, or key terms. Below is an example of each of these types. of your website. Border colors can be any color defined by RGB, hexadecimal, or key terms. Below is an example of each of these types.
Example: Example:
``` ```css
table {
css border-color: rgb( 100, 100, 255);
border-style: dashed;
table { border-color: rgb( 100, 100, 255); border-style: dashed; } td { border-color: #FFBD32; border-style: ridge; } p { border-color: blue; border-style: solid; } }
td {
border-color: #FFBD32;
border-style: ridge;
}
p {
border-color: blue;
border-style: solid;
}
``` ```
### Border-Radius ### Border-Radius
The `border-radius` property allows the corners of a border to be rounded. This is done by providing a size for The `border-radius` property allows the corners of a border to be rounded. This is done by providing a size for
how much the border is to be rounded. Size can be in px or %. how much the border is to be rounded. Size can be in px or %.
``` ```css
radio del borde: 25px;
css radio del borde: 25px;
``` ```
Each corner of `border-radius` can be adjusted. The order is top, bottom, left, right. Each corner of `border-radius` can be adjusted. The order is top, bottom, left, right.
``` ```css
radio del borde: 15% 10px 30% 5px;
css radio del borde: 15% 10px 30% 5px;
``` ```
### Border: All in One ### Border: All in One
While it is nice that CSS allows a web developer to be very specific in creating a customized border, sometimes it is just easier and less of a headache to create a uniform border, all in single line of CSS code. While it is nice that CSS allows a web developer to be very specific in creating a customized border, sometimes it is just easier and less of a headache to create a uniform border, all in single line of CSS code.
Example: Example:
``` ```css
css
p { border: 20px outset blue; } h4 { border: 5px solid; } h5 { border: dotted; } p { border: 20px outset blue; } h4 { border: 5px solid; } h5 { border: dotted; }
```
\`\` \`
### Más información: ### Más información: