CSS Properties

Below are all of the CSS properties supported by Prince. For their precise definitions please refer to the CSS specifications.

* properties marked with an asterisk are Prince extensions.

For the values, the grammar follows the CSS Values and Units Module Level 3 specification. A short explanation of the signs:

  • A bar (|) separates two or more alternatives: exactly one of them must occur.
  • A double bar (||) separates two or more options: one or more of them must occur, in any order.
  • A double ampersand (&&) separates two or more components, all of which must occur, in any order.
  • Brackets ([ ]) are only used for grouping.
  • A plus (+) indicates that the preceding item occurs one or more times.
  • A question mark (?) indicates that the preceding item is optional (occurs zero or one times).
  • A hash mark (#) indicates that the preceding item occurs one or more times, separated by comma tokens.
  • A pair of numbers in curly braces, separated by two dots ({A..B}) indicates that the preceding item occurs at least A and at most B times.

alternate-color* color
background [ background-image
  || background-position [ / background-size ]?
  || background-repeat
  || background-attachment
  || background-origin background-clip?
  || background-color ]#
background-attachment scroll | fixed
background-color color
background-clip content-box | padding-box | border-box
background-image none | url( filename ) | linear-gradient( ... ) | radial-gradient( ... ) | repeating-linear-gradient( ... ) | repeating-radial-gradient( ... )
background-image-resolution* dpi | normal | auto [ , normal | dpi ]?
background-origin content-box | padding-box | border-box
background-position [ top | bottom | left | right
  | center | percent | length
  | [ top | bottom | center ]
     [ left | right | center ]
  | [ left | right | center | percent | length ]
     [ top | bottom | center | percent | length ] ]#
background-repeat repeat | repeat-x | repeat-y | no-repeat | round | space
background-size [ contain | cover | [ auto | length | percent ] {1..2} ]#
baseline-shift baseline | sub | super | percent | length
bleed* auto | [ length ] {1..4}
bookmark-label* none | content
bookmark-level* none | integer
bookmark-state* open | closed
bookmark-target* self | url( target-url ) | attr( target-attr )
border color || border-style || border-width
border-bottom color || border-style || border-width
border-bottom-color color
border-bottom-style none | hidden | solid | dashed | dotted | double | groove | ridge | inset | outset
border-bottom-width thin | medium | thick | length
border-clip normal | length
border-collapse separate | collapse
border-color color {1..4}
border-left color || border-style || border-width
border-left-color color
border-left-style none | hidden | solid | dashed | dotted | double | groove | ridge | inset | outset
border-left-width thin | medium | thick | length
border-radius length {1..2}
border-bottom-left-radius length {1..2}
border-bottom-right-radius length {1..2}
border-top-left-radius length {1..2}
border-top-right-radius length {1..2}
border-right color || border-style || border-width
border-right-color color
border-right-style none | hidden | solid | dashed | dotted | double | groove | ridge | inset | outset
border-right-width thin | medium | thick | length
border-spacing length {1..2}
border-style border-style {1..4}
border-top color || border-style || border-width
border-top-color color
border-top-style none | hidden | solid | dashed | dotted | double | groove | ridge | inset | outset
border-top-width thin | medium | thick | length
border-width [ thin | medium | thick | length ] {1..4}
bottom auto | length | percent
box-decoration-break slice | clone
box-sizing content-box | padding-box | border-box
caption-page* first | following | all
caption-side top | bottom
clear none | left | right | inside | outside | both
clip auto | rect( offset, offset, offset, offset )
clip-path none | url( path )
clip-rule nonzero | evenodd
color color
column-break-after auto | always
column-break-before auto | always
column-count number
column-fill auto | balance
column-gap length
column-rule column-rule-color || column-rule-style || column-rule-width
column-rule-color color
column-rule-style none | solid | dashed | dotted | double | groove | ridge | inset | outset
column-rule-width thin | medium | thick | length
column-span number | all
column-width auto | width
columns column-count | column-width
content normal | flow( name, page-policy? ) | [ "string" | url( filename ) | counter( name, counter-style?, page-policy? ) | counters( name, "separator", counter-style?, page-policy? ) | target-counter( url, counter, counter-style? ) | target-counters( url, counter, "separator", counter-style? ) | target-content( url ) | leader( "..." | dotted | solid | space ) | string( ident, page-policy? ) | content(  ) | prince-base-url(  ) | prince-script( ident, content? ) | prince-glyph-index( number ) | prince-fallback( url ) [ , content+ ]? | element( name ) ]+
counter-increment none | [ name number? ]+
counter-reset none | [ name number? ]+
direction ltr | rtl
display inline | block | none | list-item | run-in | table | table-header-group | table-footer-group | table-row-group | table-row | table-cell | table-caption | table-column | table-column-group | inline-block | inline-table
dominant-baseline auto | use-script | no-change | reset-size | ideographic | alphabetic | hanging | mathematical | central | middle | text-after-edge | text-before-edge
empty-cells show | hide
fill none | color | url( paint-server )
fill-opacity number
fill-rule nonzero | evenodd
filter none | [ url( url ) | blur( length ) | brightness( number | percent ) | contrast( number | percent ) | drop-shadow( length {1..3}, color? ) | grayscale( number | percent ) | hue-rotate( angle ) | invert( number | percent ) | opacity( number | percent ) | saturate( number | percent ) | sepia( number | percent ) ]+
float none | left | right | inside | outside
| footnote | inline-footnote
| prince-column-footnote
| prince-column-inline-footnote
| prince-snap
| [ [ top | bottom | column-top | column-bottom
      | column-top-corner | column-bottom-corner ]
    && [ next | unless-fit ]? ]
flow* normal | static( name, [ start | current ]? )
font font-style? font-variant? font-weight? font-size [ / line-height ]? font-family
font-family [ serif | sans-serif | monospace | name | "name" ]# prince-no-fallback?
font-size length | smaller | larger | xx-small | x-small | small | medium | large | x-large | xx-large
font-stretch ultra-condensed | extra-condensed | condensed | semi-condensed | normal | semi-expanded | expanded | extra-expanded | ultra-expanded | wider | narrower
font-style normal | italic
font-variant normal | small-caps | prince-no-kerning | prince-opentype( [ feature ]+ )
font-weight normal | bold | bolder | lighter | 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900
footnote-display* block | inline | compact
footnote-style-position outside | inside
height auto | length | percent
hyphens none | manual | auto
hyphenate-patterns* none | url( patterns-url )
hyphenate-after* integer
hyphenate-before* integer
hyphenate-character* auto | "string"
hyphenate-lines* no-limit | integer
image-resolution* dpi | normal | auto [ , normal | dpi ]?
left auto | length | percent
letter-spacing normal | length
line-stacking-strategy inline-line-height | block-line-height | max-height | grid-height
line-height normal | none | number | length
link* none | url( target-url ) | attr( target-attr )
list-style list-style-image || list-style-position || list-style-type
list-style-image none | url( image-url )
list-style-position outside | inside
list-style-type box | check | circle | diamond | disc | hyphen | square | decimal | decimal-leading-zero | lower-roman | upper-roman | lower-alpha | upper-alpha | lower-hexadecimal | upper-hexadecimal | binary | octal | asterisks | arabic-indic | lower-greek | upper-greek | lower-norwegian | upper-norwegian | lower-russian | upper-russian | lower-ukrainian | upper-ukrainian | lower-belarusian | upper-belarusian | lower-bulgarian | upper-bulgarian | lower-serbian | upper-serbian | persian | urdu | japanese-informal | japanese-formal | simp-chinese-informal | simp-chinese-formal | trad-chinese-informal | trad-chinese-formal
margin [ auto | length | percent ] {1..4}
margin-bottom auto | length | percent
margin-inside* auto | length | percent
margin-left auto | length | percent
margin-outside* auto | length | percent
margin-right auto | length | percent
margin-top auto | length | percent
marker-start none | url( marker-url )
marker-mid none | url( marker-url )
marker-end none | url( marker-url )
marks none || crop || cross
mask url( mask )
max-height none | length | percent
max-width none | length | percent
min-height length | percent
min-width length | percent
opacity number
orphans integer
overflow visible | hidden
overflow-wrap normal | break-word
padding [ length | percent ] {1..4}
padding-bottom length | percent
padding-left length | percent
padding-right length | percent
padding-top length | percent
page auto | name
page-break-after auto | always | avoid | left | right
page-break-before auto | always | avoid | left | right
page-break-inside auto | avoid
position static | relative | absolute | fixed | running( name )
prince-background-image-resolution* dpi | normal | auto [ , normal | dpi ]?
prince-bleed* auto | [ length ] {1..4}
prince-bookmark-label* none | content
prince-bookmark-level* none | integer
prince-bookmark-state* open | closed
prince-bookmark-target* self | url( target-url ) | attr( target-attr )
prince-caption-page* first | following | all
prince-fallback-cmyk-profile* url( filename )
prince-filter-resolution* dpi
prince-flow* normal | static( name, [ start | current ]? )
prince-footnote-policy* auto | keep-with-line | keep-with-block
prince-forced-breaks* short | full
prince-hyphenate-patterns* none | url( patterns-url )
prince-hyphenate-after* integer
prince-hyphenate-before* integer
prince-hyphenate-character* auto | "string"
prince-hyphenate-lines* no-limit | integer
prince-image-resolution* dpi | normal | auto [ , normal | dpi ]?
prince-image-magic* none | snap-to-integer-coords | ignore-icc-profile | jpeg-verbatim | convert-to-jpeg( percent ) | recompress-jpeg( percent )
prince-linebreak-magic* none | auto
prince-link* none | url( target-url ) | attr( target-attr )
prince-mark-length* length
prince-mark-offset* auto | [ length ] {1..4}
prince-mark-width* width
prince-page-group* start | auto
prince-pdf-color-conversion* none | full
prince-pdf-color-options* auto | use-true-black | use-rich-black
prince-pdf-destination* none | "name" | attr( attr )
prince-pdf-duplex* auto | simplex | duplex-flip-short-edge | duplex-flip-long-edge
prince-pdf-link-type* auto | web | file
prince-pdf-open-action* none | print | command( ident )
prince-pdf-output-intent* auto | url( filename )
prince-pdf-page-colorspace* auto | none | rgb | cmyk | gray
prince-pdf-page-label* auto | content
prince-pdf-page-layout* auto | single-page | one-column | two-column | two-column-left | two-column-right
prince-pdf-page-mode* auto | show-attachments | show-bookmarks | fullscreen
prince-pdf-paper-tray* auto | pick-tray-by-pdf-size
prince-pdf-print-scaling* auto | none
prince-pdf-profile* none | "Profile"
prince-pdf-script* "JavaScript"
prince-pdf-xmp* url( filename )
prince-rotate-body* portrait | landscape | angle
prince-shrink-to-fit* none | auto
prince-text-justify* auto | prince-cjk
prince-text-replace* none | [ "search" "replace" ]+
prince-tooltip* transparent | none | normal | flow( name, page-policy? ) | [ "string" | url( filename ) | counter( name, counter-style?, page-policy? ) | counters( name, "separator", counter-style?, page-policy? ) | target-counter( url, counter, counter-style? ) | target-counters( url, counter, "separator", counter-style? ) | target-content( url ) | leader( "..." | dotted | solid | space ) | string( ident, page-policy? ) | content(  ) | prince-base-url(  ) | prince-script( ident, content? ) | element( name ) ]+
prince-trim* auto | [ length ] {1..4}
prince-wrap-inside* auto | phrase | avoid
right auto | length | percent
size paper-size | length length [ landscape | portrait ]?
src [ url( filename ) [ format( [ "format" ]+ ) ]? | local( name ) | prince-lookup( name ) ]+
stop-color color
stop-opacity number
string-set none | [ ident content ]+
stroke none | color | url( paint-server )
stroke-dasharray none | [ length | percent ]+
stroke-dashoffset length | percent
stroke-linecap butt | round | square
stroke-linejoin miter | round | bevel
stroke-miterlimit number
stroke-opacity number
stroke-width length | percent | length
table-baseline number
table-column-span number | attr( colspan )
table-layout auto | fixed
table-row-span number | attr( rowspan )
text-align left | right | inside | outside | center | justify
text-align-last left | right | inside | outside | center | justify
text-anchor start | middle | end
text-decoration none || underline || overline || line-through
text-indent length hanging?
text-line-through color || text-line-through-style
text-line-through-color color
text-line-through-style none | solid | dashed | dotted
text-overflow clip | ellipsis
text-overline color || text-overline-style
text-overline-color color
text-overline-style none | solid | dashed | dotted
text-transform none | lowercase | uppercase | capitalize
text-underline color || text-underline-style
text-underline-color color
text-underline-style none | solid | dashed | dotted
top auto | length | percent
transform none | [ rotate( angle ) | translate( offset, offset? ) | translatex( offset ) | translatey( offset ) | translate3d( offset, offset, offset ) | scale( number, number? ) | scalex( number ) | scaley( number ) | skewx( angle ) | skewy( angle ) ]+
transform-origin [ center | left | right | top | bottom | percent | length ] {1..2}
unicode-bidi normal | embed | bidi-override
unicode-range urange+
vertical-align baseline | sub | super | top | text-top | middle | bottom | text-bottom | length | percent
visibility visible | hidden
white-space normal | pre | pre-wrap | pre-line | nowrap
widows integer
width auto | length | percent
word-break normal | keep-all | break-all
word-spacing normal | length
writing-mode horizontal-tb | vertical-rl
z-index auto | number
Copyright © 2002 – 2019 YesLogic Pty. Ltd.