aboutsummaryrefslogtreecommitdiffhomepage
path: root/inc/3rdparty/libraries/mpdf/examples/example03_backgrounds_and_borders.php
diff options
context:
space:
mode:
Diffstat (limited to 'inc/3rdparty/libraries/mpdf/examples/example03_backgrounds_and_borders.php')
-rw-r--r--inc/3rdparty/libraries/mpdf/examples/example03_backgrounds_and_borders.php138
1 files changed, 0 insertions, 138 deletions
diff --git a/inc/3rdparty/libraries/mpdf/examples/example03_backgrounds_and_borders.php b/inc/3rdparty/libraries/mpdf/examples/example03_backgrounds_and_borders.php
deleted file mode 100644
index ca137027..00000000
--- a/inc/3rdparty/libraries/mpdf/examples/example03_backgrounds_and_borders.php
+++ /dev/null
@@ -1,138 +0,0 @@
1<?php
2
3$html = '
4<style>
5.gradient {
6 border:0.1mm solid #220044;
7 background-color: #f0f2ff;
8 background-gradient: linear #c7cdde #f0f2ff 0 1 0 0.5;
9}
10.radialgradient {
11 border:0.1mm solid #220044;
12 background-color: #f0f2ff;
13 background-gradient: radial #00FFFF #FFFF00 0.5 0.5 0.5 0.5 0.65;
14 margin: auto;
15}
16.rounded {
17 border:0.1mm solid #220044;
18 background-color: #f0f2ff;
19 background-gradient: linear #c7cdde #f0f2ff 0 1 0 0.5;
20 border-radius: 2mm;
21 background-clip: border-box;
22}
23h4 {
24 font-family: sans;
25 font-weight: bold;
26 margin-top: 1em;
27 margin-bottom: 0.5em;
28}
29div {
30 padding:1em;
31 margin-bottom: 1em;
32 text-align:justify;
33}
34.example pre {
35 background-color: #d5d5d5;
36 margin: 1em 1cm;
37 padding: 0 0.3cm;
38}
39
40pre { text-align:left }
41pre.code { font-family: monospace }
42
43</style>
44
45<body style="background-gradient: linear #88FFFF #FFFF44 0 0.5 1 0.5;">
46<h1>mPDF</h1>
47<h2>Backgrounds & Borders</h2>
48
49<div style="border:0.1mm solid #220044; padding:1em 2em; background-color:#ffffcc; ">
50<h4>Page background</h4>
51<div class="gradient">
52The background colour can be set by CSS styles on the &lt;body&gt; tag. This will set the background for the whole page. In this document, the background has been set as a gradient (see below).
53</div>
54
55<h4>Background Gradients</h4>
56<div class="gradient">
57Background can be set as a linear or radial gradient between two colours. The background has been set on this &lt;div&gt; element to a linear gradient. CSS style used here is:<br />
58<span style="font-family: mono; font-size: 9pt;">background-gradient: linear #c7cdde #f0f2ff 0 1 0 0.5;</span><br />
59The four numbers are coordinates in the form (x1, y1, x2, y2) which defines the gradient vector. x and y are values from 0 to 1, where 1 represents the height or width of the box as it is printed.
60<br />
61<br />
62Background gradients can be set on all block elements e.g. P, DIV, H1-H6, as well as on BODY.
63</div>
64<div class="radialgradient">
65The background has been set on this &lt;div&gt; element to a radial gradient. CSS style used here is:<br />
66<span style="font-family: mono; font-size: 9pt;">background-gradient: radial #00FFFF #FFFF00 0.5 0.5 0.5 0.5 0.65;</span><br />
67The five numbers are coordinates in the form (x1, y1, x2, y2, r) where (x1, y1) is the starting point of the gradient with color1,
68(x2, y2) is the center of the circle with color2, and r is the radius of the circle.
69(x1, y1) should be inside the circle, otherwise some areas will not be defined.
70<br />
71<br />
72Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec mattis lacus ac purus feugiat semper. Donec aliquet nunc odio, vitae pellentesque diam. Pellentesque sed velit lacus. Duis quis dui quis sem consectetur sollicitudin. Cras dolor quam, dapibus et pretium sit amet, elementum vel arcu. Duis rhoncus facilisis erat nec mattis. In hac habitasse platea dictumst. Vivamus hendrerit sem in justo aliquet a pellentesque lorem scelerisque. Suspendisse a augue sed urna rhoncus elementum. Aliquam erat volutpat.
73</div>
74
75<h4>Background Images</h4>
76<div style="border:0.1mm solid #880000; background: transparent url(bg.jpg) repeat fixed right top; background-color:#ccffff; ">
77The CSS properties background-image, background-position, and background-repeat are supported as defined in CSS2, as well as the shorthand form "background".
78<br />
79The background has been set on this &lt;div&gt; element to:<br />
80<span style="font-family: mono; font-size: 9pt;">background: transparent url(\'bg.jpg\') repeat fixed right top;</span><br />
81Background gradients can be set on all block elements e.g. P, DIV, H1-H6, as well as on BODY.
82</div>
83
84<h4>Rounded Borders</h4>
85<div class="rounded">
86Rounded corners to borders can be added using border-radius as defined in the draft spec. of <a href="http://www.w3.org/TR/2008/WD-css3-background-20080910/#layering">CSS3</a>. <br />
87
88The two length values of the border-*-radius properties define the radii of a quarter ellipse that defines the shape of the corner of the outer border edge.
89The first value is the horizontal radius. <br />
90<span style="font-family: mono; font-size: 9pt;">border-top-left-radius: 55pt 25pt;</span> 55pt is radius of curve from top end of left border starting to go round to the top.<br />
91
92If the second length is omitted it is equal to the first (and the corner is thus a quarter circle). If either length is zero, the corner is square, not rounded.<br />
93
94The border-radius shorthand sets all four border-*-radius properties. If values are given before and after a slash, then the values before the slash set the horizontal radius and the values after the slash set the vertical radius. If there is no slash, then the values set both radii equally. The four values for each radii are given in the order top-left, top-right, bottom-right, bottom-left. If bottom-left is omitted it is the same as top-right. If bottom-right is omitted it is the same as top-left. If top-right is omitted it is the same as top-left.
95</div>
96<div class="rounded">
97<span style="font-family: mono; font-size: 9pt;">border-radius: 4em;</span><br />
98
99would be equivalent to<br />
100
101<span style="font-family: mono; font-size: 9pt;">border-top-left-radius: 4em;<br />
102border-top-right-radius: 4em;<br />
103border-bottom-right-radius: 4em;<br />
104border-bottom-left-radius: 4em;</span><br />
105<br />
106and<br />
107<span style="font-family: mono; font-size: 9pt;">border-radius: 2em 1em 4em / 0.5em 3em;</span><br />
108would be equivalent to<br />
109<span style="font-family: mono; font-size: 9pt;">border-top-left-radius: 2em 0.5em;<br />
110border-top-right-radius: 1em 3em;<br />
111border-bottom-right-radius: 4em 0.5em;<br />
112border-bottom-left-radius: 1em 3em;</span>
113</div>
114
115</div>
116';
117
118//==============================================================
119//==============================================================
120//==============================================================
121include("../mpdf.php");
122
123$mpdf=new mPDF();
124
125$mpdf->SetDisplayMode('fullpage');
126
127$mpdf->WriteHTML($html);
128
129$mpdf->Output();
130
131exit;
132
133//==============================================================
134//==============================================================
135//==============================================================
136
137
138?> \ No newline at end of file