Wikisumber

Templat:Table style

[sunting] [versi terdahulu] [hapus singgahan] Ikon dokumentasi Dokumentasi templat
Nama lain/
nama pendek:
{{ts}}

Usage

sunting
  • This template allows shorthand table styling parameters. It supports up to 10 CSS style commands (e.g. "text-align:right;"), each bound to a shorthand code.
  • If you want to add a shorthand entry, add it to {{table style/parse}}.
  • Natural language codes that are not in the list of below, can be used in addition, or in combination with the shorthand codes. Natural language codes need to be terminated with the semicolon (;), while shorthand codes include the semicolon (;).
  • Units are px, em, %, but they are not part of the code. Consider the units in context.

Suggested codes

sunting
  • Suggested shorthand codes, indicated with yellow background do not exist.
  • The new shorthand codes (added on 2019-09-03) are additions and not replacements. Both codes are valid.
  • The digits in the suggested codes were padded with 0 for uniformity.

List of parameters

sunting
  • The suggested shorthand codes don't exist.
  • They would be additions and all codes both codes are valid.
  • These suggested shorthand codes were padded uniformity.
  • Shorthand codes may use use px, em, %, but these not indicated in the code.
natural
language code 		original
shorthand 		additional
shorthand 		table row cell notes
background-color: transparent; bgt bgt y ? y "border: none" doesn't work on many browsers, use "transparent" instead

border: 1px dotted black; ba. ba1. y n y
border: 1px solid black; ba ba01 y n y
border: 2px solid black; ba2 ba02 y n y
border: 3px solid black; ba3 ba03 y n y
border: 4px double black; bad ba04d y n y

border-bottom: 1px dotted black; bb. bb01. y n y
border-bottom: 2px dotted black; bb2. bb02. y n y
border-bottom: 1px solid black; bb bb01. y n y
border-bottom: 1px solid transparent; bbt1 bb01t y ? y "border: none" doesn't work on many browsers, use "transparent" instead
border-bottom: 2px solid black; bb2 bb02 y n y
border-bottom: 3px solid black; bb3 bb03 y n y
border-bottom: 4px double black; bbd bb04d y n y

border-collapse: collapse; bc bc n y n

border-left: 1px dotted black; bl. bl01. y n y
border-left: 1px solid black; bl bl01x y n y
border-left: 1px solid transparent; blt1 bl1t y ? y "border: none" doesn't work on many browsers, use "transparent" instead
border-left: 2px solid black; bl2 bl2 y n y
border-left: 3px solid black; bl3 bl3 y n y
border-left: 4px double black; bld bl4 y n y

border-right: 1px dotted black; br. br01. y n y
border-right: 2px dotted black; br2. br02. y n y
border-right: 1px solid black; br br01 y n y
border-right: 1px solid transparent; brt1 br01t y ? y "border: none" doesn't work in many browsers, use "transparent" instead
border-right: 2px solid black; br2 br02 y n y
border-right: 3px solid black; br3 br03 y n y
border-right: 4px double black; brd br04d y n y

border-top: 1px dotted black; bt. bt01. y n y
border-top: 1px solid black; bt bt01 y n y
border-top: 1px solid transparent; btt1 bt1t y ? y "border: none" doesn't work on many browsers, use "transparent" instead
border-top: 2px solid black; bt2 bt02 y n y
border-top: 3px solid black; bt3 bt03 y n y
border-top: 4px double black; btd bt04d y n y

direction: rtl; rtl rtl ? ? y

float: left; fll fll y n n <div> based, breaks text flow.
float: right; flr flr y n n <div> based, breaks text flow.

font-family: sans-serif; ffn ffn y y y sans serif
font-family: serif; ffs ffs y y y serif

font-size: 58%; xxs fs058 y y y
font-size: 69%; xs fs069 y y y
font-size: 80%; sm80 fs080 y y y
font-size: 83%; sm fs083 y y y
font-size: 85%; sm85 fs085 y y y
font-size: 90%; sm90 fs090 y y y
font-size: 92%; sm92 fs092 y y y equivalent to {{fine}}
font-size: 95%; sm95 fs095 y y y
font-size: 105%; fs105 fs105 y y y
font-size: 110%; fs110 fs110 y y y sm110 also supported
font-size: 120%; lg fs120 y y y
font-size: 144%; xl fs144 y y y
font-size: 182%; xxl fs182 y y y
font-size: 207%; 3xl fs207 y y y
font-size: 249%; 4xl fs249 y y y
font-size: 260%; fs260 y y y
font-size: 280% fs280 y y y
font-size: 300% fs300 y y y

