blob: 648f6cd3d61c354147958d0785f9951a1a537fa5 (
plain)
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
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
|
<html>
<head>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=windows-1252">
<link rel=StyleSheet href="style.css" type="text/css">
<META NAME="keywords" CONTENT="JPEG Metadata Application Segments APP0 APP1 APP2 APP3 APP12 APP13 APP14 EXIF DCF XMP RDF Photoshop IRB IPTC DCMI JFIF">
<title>The PHP Metadata Toolkit - Documentation</title>
</head>
<body>
<div class="headerbar">
<H1 align="center" style="padding:15">The PHP JPEG Metadata Toolkit - Documentation</H1>
</div>
<a href="index.html">Go to Documentation - Home</a>
<div class="maintext">
<h2>Customising the HTML look via style sheets</h2>
<p>
<a href="css_terms.html#class_list">Below</a> is a list of style classes which have been used in the HTML for the PHP JPEG Metadata Toolkit.
These allow the look of the output HTML to be changed via the use of cascading style sheets.
</p>
<p>There are two ways to do this:</p>
<ol>
<li>Embedded Style sheets</li>
<li>External Style sheets</li>
</ol>
<h3>Examples</h3>
<p> Both of the following two sections would cause the following visual effects:<p>
<ul>
<li>The page will have a dark grey background colour (#505050)</li>
<li>The default text colour for the page will be off-white (#F0F0F0)</li>
<li>Links (Anchors) will be orange</li>
<li>Main headings for the EXIF section will be red</li>
<li>Secondary headings for the EXIF section will be orange</li>
<li>The outer border of the Tables for the EXIF section will be a thin dark yellow (#909000) solid line</li>
</ul>
<br>
<br>
<br>
<h4>Embedded Style Sheets</h4>
<p>Include the following in the <HEAD> section of the HTML page:</p>
<pre style="color:brown">
<META HTTP-EQUIV="Content-Style-Type" CONTENT="text/css">
<STYLE TYPE="text/css" MEDIA="screen, print, projection">
<!--
BODY { background-color:#505050; color:#F0F0F0 }
a { color:orange }
.EXIF_Main_Heading { color:red }
.EXIF_Secondary_Heading{ color: orange}
.EXIF_Table { border-collapse: collapse ; border: 1px solid #909000}
-->
</STYLE>
</pre>
<h4>External Style Sheets</h4>
<p>Include the following in the <HEAD> section of the HTML page:</p>
<pre style="color:brown">
<link rel=StyleSheet href="style.css" type="text/css">
</pre>
<p>Create an external file called "style.css" containing the following:</p>
<pre style="color:brown">
BODY { background-color:#505050; color:#F0F0F0 }
a { color:orange }
.EXIF_Main_Heading { color:red }
.EXIF_Secondary_Heading{ color: orange}
.EXIF_Table { border-collapse: collapse ; border: 1px solid #909000}
</pre>
<br>
<br>
<a name="class_list"><h3>Cascading Style Sheets Class List</h3></a>
<p>Any of the following classes may be used to customise the look of the html output from the PHP JPEG Metadata Toolkit</p>
<ul>
<li>JPEG_Intrinsic_Main_Heading</li>
<li>JPEG_Intrinsic_Table</li>
<li>JPEG_Intrinsic_Table_Row</li>
<li>JPEG_Intrinsic_Caption_Cell</li>
<li>JPEG_Intrinsic_Value_Cell</li>
</ul>
<ul>
<li>JPEG_APP_Segments_Main_Heading</li>
<li>JPEG_APP_Segments_Table</li>
<li>JPEG_APP_Segments_Table_Row</li>
<li>JPEG_APP_Segments_Caption_Cell</li>
<li>JPEG_APP_Segments_Type_Cell</li>
<li>JPEG_APP_Segments_Size_Cell</li>
</ul>
<ul>
<li>XMP_Main_Heading</li>
<li>XMP_Secondary_Heading</li>
<li>XMP_Table</li>
<li>XMP_Table_Row</li>
<li>XMP_Caption_Cell</li>
<li>XMP_Value_Cell</li>
</ul>
<ul>
<li>JFIF_Main_Heading</li>
<li>JFIF_Table</li>
<li>JFIF_Table_Row</li>
<li>JFIF_Caption_Cell</li>
<li>JFIF_Value_Cell</li>
<li>JFIF_Thumbnail</li>
</ul>
<ul>
<li>JFXX_Main_Heading</li>
<li>JFXX_Text</li>
<li>JFXX_Thumbnail</li>
<li>JFXX_Thumbnail_Link</li>
</ul>
<ul>
<li>JPEG_Comment_Main_Heading</li>
<li>JPEG_Comment_Text</li>
</ul>
<ul>
<li>Picture_Info_Main_Heading</li>
<li>Picture_Info_Caption_Text</li>
<li>Picture_Info_Value_Text</li>
</ul>
<ul>
<li>Photoshop_Main_Heading</li>
<li>Photoshop_Table</li>
<li>Photoshop_Table_Row</li>
<li>Photoshop_Caption_Cell</li>
<li>Photoshop_Value_Cell</li>
<li>Photoshop_Thumbnail</li>
<li>Photoshop_Thumbnail_Link</li>
</ul>
<ul>
<li>IPTC_Main_Heading</li>
<li>IPTC_Table</li>
<li>IPTC_Table_Row</li>
<li>IPTC_Caption_Cell</li>
<li>IPTC_Value_Cell</li>
</ul>
<ul>
<li>EXIF_Main_Heading</li>
<li>EXIF_Secondary_Heading</li>
<li>EXIF_Table</li>
<li>EXIF_Table_Row</li>
<li>EXIF_Caption_Cell</li>
<li>EXIF_Value_Cell</li>
<li>EXIF_First_IFD_Thumb</li>
<li>EXIF_First_IFD_Thumb_Link</li>
<li>EXIF_Minolta_Thumb</li>
<li>EXIF_Minolta_Thumb_Link</li>
<li>EXIF_Casio_Thumb</li>
<li>EXIF_Casio_Thumb_Link</li>
<li>EXIF_Makernote_Small_Heading</li>
<li>EXIF_Makernote_Text</li>
</ul>
<br>
<br>
</div>
</body>
</html>
|
