Source code of tbs_us_examples_blocks.htm
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
<!DOCTYPE HTML>
<html lang="en">
<head>
<title>TinyButStrong - Example of block syntaxes</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="./tbs_us_examples_styles.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="main-body">
<h1>Example of Block Syntaxes</h1>
<div class="w3cinfo"> this TBS template is W3C compliant <a href="http://validator.w3.org/check?uri=referer"><img src="http://www.w3.org/Icons/valid-xhtml11" alt="Valid XHTML 1.1" height="31" width="88" style="border:none;" /></a> </div>
<div id="example">
<p>These examples illustrate the different available syntaxes for Merge-Blocks.</p>
<h2>Absolute Syntax</h2>
<p> The block is defined by a beginning TBS tag and an ending TBS tag.</p>
<p class="text-example2">[blk1;block=begin][blk1.val]<br />
[blk1;block=end]</p>
<h2>Relative Syntax</h2>
<p> The block is defined relatively to the HTML (or XML) tags that surround the TBS tag.
Only a single TBS tag defines the block, instead of a couple of TBS tags. </p>
<table width="300" style="border-collapse:collapse;">
<tr>
<td class="row-example01 text-example2">[blk2.val][blk2;block=tr]</td>
</tr>
</table>
<h2>Simplified Syntax</h2>
<p> The bloc definition is included inside a TBS field. It's much more simple to write.</p>
<table width="300" style="border-collapse:collapse;">
<tr>
<td class="row-example01 text-example2">[blk3.val;block=tr]</td>
</tr>
</table>
<h2>On a text line</h2>
<p>Use the symbol "_" to define a block on a simple text line, independently of HTML tags.</p>
<pre class="text-example2">
[blk4.val;block=_]
</pre>
<h2>With concatenation</h2>
<p>It's possible to define a block on several following HTML tags.
For this, you just have to indicate the tags to concatenate by separating them with "+".
In the example below, the block is bounded by two rows.</p>
<table width="300" style="border-collapse:collapse;">
<tr>
<td rowspan="2" class="row-example01 text-example2" style="background-color:#C4D9FF;"> </td>
<td class="row-example01 text-example2">[blk5.val;block=tr+tr]</td>
</tr>
<tr>
<td align="right" class="row-example01 text-example2">[blk5.val]</td>
</tr>
</table>
<h2>With encapsulation</h2>
<p>It's possible to define a block on an HTML tag of a higher level.
For this, you just have to set the encapsulation level using parentheses.
In the example below, the block is bounded by the pink row.</p>
<table width="300" cellpadding="4" style="border-collapse:collapse;">
<tr>
<td class="row-example02"><table width="300" style="border-collapse:collapse;">
<tr>
<td class="row-example01 text-example2">[blk6.val;block=((tr))]</td>
</tr>
</table></td>
</tr>
</table>
<h2>Without Block Definition</h2>
<p>If the block definition is omitted, then only the first record is merged.</p>
<p>Example: <span class="text-example2">[blk7.val]</span></p>
</div>
</div>
</body>
</html>