font-style: italic; fsi fsi y y y
font-style: normal; fsn fsn y y y

font-weight: bold; fwb fwb y y y equivalent to font-weight:700 [1]
font-weight: normal; fwn fwn y y y equivalent to font-weight:400 [2]

line-height: 90% lh9 lh090 y y y
line-height: 95% lh95 lh095 y y y
line-height: 100% lh10 lh100 y y y
line-height: 110% lh11 lh110 y y y
line-height: 120% lh12 lh120 y y y
line-height: 130% lh13 lh130 y y y
line-height: 140% lh140 y y y standard line height for Arial font-size:100%
line-height: 1.5 lh15 lh150 y y y default height multiplied by 1.5
line-height: 2.0 lh2 lh200 y y y default height multiplied by 2
line-height: 3.0 lh3 lh300 y y y default height multiplied by 3
line-height: normal lhn y y y same as line-height:initial

margin: 0 auto 0 auto; mc mc y ? y margin center
margin-right: auto; margin-left: auto; ma ma y ? ? margin auto
margin: 5px; m5 m05 y ? y
margin: 10px; ma10 m10 y ? y

margin-bottom: 5px; mb5 mb05 y ? y
margin-bottom: 10px; mb10 mb10 y ? y

margin-left: 5px; ml5 ml05 y ? y
margin-left: 10px; ml10 ml10 y ? y

margin-right: 5px; mr5 mr05 y ? y
margin-right: 10px; mr10 mr10 y ? y

margin-top: 5px; mt5 mt05 y ? y
margin-top: 10px; mt10 mt10 y ? y

padding-left: 1.0em;text-indent: -1.0em; it1 hi10 y n y 1em hanging indent
padding-left: 1.5em; text-indent: -1.0em; it1p.5 hi15.10 y n y 1.5em x 1em hanging indent
padding-left: 2.0em; text-indent: -1.0em; itp hi20.10 y n y 2em x 1em hanging indent
padding-left: 2.0em;text-indent: -2.0em; it hi20 y n y 2em hanging indent
padding-left: 2.5em; text-indent: -2.0em; itp.5 hi25.20 y n y 2.5em x 2 hanging indent
padding-left: 3.0em; text-indent: -1.0em; it1p2 hi30.10 y n y 3em x 1em hanging indent
padding-left: 4.0em;text-indent: -2.0em; it42 hi40.20 y ? y 4em x 2em hanging indent

padding-bottom: 0.5em; pb.5 pb05 y n y
padding-bottom: 1.0em; pb1 pb10 y n y
padding-bottom: 1.5em; pb15 pb15 y n y
padding-bottom: 2.0em; pb2 pb20 y n y
padding-bottom: 3.0em; pb3 pb30 y n y
padding-bottom: 4.0em; pb4 pb40 y n y
padding-bottom: 5.0em; pb5 pb50 y n y

padding-left: 0.5em; pl.5 pl05 y n y
padding-left: 1.0em; pl1 pl10 y n y
padding-left: 1.5em; pl15 pl15 y n y
padding-left: 2.0em; pl2 pl20 y n y
padding-left: 2.5em; pl2.5 pl25 y n y
padding-left: 3.0em; pl3 pl30 y n y
padding-left: 3.5em; pl3.5 pl35 y n y
padding-left: 4.0em; pl4 pl40 y n y
padding-left: 5.0em; pl5 pl50 y n y
padding-left: 6.0em; pl6 pl60 y n y
padding-left: 7.0em; pl7 pl70 y n y

