Template:Round: Difference between revisions

From Zelda Dungeon Wiki
Jump to navigation Jump to search
Want an adless experience? Log in or Create an account.
mNo edit summary
(fixed a few typos and simplified the logic)
 
Line 1: Line 1:
{{#vardefine:pos|{{#switch:{{lc:{{{1|}}}}}
<onlyinclude>{{#switch: {{lc:{{{1|}}}}}
|#default={{{1|}}}
| #default = border-radius: {{{1|20}}}px; -moz-border-radius: {{{1|20}}}px; -webkit-border-radius: {{{1|20}}}px; -khtml-border-radius: {{{1|20}}}px; -icab-border-radius: {{{1|20}}}px; -o-border-radius: {{{1|20}}}px;
|tl=topleft
| tl | topleft | top-left | top left = border-top-left-radius: {{{2|20}}}px; -moz-border-radius-topleft: {{{2|20}}}px; -webkit-border-top-left-radius: {{{2|20}}}px; -khtml-border-top-left-radius: {{{2|20}}}px; -icab-border-top-left-radius: {{{2|20}}}px; -o-border-top-left-radius: {{{2|20}}}px;
|topleft=topleft
| t | top = border-top-left-radius: {{{2|20}}}px; -moz-border-radius-topleft: {{{2|20}}}px; -webkit-border-top-left-radius: {{{2|20}}}px; -khtml-border-top-left-radius: {{{2|20}}}px; -icab-border-top-left-radius: {{{2|20}}}px; -o-border-top-left-radius: {{{2|20}}}px; border-top-right-radius: {{{2|20}}}px; -moz-border-radius-topright: {{{2|20}}}px; -webkit-border-top-right-radius: {{{2|20}}}px; -khtml-border-top-right-radius: {{{2|20}}}px; -icab-border-top-right-radius: {{{2|20}}}px; -o-border-top-right-radius: {{{2|20}}}px;
|top-left=topleft
| tr | topright | top-right | top right = border-top-right-radius: {{{2|20}}}px; -moz-border-radius-topright: {{{2|20}}}px; -webkit-border-top-right-radius: {{{2|20}}}px; -khtml-border-top-right-radius: {{{2|20}}}px; -icab-border-top-right-radius: {{{2|20}}}px; -o-border-top-right-radius: {{{2|20}}}px;
|top left=topleft
| l | left = border-top-left-radius: {{{2|20}}}px; -moz-border-radius-topleft: {{{2|20}}}px; -webkit-border-top-left-radius: {{{2|20}}}px; -khtml-border-top-left-radius: {{{2|20}}}px; -icab-border-top-left-radius: {{{2|20}}}px; -o-border-top-left-radius: {{{2|20}}}px; border-bottom-left-radius: {{{2|20}}}px; -moz-border-radius-bottomleft: {{{2|20}}}px; -webkit-border-bottom-left-radius: {{{2|20}}}px; -khtml-border-bottom-left-radius: {{{2|20}}}px; -icab-border-bottom-left-radius: {{{2|20}}}px; -o-border-bottom-left-radius: {{{2|20}}}px;
|t=top
| n | normal = border-radius: {{{2|20}}}px; -moz-border-radius: {{{2|20}}}px; -webkit-border-radius: {{{2|20}}}px; -khtml-border-radius: {{{2|20}}}px; -icab-border-radius: {{{2|20}}}px; -o-border-radius: {{{2|20}}}px;
|top=top
| r | right = border-top-right-radius: {{{2|20}}}px; -moz-border-radius-topright: {{{2|20}}}px; -webkit-border-top-right-radius: {{{2|20}}}px; -khtml-border-top-right-radius: {{{2|20}}}px; -icab-border-top-right-radius: {{{2|20}}}px; -o-border-top-right-radius: {{{2|20}}}px; border-bottom-right-radius: {{{2|20}}}px; -moz-border-radius-bottomright: {{{2|20}}}px; -webkit-border-bottom-right-radius: {{{2|20}}}px; -khtml-border-bottom-right-radius: {{{2|20}}}px; -icab-border-bottom-right-radius: {{{2|20}}}px; -o-border-bottom-right-radius: {{{2|20}}}px;
|tr=topright
| bl | bottomleft | bottom-left | bottom left = border-bottom-left-radius: {{{2|20}}}px; -moz-border-radius-bottomleft: {{{2|20}}}px; -webkit-border-bottom-left-radius: {{{2|20}}}px; -khtml-border-bottom-left-radius: {{{2|20}}}px; -icab-border-bottom-left-radius: {{{2|20}}}px; -o-border-bottom-left-radius: {{{2|20}}}px;
|topright=topright
| b | bottom = border-bottom-left-radius: {{{2|20}}}px; -moz-border-radius-bottomleft: {{{2|20}}}px; -webkit-border-bottom-left-radius: {{{2|20}}}px; -khtml-border-bottom-left-radius: {{{2|20}}}px; -icab-border-bottom-left-radius: {{{2|20}}}px; -o-border-bottom-left-radius: {{{2|20}}}px; border-bottom-right-radius: {{{2|20}}}px; -moz-border-radius-bottomright: {{{2|20}}}px; -webkit-border-bottom-right-radius: {{{2|20}}}px; -khtml-border-bottom-right-radius: {{{2|20}}}px; -icab-border-bottom-right-radius: {{{2|20}}}px; -o-border-bottom-right-radius: {{{2|20}}}px;
|top-right=topright
| br | bottomright | bottom-right | bottom right = border-bottom-right-radius: {{{2|20}}}px; -moz-border-radius-bottomright: {{{2|20}}}px; -webkit-border-bottom-right-radius: {{{2|20}}}px; -khtml-border-bottom-right-radius: {{{2|20}}}px; -icab-border-bottom-right-radius: {{{2|20}}}px; -o-border-bottom-right-radius: {{{2|20}}}px;
|top right=topright
}}</onlyinclude>
|l=left
|left=left
|r=right
|right=right
|bl=bottomleft
|bottomleft=bottomleft
|bottom-left=bottomleft
|bottom left=bottomleft
|b=bottom
|bottom=bottom
|br=bottomright
|bottomright=bottomright
|bottom-right=bottomright
|bottom right=bottomright
}}}}<!--  
-->{{#switch:{{#var:pos}}
|#default=border-radius: {{{1|20}}}px; -moz-border-radius: {{{1|20}}}px; -webkit-border-radius: {{{1|20}}}px; -khtml-border-radius: {{{1|20}}}px; -icab-border-radius: {{{1|20}}}px; -o-border-radius: {{{1|20}}}px
|topleft=border-top-left-radius: {{{2|20}}}px; -moz-border-radius-topleft: {{{2|20}}}px; -webkit-border-top-left-radius: {{{2|20}}}px; -khtml-border-top-left-radius: {{{2|20}}}px; -icab-border-top-left-radius: {{{2|20}}}px; -o-border-top-left-radius: {{{2|20}}}px;
|top=border-top-left-radius: {{{2|20}}}px; -moz-border-radius-topleft: {{{2|20}}}px; -webkit-border-top-left-radius: {{{2|20}}}px; -khtml-border-top-left-radius: {{{2|20}}}px; -icab-border-top-left-radius: {{{2|20}}}px; -o-border-top-left-radius: {{{2|20}}}px; border-top-right-radius: {{{2|20}}}px; -moz-border-radius-topright: {{{2|20}}}px; -webkit-border-top-right-radius: {{{2|20}}}px; -khtml-border-top-right-radius: {{{2|20}}}px; -icab-border-top-right-radius: {{{2|20}}}px; -o-border-top-right-radius: {{{2|20}}}px;
|topright=border-top-right-radius: {{{2|20}}}px; -moz-border-radius-topright: {{{2|20}}}px; -webkit-border-top-right-radius: {{{2|20}}}px; -khtml-border-top-right-radius: {{{2|20}}}px; -icab-border-top-right-radius: {{{2|20}}}px; -o-border-top-right-radius: {{{2|20}}}px;
|left=border-top-left-radius: {{{2|20}}}px; -moz-border-radius-topleft: {{{2|20}}}px; -webkit-border-top-left-radius: {{{2|20}}}px; -khtml-border-top-left-radius: {{{2|20}}}px; -icab-border-top-left-radius: {{{2|20}}}px; -o-border-top-left-radius: {{{2|20}}}px; border-bottom-left-radius: {{{2|20}}}px; -moz-border-radius-bottomleft: {{{2|20}}}px; -webkit-border-bottom-left-radius: {{{2|20}}}px; -khtml-border-bottom-left-radius: {{{2|20}}}px; -icab-border-bottom-left-radius: {{{2|20}}}px; -o-border-bottom-left-radius: {{{2|20}}}px;
|normal=border-radius: {{{2|20}}}px; -moz-border-radius: {{{2|20}}}px; -webkit-border-radius: {{{2|20}}}px; -khtml-border-radius: {{{2|20}}}px; -icab-border-radius: {{{2|20}}}px; -o-border-radius: {{{2|20}}}px
|right=border-top-right-radius: {{{2|20}}}px; -moz-border-radius-topright: {{{2|20}}}px; -webkit-border-top-right-radius: {{{2|20}}}px; -khtml-border-top-right-radius: {{{2|20}}}px; -icab-border-top-right-radius: {{{2|20}}}px; -o-border-top-right-radius: {{{2|20}}}px; border-bottom-right-radius: {{{2|20}}}px; -moz-border-radius-bottomright: {{{2|20}}}px; -webkit-border-bottom-right-radius: {{{2|20}}}px; -khtml-border-bottom-right-radius: {{{2|20}}}px; -icab-border-bottom-right-radius: {{{2|20}}}px; -o-border-bottom-right-radius: {{{2|20}}}px;
|bottomleft=border-bottom-left-radius: {{{2|20}}}px; -moz-border-radius-bottomleft: {{{2|20}}}px; -webkit-border-bottom-left-radius: {{{2|20}}}px; -khtml-border-bottom-left-radius: {{{2|20}}}px; -icab-border-bottom-left-radius: {{{2|20}}}px; -o-border-bottom-left-radius: {{{2|20}}}px;
|bottom=border-bottom-left-radius: {{{2|20}}}px; -moz-border-radius-bottomleft: {{{2|20}}}px; -webkit-border-bottom-left-radius: {{{2|20}}}px; -khtml-border-bottom-left-radius: {{{2|20}}}px; -icab-border-bottom-left-radius: {{{2|20}}}px; -o-border-bottom-left-radius: {{{2|20}}}px; border-bottom-right-radius: {{{2|20}}}px; -moz-border-radius-bottomright: {{{2|20}}}px; -webkit-border-bottom-right-radius: {{{2|20}}}px; -khtml-border-bottom-right-radius: {{{2|20}}}px; -icab-border-bottom-right-radius: {{{2|20}}}px; -o-border-bottom-right-radius: {{{2|20}}}px;
|bottomright=border-bottom-right-radius: {{{2|20}}}px; -moz-border-radius-bottomright: {{{2|20}}}px; -webkit-border-bottom-right-radius: {{{2|20}}}px; -khtml-border-bottom-right-radius: {{{2|20}}}px; -icab-border-bottom-right-radius: {{{2|20}}}px; -o-border-bottom-right-radius: {{{2|20}}}px;}}<noinclude>


