close Warning: Can't synchronize with repository "(default)" (The repository directory has changed, you should resynchronize the repository with: trac-admin $ENV repository resync '(default)'). Look in the Trac log for more information.

Changes between Version 5 and Version 6 of WikiHtml


Ignore:
Timestamp:
2021-07-11T14:17:48-07:00 (3 years ago)
Author:
trac
Comment:

--

Legend:

Unmodified
Added
Removed
Modified
  • WikiHtml

    v5 v6  
    11= Using HTML in Wiki Text
    22
    3 Trac supports the display of HTML in any wiki context, by using the `#!html` [wiki:WikiProcessors WikiProcessor]. 
     3Trac supports the display of HTML in any wiki context, by using the `#!html` [wiki:WikiProcessors WikiProcessor].
    44
    55However, this HTML has to be [https://en.wikipedia.org/wiki/Well-formed_element well-formed].
    6 In particular, you can't insert a start tag in an `#!html` block, resume normal wiki text and insert the corresponding end tag in a second `#!html` block. 
     6In particular, you can't insert a start tag in an `#!html` block, resume normal wiki text and insert the corresponding end tag in a second `#!html` block.
    77
    88For creating styled `<div>`s, `<span>`s  or even complex tables containing arbitrary Wiki text, there is a powerful alternative: `#!div`, `#!span` and `#!table`, `#!tr`, `#!td` and `#!th` blocks. Those Wiki processors are built-in and do not require additional packages to be installed.
     
    2525}}}
    2626
    27 Note that Trac sanitizes your HTML code before displaying it. That means that potentially dangerous constructs, such as Javascript event handlers, will be removed from the output. 
     27Note that Trac sanitizes your HTML code before displaying it. That means that potentially dangerous constructs, such as Javascript event handlers, will be removed from the output.
    2828
    2929The filtering is done by [https://genshi.edgewall.org/ Genshi] and the output will be a well-formed fragment of HTML. This means that you cannot use two HTML blocks, one for opening a <div> and another for closing it, in order to wrap arbitrary wiki text.
     
    3434{{{#!td
    3535  {{{
    36   {{{#!div class="important" 
     36  {{{#!div class="important"
    3737  **important** is a predefined class.
    3838  }}}
     
    4040  {{{
    4141  {{{#!div style="border: 1pt dotted; margin: 1em"
    42   **wikipage** is another predefined class that will 
     42  **wikipage** is another predefined class that will
    4343  be used when no class is specified.
    4444  }}}
     
    5353  {{{#!div class="wikipage compact" style="border: 1pt dotted"
    5454  Classes can be combined (here **wikipage** and **compact**)
    55   which results in this case in reduced //vertical// 
     55  which results in this case in reduced //vertical//
    5656  padding but there's still some horizontal space for coping
    5757  with headings.
     
    6868{{{#!td style="padding-left: 2em"
    6969
    70   {{{#!div class="important" 
     70  {{{#!div class="important"
    7171  **important** is a predefined class.
    7272  }}}
    7373
    7474  {{{#!div style="border: 1pt dotted; margin: 1em"
    75   **wikipage** is another predefined class that will 
     75  **wikipage** is another predefined class that will
    7676  be used when no class is specified.
    7777  }}}
     
    8484  {{{#!div class="wikipage compact" style="border: 1pt dotted"
    8585  Classes can be combined (here **wikipage** and **compact**)
    86   which results in this case in reduced //vertical// 
     86  which results in this case in reduced //vertical//
    8787  padding but there's still some horizontal space for coping
    8888  with headings.
     
    103103{{{#!td
    104104  {{{
    105   Hello 
     105  Hello
    106106  [[span(''WORLD'' (click [#anchor here]), style=color: green; font-size: 120%, id=anchor)]]!
    107107  }}}
     
    144144 Pick the style the more appropriate
    145145 to your content
    146  
     146
    147147 See WikiFormatting#Tables for details
    148148 on the pipe-based table syntax.
    149149 }}}
    150  
    151  If one needs to add some 
     150
     151 If one needs to add some
    152152 attributes to the table itself...
    153  
     153
    154154 {{{#!table style="border:none;text-align:center;margin:auto"
    155155   {{{#!tr ====================================
     
    211211}}}
    212212
    213 If one needs to add some 
     213If one needs to add some
    214214attributes to the table itself...
    215215
     
    242242}}}
    243243
    244 Note that by default tables are assigned the "wiki" CSS class, which gives a distinctive look to the header cells and a default border to the table and cells, as can be seen for the tables on this page. By removing this class (`#!table class=""`), one regains complete control on the table presentation. In particular, neither the table nor the rows nor the cells will have a border, so this is a more effective way to get such an effect rather than having to specify a `style="border: no"` parameter everywhere. 
     244Note that by default tables are assigned the "wiki" CSS class, which gives a distinctive look to the header cells and a default border to the table and cells, as can be seen for the tables on this page. By removing this class (`#!table class=""`), one regains complete control on the table presentation. In particular, neither the table nor the rows nor the cells will have a border, so this is a more effective way to get such an effect rather than having to specify a `style="border: no"` parameter everywhere.
    245245
    246246{{{#!table class=""