Propiedades CSS

facebook-svg gplus-svg twitter-svg

La lista de las propiedades CSS ordenadas alfabéticamente:

PropiedadSintaxisDescripción
align-content felexbox align-content: flex-start | flex-end | center | space-between | space-around | stretch;
grid align-content: start | end | center | space-between | space-around | stretch | space-evenly
Alinea los elementos del contenedor a lo largo del eje transversal en flexbox y a lo relativo a la columna en grid. El valor por defecto es stretch.
align-items felexbox align-items: flex-start | flex-end | center | baseline | stretch;
grid align-items: start | end | center | baseline | stretch;
Establece el valor align-self para todos los elementos descendientes directos de un elemento. Utilizada en flexbox y grid. El valor por defecto es stretch.
align-self felexbox align-self: flex-start | flex-end | center | baseline | stretch;
grid align-self: start | end | center | stretch
En felxbox la propiedad align-self reposiciona elementos individuales relativamente al eje transversal de la caja
En grid la propiedad align-self alinea el ítem relativo a la columna.
all all: initial | inherit | unset Reestablece el valor de todas las propiedades del elemento seleccionado excepto direction y unicode-bidi.
animation animation: nombre duración función-de-temporizador demora número-de-iteraciones dirección estado-de-la-animación Utilizada para animar las propiedades CSS que pueden ser animadas.
appearance -moz-appearance: none;
-webkit-appearance: none;
Utilizada para mostrar los estilos nativos del sistema operativo para un elemento como checkbox, button, textarea, radio, etc...
backdrop-filter backdrop-filter: blur() | brightness() | contrast() | drop-shadow() | grayscale() | hue-rotate() | invert() | opacity() | saturate() | sepia(); Tiene el mismo efecto que la propiedad filter, solo que los estilos se aplican al fondo (background) en lugar de aplicarse al elemento.
backface-visibility backface-visibility: hidden | visible; Decide si un elemento, girado 180º alrededor del eje X o Y, debe seguir visible ( el valor por defecto ) o no ( hidden ).
background background: color position / size repeat origin clip attachment image; Establece todas las propiedades del fondo en una sola declaración abreviada
background-attachment background-attachment: scroll | fixed | local; Se utiliza para controlar como se comportan las imágenes de fondo al desplazar la página.
background-blend-mode background-blend-mode: color | color-burn | color-dodge | darken | difference | exclusion | hard-light | hue | lighten | luminosity | multiply | normal | overlay | saturation | screen | soft-light Utilizada para combinar dos imágenes de fondo, o una imagen y un color.
background-clip background-clip: border-box | padding-box | content-box | text | inherit; Especifica hasta donde se extiende el fondo ( background ) de un elemento, ya sea color o imagen.
background-color background-color: rgb(0,0,0); Se utiliza para dar un color de fondo a un elemento HTML
background-image background-image: url(carpeta/donde/esta/la/imagen.png); Utiliza una imagen o un gradiente como imagen de fondo de un elemento HTML.
background-origin background-origin: border-box | padding-box | content-box | inherit; Utilizada para determinar como se calcula la posición ( background-position ) de la imagen de fondo ( background-image ).
background-position background-position: 50px 0;
background-position: 50% 10%;
background-position: top | bottom | left | right | center;
Permite posicionar una imagen de fondo dentro de su contenedor.
background-repeat background-repeat: no-repeat | repeat | repeat-x | repeat-y | space | round Utilizada para establecer si la imagen se repite o no y de que forma:
background-size background-size: auto | contain | cover | tamañoX[ tamañoY] Permite redimensionar las imágenes de fondo.
bleed bleed: auto |  longitud Propiedad utilizada con la regla at @page para determinar el sangrado de pagina
border border: [border-width] border-style [border-color];
border:1px solid black;
Establece en una declaración abreviada las propiedades border-width, border-style, y border-color.
border-collapse border-collapse: collapse | separate Establece si las celdas adiacentes de una tabla <table> comparten el mismo borde ( collapsed ) o no ( separate ).
border-image border-image: border-image-source || border-image-slice [ / border-image-width | / border-image-width / border-image-outset ] || border-image-repeat Utiliza una imagen o un gradiente para trazar el borde de un elemento HTML y es la declaración abreviada de border-image-source, border-image-slice, border-image-width, border-image-outset, y border-image-repeat.
border-radius border-radius: 10px; Utilizada para crear esquinas redondeadas. Es la declaración abreviada de border-top-left-radius, border-top-right-radius, border-bottom-right-radius, y border-bottom-left-radius.
border-spacing border-spacing: 1em; Controla la separación de los bordes en una tabla table con bordes separados border-collapse: separate
bottom bottom:1px; Establece la distancia entre el borde inferior de un elemento posicionado ( position:relative | absolute ... ) relativo al borde inferior de la caja padre
box-decoration-break box-decoration-break: slice | clone Decide como utilizar los elementos decorativos de un elemento ( background, border, border-radius, border-image, box-shadow, margin, y padding ) cuando el elemento ocupa múltiples líneas columnas o páginas.
box-shadow box-shadow: desplazamiento horizontal desplazamiento vertical desenfoque extension color inset; Aplica una sombra alrededor de un elemento HTML
box-sizing box-sizing : content-box | border-box | inherit; Decide como se calcula el ancho y el alto de una caja; si el padding y el border de la caja suman ( content-box ) o no ( border-box ).
break-inside break-inside: auto | avoid | avoid-page | avoid-column | avoid-region En el layout de columnas la propiedad break-inside se utiliza para controlar si romper o no un elemento html entre columnas.
caption-side caption-side: top | bottom | block-start | block-end | inline-start | inline-end Decide donde poner la descripción ( caption) de una tabla ( <table>).
caret-color caret-color: red; especifica el color del cursor de texto de un elemento editable.
clear clear: none | left | right | both | inline-start | inline-end Decide si un elemento tiene que aparecer al lado o debajo de un elemento flotado que lo precede.
clip-path clip-path: circle(50px at 0 100px); Crea una región de recorte para que solo una parte del elemento HTML sea visible
color color:red; Establece el color del texto de las decoraciones ( text-decoration ) y el valor de currentcolor
color-adjust color-adjust: economy | exact Establece como se debe optimizar el aspecto de un elemento en los dispositivos de salida ( una impresora - por ejemplo ).
column-count column-count: número | auto En el layout de columnas la propiedad column-count especifica el número de columnas.
column-fill column-fill: auto | balance | balance-all Especifica como aparece el contenido de un elemento en el layout de columnas
column-gap column-gap: tamaño | normal Especifica el tamaño ( px, em, etc…) del espacio entre columnas.
column-rule column-rule: column-rule-width column-rule-style column-rule-color Declaración abreviada para establecer las propiedades del separador entre columnas.
column-span column-span: 1 | all; Establece si un elemento puede extenderse a lo largo de varias columnas.
column-width column-width: anchura | auto; Sugiere la anchura optima de las columnas.
columns columns: column-width column-count Declaración abreviada para establecer las propiedades column-width y column-count
content content: url(imagen.jpg); Se utiliza junto con los pseudo-elementos ::before y ::after para generar el contenido que sde estos.
counter-increment counter-increment: mi-contador 5; Se utiliza junto con los pseudo-elementos ::before y ::after para especificar el incremento del contador utilizado como valor de la propiedad content
counter-reset counter-reset: contador número | none Se utiliza junto con los pseudo-elementos ::before y ::after para reestablecer el valor inicial de un contador utilizado como valor de la propiedad content
cursor cursor: auto | default | none | context-menu | help | pointer | progress | wait | cell | crosshair | text | vertical-text | alias | copy | move | no-drop | not-allowed | e-resize | n-resize | ne-resize | nw-resize | s-resize | se-resize | sw-resize | w-resize | ew-resize | ns-resize | nesw-resize | nwse-resize | col-resize | row-resize | all-scroll | zoom-in | zoom-out | grab | grabbing Especifica el tipo de cursor que se mostrara cuando el raton pasa por encima de un elemento.
direction direction: ltr | rtl | inherit; Se utiliza para indicar en que dirección fluye el texto ( rtl: de derecha a izquierda o ltr: de izquierda a derecha )
display display: inline | block | list-item | inline-block | run-in | table | inline-table | table-row-group | table-header-group | table-footer-group | table-row | table-column-group | table-column | table-cell | table-caption | none | inherit Permite definir como será mostrado un cierto elemento HTML
empty-cells empty-cells: show | hide Establece si los bordes y los fondos de las celdas vacías de una tabla table serán visibles o no.
filter filter: blur() | brightness() | contrast() | drop-shadow() | grayscale() | hue-rotate() | invert() | opacity() | saturate() | sepia(); Es una manera de aplicar filtros SVG a un elemento html (sobretodo imagenes)
flex .item { flex: flex-grow [flex-shrink] [flex-basis]; } Es una propiedad de los ítems de un contenedor flex. y representa la declaración abreviada de flex-grow, flex-shrink ( opcional ) y flex-basis ( opcional )
flex-basis flex-basis:50%; Es una propiedad de los ítems de un contenedor flex. Especifica el valor inicial del tamaño principal de un elemento flex, antes de que esté redimensionado
flex-direction flex-direction: row | row-reverse | column | column-reverse; Es una propiedad del contenedor flex, y establece la dirección de los elementos hijos ( ítems flex ).
flex-flow flex-flow: flex-direction [flex-wrap]; Es una propiedad del contenedor flex. Representa la declaración abreviada de las dos propiedades: flex-direction y flex-wrap ( opcional )
flex-grow flex-grow:2; Una propiedad de los ítems del contenedor flex. Establece cuanto puede crecer un elemento flex en relación al resto de elementos de la misma caja flex.
flex-shrink flex-shrink:2; Una propiedad de los ítems del contenedor flex. Establece cuanto puede disminuir un elemento flex en relación al resto de elementos de la misma caja flex
flex-wrap flex-wrap: nowrap | wrap | wrap-reverse; Es una propiedad del contenedor flex y especifica si puede haber un cambio de línea ( wrap ) o no ( nowrap ).
float float: left | right | none | inline-start | inline-end Especifica si un elemento debe florar o no y de que manera.
font font: italic small-caps bold 44px Georgia, sans-serif; Representa la declaración abreviada de font-style, font-variant, font-weight, font-stretch, font-size, line-height, font-family
font-display @font-face{
font-family: "Fuente Ejemplo";
src: url('fuente.woff') format('woff');
font-display: auto | block | swap | fallback | optional; }
Decide que fuente hay que mostrar si hay que mostrar antes que la fuente definida con @font-face sea disponible
font-family font-family: Courier, "Lucida Console", monospace; Define una lista de fuentes o familias de fuentes, con un orden de prioridad, para utilizar en un elemento seleccionado.
font-size font-size: tamaño | xx-small | x-small | small | medium | large | x-large | xx-large | larger | smaller Establece el tamaño de fuente.
font-size-adjust font-size-adjust: tamaño | none | inherit Ajusta la proporción de la fuente, donde la proporción se calcula como x-height / font-size.
font-stretch font-stretch: porcentaje | normal | ultra-condensed | extra-condensed | condensed | semi-condensed | semi-expanded | expanded | extra-expanded | ultra-expanded; Escoge un tipo de fuente normal, condensado o ampliado
font-style font-style: normal | italic | oblique | oblique 40deg; Establece si el texto tiene que utilizar un tipo de fuente normal, cursiva u oblicua.
font-variant font-variant: normal | small-caps | inherit; Decide si utilizar o no una variación de la fuente donde las minúsculas se parecen a las mayusculas ( small-caps ).
font-variant-numeric font-variant-numeric: normal | ordinal | slashed-zero | lining-nums | oldstyle-nums | proportional-nums | tabular-nums | diagonal-fractions | stacked-fractions Controla el uso de caracteres alternativos para números, fracciones, cero con barra, indicadores ordinales (º ª) etc... La fuente utilizada tiene que disponer de estos caracteres alternativos.
font-weight font-weight: normal | bold | bolder | lighter | 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900 | inherit; Especifica el grosor o el peso de la fuente.
grid-row /
grid-column
grid-column: 2 / 3;
grid-row: 2 / 3;
grid-row representa la declaración abreviada para grid-row-start y grid-row-end; grid-column representa la declaración abreviada para grid-column-start y grid-column-end.
grid-template-columns /
grid-template-rows
grid-template-rows: 1fr 2fr;
grid-template-columns: 1fr 1fr 1fr;
Define una plantilla de columnas ( grid-template-columns ) o de filas ( grid-template-rows ) en el Grid layout
hanging-punctuation hanging-punctuation: none | [ first || [ force-end | allow-end ] || last ] Mueve (o no) algunos signos de puntuación (punto, coma, comillas, viñetas ...etc) fuera de la caja, para dar al texto un aspecto visualmente agradable
height height: auto | altura | inherit Especifica la altura de un elemento.
hyphens hyphens: none | manual | auto Decide como separar las palabras con guiones a finales de línea.
image-rendering image-rendering: auto | crisp-edges | pixelated Establece el algoritmo que debe utilizarse para redinemsionar las imagenes.
initial-letter initial-letter: 2; Selecciona la primera letra de un elemento y establece el número de líneas que debe ocupar (en este momento solo en Safari).
isolation isolation: auto | isolate Utilizada junto con mix-blend-modes. Aisla un grupo de elementos para que no fusione con el trasfondo.
justify-content justify-content: flex-start | flex-end | center | space-between | space-around; Controla el alineamiento de los elementos de una caja flexible ( flexbox ) a lo largo de su eje principal.
left left: longitud | porcentaje | auto Establece la distancia entre el borde izquierdo de un elemento posicionado ( position:relative | absolute ... ) relativo al borde izquierdo de la caja padre
letter-spacing letter-spacing: normal | distancia; Establece el espaciado entre caracteres de texto.
line-clamp line-clamp: 3; Corta el texto después de un número especifico de líneas.
line-height line-height: normal | número | longitud | porcentaje Utilizada para establecer la altura de línea del texto.
list-style list-style: tipo posición imagen | inherit Establece las propiedades de la lista ( list-style-type, list-style-image, y list-style-position ) en una sola declaración abreviada
margin margin: 2px 1em 0 auto; Declaración abreviada para margin-top, margin-right, margin-bottom y margin-left
max-height max-height:valor; Establece la altura máxima de un elemento
max-width max-width: valor; Establece la anchura máxima de un elemento
min-height min-height: valor; Establece la altura mínima de un elemento
min-width min-width: valor Establece la anchuraa mínima de un elemento
mix-blend-mode mix-blend-mode: color | color-burn | color-dodge | darken | difference | exclusion | hard-light | hue | lighten | luminosity | multiply | normal | overlay | saturation | screen | soft-light Establece cómo el contenido de un elemento debe mezclarse con el contenido del elemento que está detras él y con el fondo del elemento.
object-fit object-fit: fill | contain | cover | none | scale-down Especifica como el contenido de un elemento reemplazado ( <img>, <video> ) tiene que encajar en su propia caja definida con width y height.
object-position object-position: top left; Estabblece como se alinea un elemento reemplazado ( <img>, <video> ) dentro de su propia caja definida con width y height.
opacity opacity: valor | inherit; Establece la opacidad de un elemento.
order order: número | initial | inherit; Es una propiedad de los ítems del contenedor flex utilizada para cambiar el orden de los elementos de una caja flex
orphans orphans: 3; Utilizada para elementos display:block ( parrafos ) situados a final de página o de columna para sugerir el número minimo de líneas antes del salto de página o de columna.
outline outline: 1px solid #000; La propiedad outline (contorno) dibuja una línea fuera de los bordes para destacar el elemento. Es la declaración abreviada de outline-width, outline-style, y outline-color
outline-offset outline-offset: distancia | inherit: Desplaza ( offsets ) el contorno ( outline ) y lo dibuja más allá del borde
overflow overflow: visible | hidden | scroll | auto | inherit Decide qué pasa si el contenido se sale de la caja. Representa la declaración abreviada de overflow-x y overflow-y
overflow-x overflow: visible | hidden | scroll | auto | inherit Decide si hay que recortar el contenido en x ( en horizontal o sea: derecha/izquierda) quee sale de la caja
overflow-y overflow: visible | hidden | scroll | auto | inherit Decide si hay que recortar el contenido en y ( en vertical o sea: arriba/abajo) que sale de la caja.
overflow-wrap overflow-wrap: normal | break-word | anywhere Decide si hay que romper las palabras largas que salen de la caja. ( anywhere todavía no funciona )
padding padding: valor(es) Establece el relleno ( padding ) de una caja y representa la declaración abreviada de padding-top, padding-right, padding-bottom, y padding-left.
padding-bottom padding-bottom: valor(es) Establece el relleno ( padding ) de una caja y representa la declaración abreviada de padding-top, padding-right, padding-bottom, y padding-left.
padding-left padding-left: valor(es) Establece el relleno a la izquierda ( padding-left ) de una caja.
padding-right padding-right: valor(es) Establece el relleno a la derecha ( padding-right ) de una caja.
padding-top padding-top: valor(es) Establece el relleno superior (padding-top) de una caja.
page-break-after
( break-after )
page-break-after: auto | always | avoid | left | right Establece si el salto de página, en el documento impreso, tiene que ser después ( after ) del elemento.
page-break-before
( break-before )
page-break-before: auto | always | avoid | left | right Establece si el salto de página, en el documento impreso, tiene que ser antes ( before ) del elemento.
page-break-inside
( break-inside )
page-break-inside: auto | avoid Establece si el salto de página, en el documento impreso, puede ocurrir dentro ( inside ) del elemento.
perspective perspective:400px; Establece la distancia entre el observador virtual, y un elemento posicionado en 3D, para darle perspectiva.
perspective-origin perspective-origin: distancia | porcentaje | left | center | right | top | bottom Establece la posición del observador. Utilizada como punto de fuga ( vanishing point ) para la perspectiva
place-items place-items: align-items ustify-items? Representa la declaración abreviada para las propiedades align-items y justify-items
pointer-events pointer-events: auto | none | visiblePainted | visibleFill | visibleStroke | visible | painted | fill | stroke | all | inherit En SVG y CSS establece como interactúa ( si interactúa ) un cierto elemento con el ratón.
position position: static | relative | absolute | sticky | fixed Decide cómo posicionar el elemento seleccionado en el documento.
quotes q { quotes: "«" "»"; }
q:before { content: open-quote }
q:after { content: close-quote }
/* Establece dos niveles de comillas */
q { quotes: "«" "»" "‹" "›"; }
Establece el aspecto de las comillas en el documento.
resize resize: none | both | horizontal | vertical | block | inline Decide si un elemento es redimensionable o no y si lo és en que dirección.
right right:1em; Establece la distancia entre el borde derecho de un elemento posicionado ( position:relative | absolute ... ) relativo al borde derecho de la caja padre
scroll-behavior scroll-behavior: auto | smooth Al hacer click en un enlace dentro del mismo documento ( <a href="#top"... ), permite establecer si la página tiene que saltar a la nueva posición o si debe desplazarse ( scrooll ) fluidamente
shape-outside shape-outside: circle() | ellipse() | polygon() | inset() | url() | margin-box | border-box | padding-box | content-box | initial | inherit Define como se ajusta el texto alrededor del elemento flotado.
shape-margin shape-margin: longitud | porcentajes Establece un margen alrededor de un trazado definido con ls propiedad shape-outside.
tab-size tab-size: número entero | longitud | inherit Establece la anchura del carácter tab (U+0009) que aparece en un documento HTML.
table-layout table-layout: auto | fixed establece el algoritmo utilizado para diseñar una tabla <table>
text-align text-align: start | end | left | right | center | justify | match-parent Establece la alineación horizontal del texto en un elemento bloque o de una celda de tabla.
text-align-last text-align-last: auto | start | end | left | right | center | justify Establece la alineación horizontal de la última línea de texto en un elemento bloque
text-decoration text-decoration: text-decoration-line || text-decoration-style || text-decoration-color Representa la declaración abreviada de las propiedades text-decoration-line, text-decoration-color, text-decoration-style y de la nueva text-decoration-thickness
text-decoration-color text-decoration-color: color Establece el color de las decoraciones del texto añadidas con text-decoration-line
text-decoration-line none | underline || overline || line-through || blink Establece el tipo de decoración utilizada para el texto
text-decoration-skip text-decoration-skip: none | objects | spaces | edges | ink | box-decoration Establece dónde y cómo interrumpir la línea decorativa de un texto declarada con text-decoration-line
text-decoration-skip-ink text-decoration-skip-ink: auto | none Establece dónde y cómo interrumpir la línea decorativa de un texto declarada con text-decoration-line. Equivalente de text-decoration-skip: ink;
text-decoration-style text-decoration-style: solid | double | dotted | dashed | wavy Especifica el estilo de línea utilizada para la decoración de un texto ( declarada con text-decoration-line )
text-indent text-indent: longitud | porcentaje | inherit Especifica la indentación de la primera línea de texto de un elemento de bloque.
text-justify text-justify: auto | inter-character | inter-word | none Establece el tipo de justificación del texto cuando text-align: justify;
text-overflow text-overflow: clip | ellipsis | "cadena de texto"; Decide que hacer con el texto que sobresale de la caja por ejemplo cuando white-space: nowrap
text-rendering text-rendering: auto | optimizeSpeed | optimizeLegibility | geometricPrecision | inherit Proporciona información al navegador acerca de como optimizar el texto.
text-shadow text-shadow: desplazamiento horizontal desplazamiento vertical desenfoque color; Aplica una sombra al texto.
text-stroke text-stroke: 2px red; Una propiedad experimental que añade un contorno a los caracteres de texto, similar al stroke en SVG.
text-transform text-transform: none | capitalize | uppercase | lowercase | full-width | full-size-kana Especifica como transformar el texto utilizando mayúsculas y minúsculas.
top top: 1em; Establece la distancia entre el borde superior de un elemento posicionado ( position:relative | absolute ... ) relativo al borde superior de la caja padre.
transform transform: none | funcion_de_transformación() | initial | inherit; Utilizada para mover ( translate ) redimensionar ( scale ) girar ( rotate ) y sesgar ( skew ) el elemento seleccionado.
transform-origin transform-origin: [ left | center | right | top | bottom | porcentaje | longitud ]; Utilizada para cambiar la posición del origen de la transformación de un elemento HTML.
transform-style transform-style: flat | preserve-3d Decide si los elementos descendientes son posicionados en un edpacio tridimensional o en espacio bidimensional o plano (flat)
transition transition: propiedad duración función_de_temporizador ( opcional ) demora ( opcional ); Es la declaración abreviada de transition-property, transition-duration, transition-timing-function, y transition-delay.
transition-delay transition-delay: tiempo [, tiempo]*; Especifica el número de segundos (s) o milisegundos (ms) antes de empezar la transición.
transition-duration transition-duration: tiempo [, tiempo]*; Especifica el número de segundos (s) o milisegundos (ms) entre el comienzo y el fin de la transición.
transition-property transition-property: none | propiedad [, propiedad ]* Especifica la lista de propiedades (separadas por comas) que modificaran su valor durante la transición.
transition-timing-function transition-timing-function: función_de_temporizador Especifica como varia la velocidad durante la transición.
unicode-bidi unicode-bidi: normal | embed | bidi-override | inherit Utilizada junto con la propiedad direction para especificar cómo manejar el texto bidireccional en el documento
unicode-range @font-face{ font-family: "Fuente Ejemplo"; src: url('fuente.woff') format('woff'); unicode-range: U+00-FF; } Utilizada con @font-face para definir los caracteres disponibles
user-select user-select: auto | text | none | contain | all Controla como el texto de un elemento puede ser seleccionado por el usuario.
vertical-align vertical-align: baseline | sub | super | top | text-top | middle | bottom | text-bottom | porcentaje | longitud | inherit; Controla el alineamiento vertical de un elemento display:inline o una celda de una tabla table.
visibility visibility: visible | hidden | collapse | inherit Especifica si un elemento es visible o no.
white-space white-space: normal | nowrap | pre | pre-wrap |inherit Controla cómo gestionar el espacio en blanco dentro de un elemento
widows widows: número entero | inherit La propiedad widows ( viudas ) se utiliza con elementos display:block ( parrafos ) situados a final de página o de columna para sugerir el número de líneas después del salto de página o de columna.
width width: longitud | porcentaje | auto | inherit Especifica la anchura de una caja
will-change will-change: auto;
will-change: scroll-position;
will-change: contents;
will-change: transform;
will-change: opacity;
will-change: left, top;
Avisa al navegador que un elemento tiene que cambiar para que este pueda optimizar la página antes del cambio previsto.
word-break word-break: normal | break-all | keep-all | break-word Decide si poner un salto de línea en el medio de una palabra y cómo hacerlo.
word-spacing word-spacing: normal | longitud | porcentajes; Aumenta o disminuye el espacio en blanco entre las palabras
writing-mode writing-mode: horizontal-tb | vertical-rl | vertical-lr | sideways-rl | sideways-lr Permite establecer la dirección del texto:
z-index z-index: auto | número entero | inherit Especifica el orden de apilamiento de un elemento posicionado