==Purpose==
==Purpose==
Line 42: Line 16:


==Usage==
==Usage==
For basic usage, type: {{Desc|Optional|Radius of Rounding}}
For basic usage, type: {{Usage|Radius of Rounding}}
{{Parameter|Radius of Rounding|The amount to round the corners, in terms of pixels in pure number (no letters). A higher number results in a more extreme curve.|Optional|20}}
{{Usage/Param|Radius of Rounding|The amount to round the corners, in terms of pixels in pure number (no letters). A higher number results in a more extreme curve.|optional|20}}


This code is intended to be placed in the coding for div tags or in tables. The code can format the div tag, a whole table, or an indiviual cell. The code is expected to be used as '''<nowiki>style="{{round}}"</nowiki>''', the "style" portion is not included in the template to allow for additional style modifications.
This code is intended to be placed in the coding for div tags or in tables. The code can format the div tag, a whole table, or an indiviual cell. The code is expected to be used as '''<nowiki>style="{{Round}}"</nowiki>''', the "style" portion is not included in the template to allow for additional style modifications.


===Advanced Usage===
===Advanced Usage===
The template can be used in a more complex manner with: {{desc|Optional|Type of Rounding|Radius of Rounding}}
The template can be used in a more complex manner with: {{Usage|Type of Rounding|Radius of Rounding}}


