version=pmwiki-2.1.26 ordered=1 urlencoded=1
agent=Mozilla/4.0 (compatible; MSIE 7.0; Windows NT 5.1; .NET CLR 1.1.4322; .NET CLR 2.0.50727)
author=Roman
csum=added tip
host=81.30.250.172
name=PmWiki.WikiStyles
post= Save
rev=127
targets=PmWiki.WikiStyles,PmWiki.WikiWord,PmWiki.GroupHeaders,PmWiki.WikiAdministrator,PmWiki.LocalCustomizations,PmWiki.CustomWikiStyles,PmWiki.WikiStyleExamples,PmWiki.DocumentationIndex
text=%25audience%25 authors (basic)%0a!! Wikistyle basics%0a%0a[[WikiStyles]] allow authors to modify the color and other styling attributes of a page's contents.  A wikistyle is written using percent-signs, as in [@%25red%25@] or [@%25bgcolor=blue%25@].%0a%0aThe most basic use of wikistyles is to change text attributes such as color, background color, and font.  PmWiki defines several wikistyles for changing the text color to [=%25black%25, %25white%25, %25red%25, %25yellow%25, %25blue%25, %25gray%25, %25silver%25, %25maroon%25, %25green%25, %25navy%25, and %25purple%25=].%0a%0a(:markup:) [=%0aThe basket contains %25red%25 apples, %25blue%25 blueberries, %25purple%25 eggplant, %25green%25 limes, %25%25 and more.%0a=]%0a%0aFor colors other than the predefined colors, use the [@%25color=...%25@] wikistyle.  (Note: RGB colors (#rrggbb) should always be specified with lowercase letters to avoid [[WikiWord]] conflicts.)%0a%0a(:markup:) [=%0aI'd like to have some %25color=#ff7f00%25 tangerines%25%25,  too!%0a=]%0a%0aTo change the background color, use [@%25bgcolor=...%25@] as a wikistyle:%0a%0a(:markup:) [=%0aThis sentence contains %25bgcolor=green yellow%25 yellow text on a green background. =]%0a%0aSee [[PmWiki:WikiStyleColors]] for more color help.%0a%0a!! Scopes%0a%0aWikistyles can also specify a ''scope''; with no scope, the style is applied to any text that follows up to the next wikistyle specification or the end of the paragraph, whichever comes first.  Including a scope changes the specification to apply to the whole paragraph ([@%25p ...%25@]), an entire list ([@%25list ...%25@]), an item within a list ([@%25item ...%25@]), or any block ([@%25block ...%25@]).  Those scopes are predefined shortcuts for the "apply=" attribute, which is discussed  [[#apply_to_blocks|below]].%0a%0a(:markup:) [=%0a%25p bgcolor=#ffeeee%25 The wikistyle specification at the beginning of this line applies to the entire paragraph, even if there are %25blue%25 other wikistyle specifications %25%25 in the middle of the paragraph.%0a=]%0a%0aThe [@>>style%3c%3c@] block can be used to apply a wikistyle to a large block of items.  The style is applied until the next [@>>%3c%3c@] is encountered.%0a%0a(:markup:) [=%0a>>blue font-style=italic bgcolor=#ffffcc%3c%3c%0aEverything after the above line is styled with blue italic text,%0a%0aThis includes%0a    preformatted text%0a* lists%0a-> indented items%0a>>%3c%3c%0a=]%0a%0a!! Wikistyle attributes%0a%0aThe style attributes recognized within a wikistyle specification are:%0a%0a    ------------ CSS -------------          --HTML--%0a    color               bgcolor             class %0a    background-color    margin              id%0a    text-align          padding             hspace%0a    text-decoration     border              vspace%0a    font-size           float               target%0a    font-family         list-style          rel%0a    font-weight         width*              accesskey%0a    font-style          height*             value%0a    display%0a%0a    Special: define, apply%0a%0aThe attributes in the first two columns correspond to the ''[[cascading style sheet -> http://www.blooberry.com/indexdot/css/propindex/all.htm]]'' (CSS) properties of the same name.  The attributes in the last column apply only to specific items:%0a%0a* [@class=@] and [@id=@] assign a CSS class or identifier to an HTML element%0a* [@target=name@] opens links that follow in a browser window called "name"%0a* [@rel=name@] in a link identifies the relationship of a target page%0a* [@accesskey=x@] uses 'x' as a shortcut key for the link that follows%0a* [@value=9@] sets the number of the current ordered list item%0a%0a[=*=] The width and height attributes have asterisks because they are handled specially for %3cimg .../> tags.  If used by themselves (i.e., without anything providing an "apply=" parameter to the wikistyle), then they set the 'width=' and 'height=' attributes of any %3cimg ... /> tags that follow. Otherwise, they set the 'width:' and 'height:' properties of the element being styled.%0a%0a%0a!! Applying wikistyles to blocks [[#apply_to_blocks]]%0a%0aNormally a wikistyle applies to a span of (inline) text, but%0athe apply= attribute allows a style to be applied to something%0aelse.  The predefined apply= values are:%0a%0a||border=1 cellpadding=3 cellspacing=0%0a||apply=img ||apply the style to any image that follows|| ||%0a||apply=p ||apply the style to the current paragraph||* ||%0a||apply=pre ||apply the style to the current preformatted text|| ||%0a||apply=list ||apply the style to the current list||* ||%0a||apply=item ||apply the style to the current list item||* ||%0a||apply=div ||apply the style to the current div|| ||%0a||apply=block ||apply the style to the current block,\\%0awhether it's a paragraph, list, list item,\\%0aheading, or division.||* ||%0a%0aThe starred items also have wikistyle shortcuts already defined,%0athus [@%25p color=blue%25@] is the same as [@%25apply=p color=blue%25@], and%0a[@%25list ROMAN%25@] is the same as [@%25apply=list list-style=upper-roman%25@].%0a%0aSome wikistyle shortcuts also make use of apply, thus [@%25right%25@]%0ais a shortcut for [@%25text-align=right apply=block%25@].%0a%0aAn applied wikistyle will only take effect if it's on the%0aline that starts the thing it's supposed to modify.  In other%0awords, a wikistyle in the third markup line of a paragraph%0acan't change the attributes of the paragraph:%0a%0a(:markup:) [=%0ahere is some text in%0aa paragraph and if%0awe try to %25apply=p color=blue%25 change%0athe color of the paragraph in the middle%0ait won't work because the style comes%0aafter the paragraph has already been started.=]%0a%0a(:markup:) [=%0aHowever, this %25p color=red%25 paragraph%0a''will'' be in red because its block style does%0aoccur in the first line of its text.=]%0a%0a(:markup:) [=%0a* Here's a list item%0a* %25list red%25 Oops, too late to affect the list!=]%0a%0a%0a!! Enabling Styles%0aStyles not listed above can be enabled by a PMWiki Adminstrator by modifying the local/config.php file.  For instance to enable the "line-height" style attribute add the line %0a%0a    $WikiStyleCSS[] = 'line-height';%0a%0ato the local/config.php file.%0a%0a!! Custom style shortcuts%0a%0aThe [@define=@] attribute can be used to assign a shorthand name to any wikistyle specification.  This shorthand name can then be reused in later wikistyle specifications.%0a%0a(:markup:) [=%0a%25define=box block bgcolor=#ddddff border="2px dotted blue"%25%0a%0a%25box%25 [@%0a$ echo "Hello world"%0aHello World%0a$ exit%0a@]%0a%0a%25box font-weight=bold color=green%25 [@%0a$ echo "I said, HELLO"%0a@]=]%0a%0a'''Tip:'''  It's often a good idea to put common style definitions into [[Group Header(s)]] pages so that they can be shared among multiple pages in a group.  Or, the [[wiki administrator]] can predefine styles site-wide as a [[local customization(s)]] (see [[CustomWikiStyles]]).%0a%0a'''Tip:''' Use custom style definitions to associate meanings with text instead of just colors.  For example, if warnings are to be displayed as green text, set [@%25define=warn green%25@] and then use [@%25warn%25@] instead of [@%25green%25@] in the document.  Then, if you later decide that warnings should be styled differently, it's much easier to change the (one) definition than many occurrences of [@%25green%25@] in the text.%0a%0a'''Tip:''' Any undefined WikiStyle is automatically treated as a request for a class, thus [@%25pre%25@] is the same as saying [@%25class=pre%25@].%0a%0a!![[#predefined]] Predefined style shortcuts%0a%0aPmWiki defines a number of style shortcuts.%0a%0a* Text colors: black, white, red, yellow, blue, gray, silver, maroon, green, navy, purple  (shortcut for [@%25color=...%25@])%0a* Justification: [@%25center%25@] and [@%25right%25@]%0a* Images and boxes%0a** Floating left or right: [@%25rfloat%25@] and [@%25lfloat%25@]%0a** Framed items: [@%25frame%25@], [@%25rframe%25@], and [@%25lframe%25@]%0a** Thumbnail sizing: [@%25thumb%25@]%0a* Open link in new window: [@%25newwin%25@]  (shortcut for [@%25target=_blank%25@])%0a* Comments: [@%25comment%25@] (shortcut for [@%25display=none%25@])%0a* Ordered lists: [@%25decimal%25@], [@%25roman%25@], [@%25ROMAN%25@], [@%25alpha%25@], [@%25ALPHA%25@] (see also Cookbook:OutlineLists)%0a%0a!! Examples%0a%0a[[WikiStyleExamples]] contains a number of examples of ways to use wikistyles in pages.%0a%0a!! Known Issues%0a* Percents in style definitions (like: [@%25block width=50%25 %25@]) require the use of "pct" instead of "%25".%0a%0a!!See Also%0a[[PmWiki/Custom Wiki Styles]]%0a%0a%25trail%25 %3c%3c|[[Documentation Index]]|>>%0a%0a>>faq%3c%3c [[#faq]]%0a%0aQ:  Some of my colors aren't working!  For example, [@%25color=#AAAAAA%25@] works, but [@%25color=#AA3333%25@] doesn't work.  What's wrong?%0a%0aA:  Be sure to use lowercase letters for rgb hex colors, otherwise PmWiki may mistake the color value for a [[WikiWord]].%0a%0a
time=1158850552