Propiedades CSS
Una propiedad CSS es un parámetro usado en una declaración CSS que permite definir el estilo de ciertos aspectos de elementos seleccionados.
Por ejemplo, se usa la propiedad opacity para configurar la opacidad del elemento seleccionado, que permite controlar la visibilidad del contenido detrás de ese elemento:
/* Establecer opacidad de 0.8 en elementos <img> */
img {
opacity: 0.8;
}
Cada propiedad tiene un nombre (p. ej., opacity), un valor (p. ej., 0.8), y un comportamiento definido en la renderización del documento.
CSS también define propiedades abreviadas, lo que permite especificar múltiples propiedades especificadas en una sola declaración.
Por ejemplo, la propiedad margin es una propiedad abreviada para margin-top, margin-right, margin-bottom y margin-left, que establece el margen de los cuatro lados de un elemento.
/* Asignar 1rem de margen a los elementos <img> */
img {
margin: 1rem;
}
Sintaxis
selector {
propiedad: valor;
}
Índice alfabético de propiedades
Las propiedades estándar definidas por especificaciones CSS incluyen las siguientes:
Miscelánea
A
accent-coloralign-contentalign-itemsalign-selfalignment-baselineall(abreviada)anchor-nameanchor-scopeanimation-compositionanimation-delayanimation-directionanimation-durationanimation-fill-modeanimation-iteration-countanimation-nameanimation-play-stateanimation-range-endanimation-range-startanimation-range(abreviada)animation-timelineanimation-timing-functionanimation(abreviada)appearanceaspect-ratio
B
backdrop-filterbackface-visibilitybackground-attachmentbackground-blend-modebackground-clipbackground-colorbackground-imagebackground-originbackground-position-xbackground-position-ybackground-positionbackground-repeat(abreviada)background-repeat-xbackground-repeat-ybackground-sizebackground(abreviada)baseline-shiftbaseline-sourceblock-size
Border-*
border-block-colorborder-block-end-colorborder-block-end-styleborder-block-end-widthborder-block-end(abreviada)border-block-start-colorborder-block-start-styleborder-block-start-widthborder-block-start(abreviada)border-block-styleborder-block-widthborder-block(abreviada)border-bottom-colorborder-bottom-left-radiusborder-bottom-right-radiusborder-bottom-styleborder-bottom-widthborder-bottom(abreviada)border-collapseborder-color(abreviada)border-end-end-radiusborder-end-start-radiusborder-image-outsetborder-image-repeatborder-image-sliceborder-image-sourceborder-image-widthborder-image(abreviada)border-inline-colorborder-inline-end-colorborder-inline-end-styleborder-inline-end-widthborder-inline-end(abreviada)border-inline-start-colorborder-inline-start-styleborder-inline-start-widthborder-inline-start(abreviada)border-inline-styleborder-inline-widthborder-inline(abreviada)border-left-colorborder-left-styleborder-left-widthborder-left(abreviada)border-radius(abreviada)border-right-colorborder-right-styleborder-right-widthborder-right(abreviada)border-spacingborder-start-end-radiusborder-start-start-radiusborder-style(abreviada)border-top-colorborder-top-left-radiusborder-top-right-radiusborder-top-styleborder-top-widthborder-top(abreviada)border-width(abreviada)border(abreviada)
B - C
bottombox-alignbox-decoration-breakbox-directionbox-flex-groupbox-flexbox-linesbox-ordinal-groupbox-orientbox-packbox-shadowbox-sizingbreak-afterbreak-beforebreak-insidecaption-sidecaret-animationcaret-colorcaret-shapecaret(abreviada)clearclip-pathclip-ruleclipcolor-interpolation-filterscolor-interpolationcolor-schemecolorcolumn-countcolumn-fillcolumn-gapcolumn-heightcolumn-rule-colorcolumn-rule-stylecolumn-rule-widthcolumn-rule(abreviada)column-spancolumn-widthcolumn-wrapcolumns(abreviada)contain-intrinsic-block-sizecontain-intrinsic-heightcontain-intrinsic-inline-sizecontain-intrinsic-size(abreviada)contain-intrinsic-widthcontaincontainer-namecontainer-typecontainer(abreviada)content-visibilitycontentcorner-block-end-shapecorner-block-start-shapecorner-bottom-left-shapecorner-bottom-right-shapecorner-bottom-shape(abreviada)corner-end-end-shapecorner-end-start-shapecorner-inline-end-shapecorner-inline-start-shapecorner-left-shape(abreviada)corner-right-shape(abreviada)corner-shape(abreviada)corner-start-end-shapecorner-start-start-shapecorner-top-left-shapecorner-top-right-shapecorner-top-shape(abreviada)counter-incrementcounter-resetcounter-setcursorcxcy
D - F
ddirectiondisplaydominant-baselinedynamic-range-limitempty-cellsfield-sizingfill-opacityfill-rulefillfilterflex-basisflex-directionflex-flow(abreviada)flex-growflex-shrinkflex-wrapflex(abreviada)floatflood-colorflood-opacityfont-familyfont-feature-settingsfont-kerningfont-language-overridefont-optical-sizingfont-palettefont-size-adjustfont-sizefont-smoothfont-stretchfont-stylefont-synthesis-positionfont-synthesis-small-capsfont-synthesis-stylefont-synthesis-weightfont-synthesis(abreviada)font-variant-alternatesfont-variant-capsfont-variant-east-asianfont-variant-emojifont-variant-ligaturesfont-variant-numericfont-variant-positionfont-variant(abreviada)font-variation-settingsfont-weightfont-widthfont(abreviada)forced-color-adjust
G - I
gap(abreviada)grid-area(abreviada)grid-auto-columnsgrid-auto-flowgrid-auto-rowsgrid-column-endgrid-column-startgrid-column(abreviada)grid-row-endgrid-row-startgrid-row(abreviada)grid-template-areasgrid-template-columnsgrid-template-rowsgrid-template(abreviada)grid(abreviada)hanging-punctuationheighthyphenate-characterhyphenate-limit-charshyphensimage-orientationimage-renderingimage-resolutioninitial-letterinline-sizeinset-block-endinset-block-startinset-block(abreviada)inset-block(abreviada)inset-inline-endinset-inline-startinset-inline(abreviada)inset-inline(abreviada)inset(abreviada)inset(abreviada)interactivityinterest-delayinterest-delay-endinterest-delay-startinterpolate-sizeisolation
J - M
justify-contentjustify-itemsjustify-selfleftletter-spacinglighting-colorline-breakline-clampline-height-stepline-heightlist-style-imagelist-style-positionlist-style-typelist-style(abreviada)list-style(abreviada)margin-block-endmargin-block-startmargin-block(abreviada)margin-bottommargin-inline-endmargin-inline-startmargin-inline(abreviada)margin-leftmargin-rightmargin-topmargin-trimmargin(abreviada)marker-endmarker-midmarker-startmarkermask-border-modemask-border-outsetmask-border-repeatmask-border-slicemask-border-sourcemask-border-widthmask-border(abreviada)mask-clipmask-compositemask-imagemask-modemask-originmask-positionmask-repeatmask-sizemask-typemask(abreviada)math-depthmath-shiftmath-stylemax-block-sizemax-heightmax-inline-sizemax-widthmin-block-sizemin-heightmin-inline-sizemin-widthmix-blend-mode
O - P
object-fitobject-positionobject-view-boxoffset-anchoroffset-distanceoffset-pathoffset-positionoffset-rotateoffset(abreviada)opacityorderorphansoutline-coloroutline-offsetoutline-styleoutline-widthoutline(abreviada)overflow-anchoroverflow-blockoverflow-clip-marginoverflow-inlineoverflow-wrapoverflow-xoverflow-yoverflow(abreviada)overlayoverscroll-behavior-blockoverscroll-behavior-inlineoverscroll-behavior-xoverscroll-behavior-yoverscroll-behavior(abreviada)padding-block-endpadding-block-startpadding-block(abreviada)padding-bottompadding-inline-endpadding-inline-startpadding-inline(abreviada)padding-leftpadding-rightpadding-toppadding(abreviada)page-break-afterpage-break-beforepage-break-insidepagepaint-orderperspective-originperspectiveplace-content(abreviada)place-items(abreviada)place-self(abreviada)pointer-eventsposition-anchorposition-areaposition-try-fallbacksposition-try-orderposition-try(abreviada)position-visibilitypositionprint-color-adjust
Q - S
quotesrreading-flowreading-orderresizerightrotaterow-gapruby-alignruby-overhangruby-positionrxryscalescroll-behaviorscroll-initial-targetscroll-margin-block-endscroll-margin-block-startscroll-margin-block(abreviada)scroll-margin-bottomscroll-margin-inline-endscroll-margin-inline-startscroll-margin-inline(abreviada)scroll-margin-leftscroll-margin-rightscroll-margin-topscroll-margin(abreviada)scroll-marker-groupscroll-padding-block-endscroll-padding-block-startscroll-padding-block(abreviada)scroll-padding-bottomscroll-padding-inline-endscroll-padding-inline-startscroll-padding-inline(abreviada)scroll-padding-leftscroll-padding-rightscroll-padding-topscroll-padding(abreviada)scroll-snap-alignscroll-snap-stopscroll-snap-typescroll-target-groupscroll-timeline-axisscroll-timeline-namescroll-timeline(abreviada)scrollbar-colorscrollbar-gutterscrollbar-widthshape-image-thresholdshape-marginshape-outsideshape-renderingspeak-asstop-colorstop-opacitystroke-dasharraystroke-dashoffsetstroke-linecapstroke-linejoinstroke-miterlimitstroke-opacitystroke-widthstroke
T - Z
tab-sizetable-layouttext-align-lasttext-aligntext-anchortext-autospacetext-box-edgetext-box-trimtext-box(abreviada)text-combine-uprighttext-decoration-colortext-decoration-insettext-decoration-linetext-decoration-skip-inktext-decoration-skiptext-decoration-styletext-decoration-thicknesstext-decoration(abreviada)text-emphasis-colortext-emphasis-positiontext-emphasis-styletext-emphasis(abreviada)text-indenttext-justifytext-orientationtext-overflowtext-renderingtext-shadowtext-size-adjusttext-spacing-trimtext-transformtext-underline-offsettext-underline-positiontext-wrap-modetext-wrap-styletext-wrap(abreviada)timeline-scopetoptouch-actiontransform-boxtransform-origintransform-styletransformtransition-behaviortransition-delaytransition-durationtransition-propertytransition-timing-functiontransition(abreviada)translateunicode-bidiuser-modifyuser-selectvector-effectvertical-align(abreviada)view-timeline-axisview-timeline-insetview-timeline-nameview-timeline(abreviada)view-transition-classview-transition-namevisibilitywhite-space-collapsewhite-spacewidowswidthwill-changeword-breakword-spacingwriting-modexyz-indexzoom
Propiedades no estándar
Las propiedades no estándar con prefijo del proveedor incluyen:
Prefijo -moz-
Prefijo -webkit-
-webkit-box-reflect-webkit-border-before(abreviada)-webkit-mask-box-image(abreviada)-webkit-mask-composite-webkit-mask-position-x-webkit-mask-position-y-webkit-mask-repeat-x-webkit-mask-repeat-y-webkit-tap-highlight-color-webkit-text-fill-color-webkit-text-security-webkit-text-stroke(abreviada)-webkit-text-stroke-color-webkit-text-stroke-width-webkit-touch-callout
Especificaciones
| Specification |
|---|
| CSS Syntax Module Level 3> |
| CSS Snapshot 2024> |
| CSS Cascading and Inheritance Level 6> |