With the available types being:
With the available types being:
Line 75: Line 49:
| align=left style="{{round|bottomright}}; padding: 5px" | '''bottomright'''
| align=left style="{{round|bottomright}}; padding: 5px" | '''bottomright'''
|}
|}
{{Cat|Formatting Templates}}
{{Cat|Formatting Templates}}
</noinclude>

Latest revision as of 22:03, October 4, 2012

border-radius: 20px; -moz-border-radius: 20px; -webkit-border-radius: 20px; -khtml-border-radius: 20px; -icab-border-radius: 20px; -o-border-radius: 20px;

Purpose

This template adds the coding to round corners in tables and boxes for all possible internet browsers.

Usage

For basic usage, type: {{Round| Radius of Rounding }}

  • Radius of Rounding — The amount to round the corners, in terms of pixels in pure number (no letters). A higher number results in a more extreme curve. (Optional. Default: 20)

This code is intended to be placed in the coding for div tags or in tables. The code can format the div tag, a whole table, or an indiviual cell. The code is expected to be used as style="{{Round}}", the "style" portion is not included in the template to allow for additional style modifications.

Advanced Usage

The template can be used in a more complex manner with: {{Round| Type of Rounding | Radius of Rounding }}

With the available types being:

  • topleft
  • top
  • topright
  • left
  • normal
  • right
  • bottomleft
  • bottomright

Example

Here is an example of how the various types look:

topleft top topright
left normal right
bottomleft bottom bottomright