padding-right: 0.5em; pr.5 pr05 y n y
padding-right: 1.0em; pr1 pr10 y n y
padding-right: 1.5em; pr15 pr15 y n y
padding-right: 2.0em; pr2 pr20 y n y
padding-right: 2.5em; pr2.5 pr25 y n y
padding-right: 3.0em; pr3 pr30 y n y
padding-right: 3.5em; pr3.5 pr35 y n y
padding-right: 4.0em; pr4 pr40 y n y
padding-right: 5.0em; pr5 pr50 y n y
padding-right: 6.0em; pr6 pr60 y n y
padding-right: 7.0em; pr7 pr70 y n y

padding-top: 0.5em; padding-bottom: 0.5em; ptb.5 ptb05 y n y used for table cell spacing above and below label
padding-top: 1em; padding-bottom: 1em; ptb1 ptb10 y n y used for table cell spacing above and below label

padding-top: 0.5em; pt.5 pt05 y n y
padding-top: 1.0em; pt1 pt10 y n y
padding-top: 1.5em; pt15 pt15 y n y
padding-top: 2.0em; pt2 pt20 y n y
padding-top: 3.0em; pt3 pt30 y n y
padding-top: 4.0em; pt4 pt40 y n y
padding-top: 5.0em; pt5 pt50 y n y
padding-top: 6.0em; pt6 pt60 y n y
padding-top: 7.0em; pt7 pt70 y n y

text-align: center; ac ac y y y
text-align: justify; aj aj y y y
text-align: left; al al y y y
text-align: right; ar ar y y y

text-decoration:line-through; tds tdl y y y
text-decoration:underline; tdu tdu y y y

text-transform: capitalize; cap cap y y y
text-transform: lowercase; lc lc y y y
text-transform: uppercase; uc uc y y y

vertical-align: baseline; vbs vbs y y y
vertical-align: bottom; vbm vbm y y y
vertical-align: middle; vmi vmi y y y
vertical-align: text-bottom; vtb vtb y y n Does not apply to table-cells[1]
vertical-align: text-top; vtt vtt n y y Does not apply to table-cells[2]
vertical-align: top; vtp vtp n y y

white-space: nowrap; wnw wnw y ? y

width: 100em; w100 w100e y n y

width: 5%; w5 w5 y n y
width: 10%; w10 w010 y n y
width: 15%; w15 w015 y n y
width: 20%; w20 w020 y n y
width: 25%; w25 w025 y n y
width: 30%; w30 w030 y n y
width: 33%; w33 w033 y n y
width: 40%; w40 w040 y n y
width: 50%; w50 w050 y n y
width: 60%; w60 w060 y n y
width: 67%; w67 w067 y n y
width: 70%; w70 w070 y n y
width: 75%; w75 w075 y n y
width: 80%; w80 w080 y n y
width: 90%; w90 w090 y n y
width: 500px; w500 y n y
width: 100%; wa w100 y n y
  1. ↑ https://www.w3schools.com/csSref/pr_font_weight.asp
  2. ↑ https://www.w3schools.com/csSref/pr_font_weight.asp

Examples

sunting

{{ts|ar|ba|sc}} produces style="text-align:right; border:1px solid black; font-variant:small-caps;"

{{table style|ar|vtb|pr2}} produces style="text-align:right; vertical-align:top; padding-right:2.0em;"

Natural language code combined with shorthand code:

sunting

{{ts|text-align:right;|pr2}} produces style="text-align:right; padding-right:2.0em;"

Where to place the template in a table?

sunting

Either at the start of the table, or on a row break, or for an individual cell.

In the following example the templates first sets the text in all the cells to be centered ({{ts|ac}}). Then on the second row (after the heading row) all the text in the row to be left justified ({{ts|al}}), finally the third row second column (the number of years) to be right justified ({{ts|ar}}). 

{|class="wikitable" {{ts|ac}}
|-
!Location
!Number of years
!Annual average rainfall in inches
|-
|Basra|||18||6-68
|-{{ts|al}}
|Bagdad||29||6-64
|-
||Mosul||{{ts|ar}}|4||16-71
|}

Display as:

Location Number of years Annual average rainfall in inches
Basra 18 6-68
Bagdad 29 6-64
Mosul 4 16-71

en:Table_style

Diperoleh dari "https://id.wikisource.org/w/index.php?title=Templat:Table_style&oldid=78898"