diff options
Diffstat (limited to 'files/es/web/css/-webkit-border-before/index.html')
-rw-r--r-- | files/es/web/css/-webkit-border-before/index.html | 137 |
1 files changed, 137 insertions, 0 deletions
diff --git a/files/es/web/css/-webkit-border-before/index.html b/files/es/web/css/-webkit-border-before/index.html new file mode 100644 index 0000000000..444337ac10 --- /dev/null +++ b/files/es/web/css/-webkit-border-before/index.html @@ -0,0 +1,137 @@ +--- +title: '-webkit-border-before' +slug: Web/CSS/-webkit-border-before +tags: + - CSS + - No estándar(2) + - Propiedad CSS + - Referencia CSS +translation_of: Web/CSS/-webkit-border-before +--- +<div>{{CSSRef}}{{Non-standard_header}}</div> + +<h2 id="Resumen">Resumen</h2> + +<p>La propiedad <a href="/es/docs/Web/CSS">CSS </a><strong><code>-webkit-border-before</code></strong> es una propiedad que permite configurar los valores de la propiedad borde para el bloque lógico de inicio en un sólo sitio de la hoja de estilos. <code>-webkit-border-before</code> se puede usar para establecer los valores para más de uno de: {{cssxref("-webkit-border-before-width")}}, {{cssxref("-webkit-border-before-style")}}, y {{cssxref("-webkit-border-before-color")}}. Se mapea a un borde físico dependiendo del modo de escritura del elemento, la direccionalidad y la orientación del texto. Se corresonde con la propiedad {{cssxref("border-top")}}, {{cssxref("border-right")}}, {{cssxref("border-bottom")}}, o {{cssxref("border-left")}} dependiendo de los valores definidos en {{cssxref("writing-mode")}}, {{cssxref("direction")}}, y {{cssxref("text-orientation")}}.</p> + +<p>Se relaciona con {{cssxref("-webkit-border-after")}}, {{cssxref("-webkit-border-start")}}, y {{cssxref("-webkit-border-end")}}, que definen los otros bordes del elemento.</p> + +<p>Esta propiedad se prevee que será incluida en el estándar como {{cssxref("border-block-start")}}.</p> + +<p>{{cssinfo}}</p> + +<h2 id="Síntaxis">Síntaxis</h2> + +<pre class="brush:css">/* Valores para el borde */ +-webkit-border-before: 1px; +-webkit-border-before: 2px dotted; +-webkit-border-before: medium dashed blue; + +/* Valores globales */ +-webkit-border-before: inherit; +-webkit-border-before: initial; +-webkit-border-before: unset; +</pre> + +<h3 id="Valores">Valores</h3> + +<p>Uno o más de los siguiente valores, dando igual el orden en el que se especifiquen:</p> + +<dl> + <dt><code><'border-width'></code></dt> + <dd>Ver {{cssxref("border-width")}}</dd> + <dt><code><'border-style'></code></dt> + <dd>Ver {{cssxref("border-style")}}</dd> + <dt><code><'color'></code></dt> + <dd>Ver {{cssxref("color")}}</dd> +</dl> + +<h3 id="Formal_syntax">Formal syntax</h3> + +<pre class="syntaxbox">{{csssyntax}}</pre> + +<h2 id="Ejemplo">Ejemplo</h2> + +<h3 id="Contenido_HTML">Contenido HTML</h3> + +<pre class="brush: html"><div> + <p class="exampleText">Texto de ejemplo</p> +</div> +</pre> + +<h3 id="Contenido_CSS">Contenido CSS</h3> + +<pre class="brush: css">div { + background-color: yellow; + width: 120px; + height: 120px; +} + +.exampleText { + writing-mode: vertical-rl; + -webkit-border-before: 5px dashed blue; +}</pre> + +<p>{{EmbedLiveSample("Example", 140, 140)}}</p> + +<h2 id="Especificaciones">Especificaciones</h2> + +<p>No es parte de ninguna especificación aunque está relacionada con la propiedad {{cssxref("border-block-start")}}.</p> + +<h2 id="Compatibilidad_con_los_distintos_navegadores.">Compatibilidad con los distintos navegadores.</h2> + +<p>{{CompatibilityTable}}</p> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th>Característica</th> + <th>Chrome</th> + <th>Firefox (Gecko)</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari (WebKit)</th> + </tr> + <tr> + <td>Soporte básico</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>Característica</th> + <th>Android</th> + <th>Firefox Mobile (Gecko)</th> + <th>IE Phone</th> + <th>Opera Mobile</th> + <th>Safari Mobile</th> + </tr> + <tr> + <td>Soporte básico</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="Ver_además">Ver además</h2> + +<ul> + <li>{{cssxref("border-block-start")}}</li> + <li>Las propiedad físicas mapeadas: {{cssxref("border-top")}}, {{cssxref("border-right")}}, {{cssxref("border-bottom")}}, y{{cssxref("border-left")}}</li> + <li>{{cssxref("writing-mode")}}, {{cssxref("direction")}}, {{cssxref("text-orientation")}}</li> +</ul> |