Google Git
Sign in
apache / openoffice-org / bae4ea485ebbd5dfd1014f061bb06a0954836b4b / . / content / styles / old_style_guide.html
blob: 9a254ac7f3d117812360560538e87b03fcc3daef [file] [log] [blame]
<html><head>
<meta HTTP-EQUIV="content-type" CONTENT="text/html; charset=UTF-8">
<title>OpenOffice.org Web Content Style Guide (obsoleted)</title>
</head>
<body>
<h2>OpenOffice.org Style Guide</h2>
<p><a href="mailto:louis@openoffice.org">-Louis Suarez-Potts</a></p>
<p>$Date: 2004/06/29 14:32:29 $<i><br>
</i></p>
<h4>Update</h4>
<h4>This style guide is fairly obsolete but not entirely.</h4>
<p>OpenOffice.org uses CSS extensively. It didn't use to, and this style guide indicates it does not. For the latest style guide, see The New Style Guide.</p>
<p>&nbsp;</p>
<p>That said, the colors and layout of tables listed below are still relevant; it's just that we want you to use CSS throughout.</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<h4>Preface</h4>
<p>&nbsp;</p>
<p>This style guide has grown from it initial short version to something much
longer. However, thanks to the wonders of hypertext, one need not read all of
it; just the relevant sections. The three most important sections are featured
in the &quot;<a href="#quickstart">Quick Start</a>&quot; and include: <a href="#projectindex">The
Project Index Page</a>, <a href="#linking">Linking</a>, and <a href="#styles">style
sheets</a> (CSS). Other sections describe the OpenOffice.org <a href="#website">website</a>,
our <a href="#ooostyle">style</a>, how to do OpenOffice.org <a href="#tables">tables</a>,
and so on.</p>
<p>This guide is meant to be viewed by a Web browser, or by a WYSIWYG HTML editor.
If you do look at it through an editor such as HomeSite or BBEdit, things will
look strange, as I wrote it presuming people would see it from a browser's perspective.
I have tried to include as many &quot;cut-and-paste examples&quot; as I could
think of; these are clearly labeled as such below. You can also just copy from
the existing website.</p>
<p>If you have questions, please send them to me: <a href="mailto:louis@openoffice.org">louis@openoffice.org</a>.
</p>
<br>
<hr>
<h3>Contents</h3>
<a name="top"></a>
<dl>
<dt><a href="#quickstart">Quick Start</a>
<dt><a href="#introductory">Introductory</a></dt>
<dd>
<li><a href="#overview">Overview: HTML</a>
<li><a href="#about">About the OpenOffice.org Website</a>
<li><a href="#ooostyle">The OpenOffice.org Style </a></li>
<li><a href="#tidy">Using Tidy</a></li>
<li><a href="#styles">Style Sheets (CSS)</a>
<li><a href="#linking">Linking, Or, How to Write Links That <i>Work</i></a>
<li><a href="#linking">Absolute vs. Relative Links</a>
<li><a href="#projectindex">The Project Index Page</a>
<li><a href="#templates">Index Page Templates</a>
<li><a href="#samplepage">Samples: Viewed as HTML</a>
<dt><a href="#tables">Tables</a>
<dd><li><a href="#simptable">The Simple Table (Bordered)</a>
<li><a href="#simplesample">Sample</a></li>
<li><a href="#simpformatting">Table Formatting: General</a> </li>
<li><a href="#simpformatparticular">Table Formatting: Particular</a></li>
<li><a href="#htmlversion1">What this table looks like in HTML</a></li>
<li><a href="#cutnpaste1">Cut 'n' Paste Sample</a></li>
<li><a href="#simpunbordered">The Simple Table (Unbordered)</a>
<li><a href="#simpunbsample">Sample: Unbordered Simple Table</a></li>
<li><a href="#simpsamphtml"> Simple, Unbordered Table, in HTML</a></li>
<li><a href="#nestedtable">The Nested Table</a>
<li><a href="#extformatting1">Table Formatting, Exterior, General</a></li>
<li><a href="#extformatting2">Table Formatting, Exterior: Particulars</a>
</li>
<li><a href="#formattingint1">Table Formatting: Interior Table</a> </li>
<li><a href="#inttableparts">Interior Table Particulars</a></li>
<li><font color="#000000"><a href="#inttableHTML">Here is what this table
looks like in HTML</a></font></li>
<li><a href="#sampnestedtable">Sample Nested Table</a> </li>
<dt><a href="#conclusion">Conclusion</a>
<dt><a href="#otherguide">Another style guide: recommended!</a><br>
</dl>
<hr>
<a name="quickstart"></a>
<h3>Quick Start</h3>
<h4><b><u>What to do</u></b> </h4>
<blockquote>
<p>Use our index page <a href="index_template.html" target="_blank">template</a>.
Or, use StarOffice or OpenOffice.org to create your index page. Either way,
follow these conventions:</p>
<ul>
<li>Headings: No <b>h1.</b> Use <b>h2</b> for the largest heading, with h3
and h4 for subheadings. If you use h1, nothing bad will happen, it will
just look odd. </li>
<li>Leave fonts as default. Exceptions: code font. </li>
<li>No document title. It won't appear, or it may appear in an ugly fashion
at the top of the page</li>
<li>Use <a href="#linking">relative links</a>.</li>
</ul>
<p>That is about it. There is no need for h1 heading, as it is rather too large.
If you use StarOffice/OpenOffice.org, you can conform your page to OpenOffice.org
standards using <a href="#tidy">Tidy.</a> Tidy will configure the page so
that it does not disrupt the operation of SourceCast. For more information
about the OpenOffice.org website, please read below, &quot;<a href="#about">About
the OpenOffice.org Website</a>.&quot; </p>
</blockquote>
<br>
<hr>
<a name="introductory"></a>
<h3>Introduction</h3>
<h4><a name="overview">Overview: HTML</a></h4>
<p>I won't bore you with a definition of HTML, but basically an HTML page or document
is comprised of plain, unformatted text with embedded commands in the text adjacent
to the target text that stipulate the way the target text should look when viewed
according to certain conventions by certain technologies. These commands are
called "tags,&quot; come in paired sets, and look like regular text: <font face="Courier New, Courier, mono">&lt;b&gt;bold&lt;/b&gt;</font>,
for instance, gives you <b>bold</b>. Not terribly complicated, the idea is simplicity
itself. A browser constructed and instructed to view these tags according to
the accepted standards and conventions will thus read the tag for bold as indicating
that the characters within the brackets should be represented in boldface. More
involved tags do the same logical thing only more elaborately.</p>
<p><b>Note</b>: When coding in HTML you have to tell the browser when to start
reading something and when to end reading it: The opening and closing tags.
These tag pairs may be separated by any number of characters, but must be nested.
Thus: ABC...CBA.</p>
<p>Almost all modern word processing software such as StarOffice are able to convert
formatted text into HTML pages that <i>look</i> the same (or close enough),
when viewed by a suitable browser (less suitable: older browsers that are not
equipped to read the latest HTML conventions). As well, really rudimentary word
processors and text editors can be used. In fact the HTML hackers among us <i>prefer
</i>dumb programs that don't add any extra formatting, because they rightly
want to be in control of what it is they are creating, and have no nasty surprises
in store. A bugbear of HTML coders is that different browsers read code differently,
which makes sense, if you think of a browser as a mechanical renderer of text
that proceeds according to certain conventions.</p>
<p>(If you are interested in learning more about HTML construction, a good place
to start is <a href="http://www.w3.org/" target="_blank">http://www.W3C.org</a>)</p>
<p>In short, you can create your Web (HTML) pages using StarOffice (or OpenOffice.org)
or some other text processor...but there are some caveats. I'll deal with them
in the next section.</p>
<p><a href="#top">Back to top</a><br>
<br>
<br>
<h4>About the OpenOffice.org Website<a name="about"></a></h4>
<p>We have a fairly simple architecture in which there is static element framing
a dynamic element. The static element comprises the header, footer, title, and
navbars. The dynamic only consists of the content in the middle: the body of
the text. Using the latest technology, these static and dynamic elements are
composited together, producing a coherent Web page. </p>
<p>Because of this arrangement, you cannot (or at least should not) create pages
that <i>also</i> have those parts the static section supplies. That is, any
page created for the OpenOffice.org website should start with whatever you have
to say--the content--and that's it. No&lt;head&gt;, &lt;title&gt;. &lt;body&gt;
tags. Only your content.</p>
<p>And if you do include such tags, what will happen? Probably nothing exciting.
Browsers read from left to right, top to bottom, so it will read the static
tags first (which is why all our pages are dumbly remembered in the browser
as &quot;www.openoffice.org&quot; no matter what their content), and will very
likely simply ignore your redundant tag. At most the text between the title
tags will appear at the top of your page in black default font.</p>
<p>There are exceptions. If you write a &quot;meta&quot; tag and are stipulating
XHTML or something else that deviates from the kind of HTML declared in the
static tag, the browser will likely understand your stipulation and proceed
accordingly. And, you can certainly use page-local cascading style sheets (CSS).
(StarOffice, like Microsoft Office, saves formatted documents using styles.)
However, unless the styles are clearly defined in the document or in a page
loaded with the document, they may not be read appropriately, as they may conflict
with OpenOffice.org's own styles. (See below, <a href="#styles"> Style Sheets</a>.)</p>
<p><b>Note</b>: For various reasons, please only use <i>lower case</i> not UPPER
CASE HTML formatting. Thus: &lt;bold&gt; not &lt;BOLD&gt;. If you use upper
case, nothing bad will happen. However, XHTML (which is a more flexible form
of HTML) does see case differences, so our preference now is for lower case
tags. </p>
<p><a href="#top">Back to top</a><br>
<br>
<br>
<h4>The OpenOffice.org Style<a name="ooostyle"></a></h4>
<p>As already mentioned, our pages are simple, with very few jpgs, gifs, or any
other graphics, and no animation of any sort. We use a simple three-color scheme
of blues and lots of white spaces. This makes the pages easy to read. We also
use a kind of reddish-brown for h2 headings. All these attributes are determined
by our style sheet. See the above &quot;<a href="#styles">Styles</a>&quot; and
&quot;<a href="#sample">Sample</a>&quot; for further insight.</p>
<p><i>For general pages</i></p>
<ul>
<li>Background: Do not specify a color. Our style sheet in the static element
does that for you. You can specify a background color for a <i>table</i>;
see below.</li>
<li>Text: Black and default font</li>
<li>Page Heading:
<ul>
<li> Format: Heading 2 (h3) for big headers (page names, say), heading 3
(h3) for smaller subheadings; heading 4 (h4) for below that
<li>Face: Default</li>
<li>For example, the heading to this page looks like this in HTML: &lt;h2&gt;&lt;
&gt; Style Guide&lt;/font&gt;&lt;/h2&gt;</li>
</ul>
</li>
<li>For smaller headings (section headings, for instance) use the same face
color/style, but diminish the size appropriately. (See below, example 1.)</li>
</ul>
<p><a href="#top">Back to top</a><br>
<br>
<br>
<p><a name="tidy"></a>
<h4>Using Tidy</h4>
<p>Get and configure HTML <a href="http://www.w3.org/People/Raggett/tidy/" target="_blank">Tidy</a>
for your editing environment. This terrific utility cleans up broken HTML instead
of merely complaining about it. As Todd Fahner, who is generally deemed one
of the leading experts in HTML composition writes, &quot;I strongly recommend
using it to achieve the initial xhtmlification of the files. Unfortunately,
markup-oriented tools turn Velocity (formerly WebMacro) logic into hamburger,
so you can't run the tool on the source. But you can run it on the output and
then manually merge it back into the source. It's better than re-keying it all.
Use <a href="./tidyconfig.html">this</a> config file for Tidy.</p>
<p> I recommend you use Tidy if you have created your Web page using a text-processor
such as StarOffice or OpenOffice.org, or, if you have used a WYSIWYG HTML editor
such as Dreamweaver or Go Live, both of which impart their own characteristics.
(A good WYSIWYG editor that is quite clean is <a href="http://www.w3.org/Amaya/" target="_blank">Amaya,</a>
which is preferred by the W3C. Amaya runs on Windows.</p>
<p><a href="#top">Back to top</a><br>
<br>
<br>
<h4><a name="styles"></a>Style Sheets</h4>
<p> OpenOffice.org now uses style sheets. This is good, as style sheets allow
us to place all the formatting information on one sheet which a browser then
refers to. As a result, both page size and access time are reduced, dramatically
so. But there are some consequences. If a user has turned off the style sheet
option in their browser, they will not see the page as it has been designed.
They will see something considerably drabber, but still perfectly functional.</p>
<p><b>Consequences.</b> Our style sheet determines the font and font-face: of
the Arial, Helvetica, sans-serif family; h1 is black, h2 is #cc3300 (a reddish
brown), h3, h4, black. If you stipulate your own fonts and font-faces, your
page may not display properly, as the browser will essentially pick and choose
syntagmatically from the options presented it. Your page may look a mess, in
short.</p>
<p>Therefore: do not stipulate any font or font-face. Leave it blank. If you have
created a page that's a conversion from a StarOffice or OpenOffice.org document,
see if you can use Tidy to clean it up. If you cannot, see if you can strip
the font and font-face information by hand, so that only the font heading information
(h1, h2, h3, etc.) remains. And if that fails, don't worry, probably nothing
<i>bad</i> will happen, your page will just look a little odd. </p>
<p><b>Note. </b>If you would like additions to the style sheet, please let me
know by sending mail to <a href="mailto:louis@openoffice.org">louis@openoffice.org</a>.
</p>
<p><a href="#top">Back to top</a><br>
<br>
<br>
<a name="linking"></a>
<h4>Linking, Or, How to Write Links That <i><b>Work</b></i></h4>
<p><u><b>Absolute vs. Relative Links</b></u></p>
<p><i><b>We now use relative links.</b></i></p>
<p><b>Note: </b>Please use relative links of the form described below:
<ul>
<li>For top-level, &quot;index.html&quot; pages, use : &quot;<font face="Courier New, Courier, mono">/[directoryname]/[doc.html]</font>&quot;
when referring to documents in the directory <i>below the one in which the
index.html</i> <i>is located.</i> That is, if you have an index.html page
that refers to, say, &quot;specialstyles.html&quot; in the directory &quot;special,&quot;
you would use &quot;<font face="Courier New, Courier, mono">/special/specialstyles.html</font>&quot;.
Failure to use this convention will routinely result in broken links. </li>
<li>In contrast, when referring to documents <i>within a directory</i>, please
use: &quot;<font face="Courier New, Courier, mono">[doc.html],</font>&quot;
without a preceding slash. If you precede the filename with a slash, you will
take the browser to top-level directory.
<ul>
<li>Thus, if you are writing a link from within the index.html page of the
<font face=Courier New, Courier, mono"> "main"</font> directory referring
to a document in a subdirectory, it would be <font face=Courier New, Courier, mono">
/foo/foobar.html</font>. And if you aer writing a link from the "<font face="courier, new, courier, mono">paper.html</font>"
page within the <font face=Courier New, Courier, mono"> /main/</font>
directory to the <font face="Courier New, Courier, mono">/foo/foobar.html</font>
page, you would write as: &quot;<font face="Courier New, Courier, mono">&lt;a
href=&quot;foo/foobar.html&quot;&gt;</font>&quot;, without the preceding
slash. This is because if you include it, it tells the browser to go to
the root directory, which unless you are writing from the root, is not what you
want.</li>
</ul>
</li>
<li>Do not precede the filename with a period, as in &quot;<font face="Courier New, Courier, mono">./[doc].html</font>&quot;.
Doing so will result in unpredictable behavior (of SourceCast). </li>
<li>When referring to links <i>above</i> the directory in which you are working,
use the standard convention of &quot;<font face="Courier New, Courier, mono">../</font>&quot;
per directory rung. Thus, if you are in <font face="Courier New, Courier, mono">/foo/</font>
and you want to refer to &quot;<font face="Courier New, Courier, mono">whee.html</font>
in /main/ you would write: &quot;<font face="Courier New, Courier, mono">&lt;a
href=&quot;../whee.html&quot;&gt;</font>&quot; ; and so on, with <font face="Courier New, Courier, mono">../</font>
denoting a move up to the root index of that directory.</li>
</ul>
<p><b>Longer explanation</b>. The tendency in OpenOffice.org has been to use absolute
links. That is, links of the form, "<font face="courier, courier new">//styles/index_template.html</font>"
referring to a file in the same directory as this document, rather than "<font face="courier, courier new">/styles/index_template.html</font>"
(written in the <font face="Courier New, Courier, mono">www/index.html</font>
page). Both addresses refer to the same document--the index template; the former
is, however, is called "absolute" because the path won't change to reflect any
movement of the directory in which the documents live. In contrast, a "relative"
link, "<font face="courier, courier new">/index_template.html</font>" allows
for greater flexibility. All documents in the <font face="courier, courier new">/styles/</font>
directory can be moved along with the directory, and HTTP addresses will work,
no matter where they are subsequently placed. </p>
<p>Thus, if I were to relocate "<font face="courier, courier new">//styles/index_template.html</font>"
to, say, the <font face="Courier New, Courier, mono">/betterstyles/</font> directory,
I'd have to rename each and every HTTP address, which would be a real pain.
But if I did the same for "<font face="courier, courier new">/index_template.html</font>"
I wouldn't have to rename anything, as long as I kept the logic of directories
and indexes straight.</p>
<p><a href="#top">Back to top</a><br>
<br>
<br>
<a name="projectindex"></a>
<h4>The Project Index Page</h4>
<p>SourceCast has transformed some of the features of the project index page,
or homepage. The most important: we no longer use a table to represent all the
mailing lists, archives, and subscription information. Instead, the top navbar
has a link that more than adequately provides this information. See below, <a href="#samplepage">Sample
Page</a>, for a more or less typical index page. You can also go directly to
the project index page template: <a href="index_template.html">//styles/index_template.html</a>.</p>
<p>As well, the project owner's name is now automatically generated by SourceCast,
meaning that you do not have to provide it.</p>
<br>
<br>
<a name="templates"></a>
<h4>Index Page Templates</h4>
<p>An &quot;index page&quot; is the homepage of a directory. It is what is delivered
when someone enters, say, &quot;//&quot;. The server
will look for the index page and serve it up; if it is lacking, nothing will
happen. SourceCast allows you to configure your index page while you are creating
a project, or even to use the HTML text that you enter in a box in the project
creation page. But for better homepages (and ones that will more reliably be
served up), we recommend you create and load to CVS an index page.</p>
<p>Regardless of whether you intend on using the SourceCast provision or creating
an index page, the same question obtains: What should you put on your index
page? Enough so that visitors and prospective developers will know something
about the project, the goals, the things that have to be done. Accordingly,
I have created an <a href="index_template.html" target="_blank">index page template</a>.
It is for generic projects, and has sections for statements about the mission
of the project, history, a table for to-dos or modules, and so on. Configure
it by deleting or duplicating some elements. </p>
<p><b>Note.</b> SourceCast has made it trivially easy to subscribe and unsubscribe
to mailing lists and to view and search mailing list archives. Visitors need
only click on the &quot;Mailing Lists&quot; link on the project's top navbar
to view the options. However, consider encouraging participation in the project
by having a brief description of the mailing lists, and what they are about.
You need not have links for subscribing or viewing archives, as those are taken
care of by the project navbar Mailing List link.</p>
<p>The template below should provide you with a quick means of starting a new
index page. If, however, you prefer to create your index page using StarOffice
or OpenOffice.org, please at least follow the conventions described above and
presented below. To use this, simply </p>
<ul>
<li><a href="index_template.html" target="_blank">Generic project index template</a></li>
</ul>
<p><a href="#top">Back to top</a><br>
<br>
<br>
<h4><a name="samplepage"></a>Sample: Viewed as HTML</h4>
<p>If you are curious about how the above page looks like in &quot;HTML,&quot;
the below Whiteboard index template exemplifies how simple the coding is. </p>
<table width="100%" border="1" bordercolor="#99ccff" cellpadding="4" cellspacing="0">
<tr>
<td>
<p><font face="Courier New, Courier, mono" size="-1">&lt;!--Start here.
Do not add any header HTML--&gt;</font></p>
<p><font face="Courier New, Courier, mono" size="-1">&lt;!--Heading: H2,
default font (we use css, which defines color (as #cc6600) and font face;
body text: default; subheadings: H4, default font--&gt;</font></p>
<p><font face="Courier New, Courier, mono" size="-1">&lt;!--Language here
is supposed to offer a start, not a finish. Feel free to change it as
necessary, but try to keep within the bounds described.--&gt;</font></p>
<p><font face="Courier New, Courier, mono" size="-1">&lt;!--Project mailing
lists, project news, are all taken care of now by SourceCast's top navbar.
You do not need to add a table for them.--&gt;</font></p>
<p><font face="Courier New, Courier, mono" size="-1">&lt;!--You might wish
to include a &quot;to-dos&quot; list or something like that.--&gt;&lt;h2&gt;[Projectname]
Project &lt;/h2&gt;</font></p>
<p><font face="Courier New, Courier, mono" size="-1">&lt;p&gt;&lt;i&gt;Last
modified: [date]&lt;/i&gt;&lt;/p&gt;</font></p>
<p><font face="Courier New, Courier, mono" size="-1">&lt;br&gt;<br>
&lt;br&gt;<br>
<br>
&lt;h4&gt;Mission Statement&lt;/h4&gt;<br>
&lt;p&gt;A sentence or two explaining the purpose of the project&lt;/p&gt;
<br>
<br>
&lt;br&gt;<br>
&lt;h4&gt;Background&lt;/h4&gt;<br>
&lt;p&gt;A short history, if relevant, of the project.&lt;/p&gt;<br>
&lt;br&gt;<br>
&lt;h4&gt;Project Summary&lt;/h4&gt;<br>
&lt;p&gt;[A short paragraph informing interested people of the project's
scope and to-dos. You might wish instead to include a simple table listing
to-dos or associated projects, as below:]&lt;/p&gt;</font></p>
<p><font face="Courier New, Courier, mono" size="-1">&lt;br&gt;<br>
&lt;table cellpadding=&quot;4&quot; cellspacing=&quot;1&quot; bgcolor=&quot;#ffffff&quot;
width=&quot;100%&quot;&gt;</font></p>
<p><font face="Courier New, Courier, mono" size="-1">&lt;tbody&gt; <br>
&lt;tr&gt; <br>
&lt;td colspan=&quot;3&quot; bgcolor=&quot;#00315a&quot; align=&quot;Center&quot;&gt;
<br>
&lt;div align=&quot;left&quot;&gt;&lt;font color=&quot;#ffffff&quot; size=&quot;-1&quot;&gt;&lt;b&gt;
[To-dos]/[associated projects]&lt;/b&gt;&lt;/font&gt;&lt;/div&gt;</font></p>
<p><font face="Courier New, Courier, mono" size="-1">&lt;/td&gt;<br>
&lt;/tr&gt;<br>
&lt;tr&gt; <br>
&lt;td bgcolor=&quot;#99ccff&quot; align=&quot;Center&quot; width=&quot;30%&quot;&gt;
<br>
&lt;div align=&quot;left&quot;&gt;&lt;font color=&quot;#00315a&quot; size=&quot;-1&quot;&gt;
&lt;b&gt;[Type]&lt;/b&gt;&lt;/font&gt;&lt;/div&gt;</font></p>
<p><font face="Courier New, Courier, mono" size="-1">&lt;/td&gt;<br>
&lt;td bgcolor=&quot;#99ccff&quot; align=&quot;Left&quot;&gt; &lt;font
color=&quot;#00315a&quot; size=&quot;-1&quot;&gt; &lt;b&gt;[Description]&lt;/b&gt;&lt;/font&gt;&lt;/td&gt;</font></p>
<p><font face="Courier New, Courier, mono" size="-1">&lt;/tr&gt;<br>
&lt;tr&gt; <br>
&lt;td bgcolor=&quot;#f0f0f0&quot; width=&quot;30%&quot;&gt; &lt;font
size=&quot;-1&quot;&gt; &lt;b&gt;[item 1] &lt;/b&gt;&lt;/font&gt;&lt;/td&gt;</font></p>
<p><font face="Courier New, Courier, mono" size="-1">&lt;td bgcolor=&quot;#f0f0f0&quot;
align=&quot;Left&quot;&gt;&amp;nbsp;&lt;/td&gt;<br>
&lt;/tr&gt;<br>
&lt;tr&gt; <br>
&lt;td bgcolor=&quot;#f0f0f0&quot; width=&quot;30%&quot;&gt; &lt;font
size=&quot;-1&quot;&gt; &lt;b&gt;[item 2] &lt;/b&gt;&lt;/font&gt;&lt;/td&gt;</font></p>
<p><font face="Courier New, Courier, mono" size="-1">&lt;td bgcolor=&quot;#f0f0f0&quot;
align=&quot;Left&quot;&gt;&amp;nbsp;&lt;/td&gt;<br>
&lt;/tr&gt;<br>
&lt;tr&gt; <br>
&lt;td bgcolor=&quot;#f0f0f0&quot; width=&quot;30%&quot;&gt; &lt;font
size=&quot;-1&quot;&gt; &lt;b&gt;[item 3] &lt;/b&gt;&lt;/font&gt;&lt;/td&gt;</font></p>
<p><font face="Courier New, Courier, mono" size="-1">&lt;td bgcolor=&quot;#f0f0f0&quot;
align=&quot;Left&quot;&gt;&amp;nbsp;&lt;/td&gt;<br>
&lt;/tr&gt;<br>
<br>
&lt;/tbody&gt; <br>
&lt;/table&gt;<br>
&lt;p&gt;<br>
&lt;!--Simply replace the items with your own, or delte this table. Style:
font size, -1; default face. --&gt;</font></p>
<p><font face="Courier New, Courier, mono" size="-1">&lt;/p&gt;<br>
&lt;br&gt;<br>
&lt;h4&gt;Participation&lt;/h4&gt;<br>
&lt;!--This language can be changed!--&gt;<br>
&lt;p&gt; Much of our work takes place in our mailing lists page, which
can viewed by clicking on the &amp;quot;Mailing Lists&amp;quot; link in
the navbar above. From there, you can subscribe to our lists and view
archives. Please familiarize yourself with the discussions that have taken
place. Once you have done so, don't hesitate to join in! A convention
is that new members introduce themselves briefly before they present ideas
and opinions to the community.</font></p>
<p><font face="Courier New, Courier, mono" size="-1">&lt;p&gt;&amp;nbsp;</font></p>
</td>
</tr>
</table>
<br>
<p><b>Note: </b>You will notice the absence of header and footer tags; the static
element takes care of that.</p>
<p><a href="#top">Back to top</a><br>
<br>
<br>
<br>
<h3>Tables<a name="tables"></a></h3>
<p>We have two primary table structures. One is simpler than the other; use it
when you have fewer headings to cover. Depending on the nature of the information
to be displayed, it can consist of two nested tables: the outside table provides
the border, the inside the data. The more complex table has no border and uses
only one table to supply the content. </p>
<br>
<h4>The Simple Table<a name="simpunbordered"></a></h4>
<p>Most of our tables are of a simple design and are unbordered. That is, the
border is either left blank </p>
<p>Not all of our tables have borders. Indeed, most of our tables do not have
borders. The logic that determines your aesthetic decision: the nature of the
information that must be represented in the table. A table needing a header
and column heads will not need the border. The final call, however, is up to
you. For what it is worth, mailing list tables (such as the example below) have
no borders, but informational tables, such as news tables, do. As a rule, avoid
replicating information, e.g., don't have a table title outside the table and
also within the table, as a heading.</p>
<br>
<h4>Sample: The Simple Table<a name="simpunbsample"></a> </h4>
<br>
<p>From the homepage of the <a href="http://udk.openoffice.org/">UDK</a> Project,
I have taken a sample table that is neatly laid out. The same table, with the
HTML coding shown, is displayed <a href="#simpsamphtml">below</a>. (By the way:
the legacy trend is to center the heading, etc.; I am moving away from that,
and urging all to position the headers on the left.)<br>
<br>
<table cellpadding="4" cellspacing="1" bgcolor="#ffffff" width="100%">
<tr>
<td colspan="2" bgcolor="#00315A" align="CENTER"><font color="#ffffff" size="2"><b>
Interesting modules outside the UNO Development Kit Project </b> </font></td>
</tr>
<tr>
<th bgcolor="#99CCFF" align="CENTER"><font color="#00315A" size="2"><b> Module
</b> </font> </th>
<th bgcolor="#99CCFF" align="CENTER"><font color="#00315A" size="2"><b>Function
</b></font></th>
</tr>
<td bgcolor="#f0f0f0" valign="top"><code><a href="index.html">sal</a></code></td>
<td bgcolor="#f0f0f0" valign="top"> The System abstraction layer implements
a basic abstraction of the underlying system. For your components to be system
independent you should you SAL. SAL includes abstractions for thread creation
and synchronization. Mechanisms for process communication and file system
access are also part of this library. Management of libraries and profiles
is also included. Functions for creating and manipulating strings and wide
strings belong to SAL. SAL only exports functions conforming to the c calling
convention. So, it should be suitable to be a system abstraction for any language.
</td>
</tr>
<td bgcolor="#f0f0f0" valign="top"><code><a href="index.html">store</a></code></td>
<td bgcolor="#f0f0f0" valign="top"> This project provides the hierarchical storages
for the component registry. </td>
</tr>
</table>
<br>
<p><b>Particulars</b>
<ul>
<li>Table width: 100%</li>
<li>Cell Pad: 4</li>
<li>Cell Space: 1</li>
<li>Border: Leave blank</li>
<li>Border Color: Leave blank</li>
<li>Background: Leave blank</li>
<li>Cell Color: #fofofo</li>
</ul>
<p>Note how white lines structure the table cells? That's because the <i>page</i>
background is white (#ffffff) but each cell's background is off-white (#fofofo).
You can achieve the same effect by setting the table's background to off-white
(#fofofo) and setting the border to white (#ffffff). The table below, from the
Mirrors page, does just that.</p>
<br>
<table width="100%" cellpadding="4" bgcolor="#F0F0F0" cellspacing="1" border="1" bordercolor="ffffff">
<tr>
<td colspan="8" bgcolor="300315A">
<div align="left"><font size="-1"><b><font color="#ffffff">Current Mirror
Sites</font></b></font></div>
</td>
</tr>
<tr>
<td width="7%" bgcolor="#99ccff">
<div align="left"><font size="-1"><b>Type</b></font></div>
</td>
<td width="44%" bgcolor="#99ccff">
<div align="left"><font size="-1"><b>URL</b></font></div>
</td>
<td width="15%" bgcolor="#99ccff">
<div align="left"><font size="-1"><b>Login</b></font></div>
</td>
<td width="15%" bgcolor="#99ccff">
<div align="left"><font size="-1"><b>Password</b></font></div>
</td>
<td width="19%" bgcolor="#99ccff"><b><font size="-1">Source</font></b></td>
<td width="19%" bgcolor="#99ccff"><b><font size="-1"> Binaries</font></b></td>
<td width="19%" bgcolor="#99ccff"><b><font size="-1">Solver</font></b></td>
<td width="19%" bgcolor="#99ccff">
<div align="left"><font size="-1"><b>Maintainer</b></font></div>
</td>
</tr>
<tr>
<td width="7%">
<div align="left">FTP</div>
</td>
<td width="44%">
<div align="left"><a href="ftp://openoffice:@ftp.ists.pwr.wroc.pl/" target="_blank">ftp://openoffice:@ftp.ists.pwr.wroc.pl/</a></div>
</td>
<td width="15%">
<div align="left">openoffice</div>
</td>
<td width="15%">
<div align="left"><font face="Courier New, Courier, mono">&lt;</font>none<font face="Courier New, Courier, mono">&gt;</font></div>
</td>
<td width="19%">633 (all platforms)</td>
<td width="19%">633 (all platforms)</td>
<td width="19%">&nbsp;</td>
<td width="19%"><a href="mailto:B.Maruszewski@jtz.org.pl">Bartek Maruszewski</a></td>
</tr>
<tr>
<td width="7%">
<div align="left">FTP</div>
</td>
<td width="44%">
<div align="left"><a href="ftp://borft.student.utwente.nl" target="_blank">ftp://borft.student.utwente.nl</a></div>
</td>
<td width="15%">&lt;anonymous&gt;</td>
<td width="15%">&lt;none&gt;</td>
<td width="19%">633, 627, 625, 617</td>
<td colspan="2">633 (Linux, Win32), in 5 MB parts</td>
<td width="19%"><a href="mailto:mike@borft.student.utwente.nl">Michael Niblett</a>*</td>
</tr>
<tr>
<td width="7%">
<div align="left">HTTP</div>
</td>
<td width="44%">
<div align="left"><a href="http://borft.student.utwente.nl/openoffice/">http://borft.student.utwente.nl/openoffice/</a></div>
</td>
<td width="15%">&lt;n/a&gt;</td>
<td width="15%">&lt;none&gt;</td>
<td width="19%">633, 627, 625, 617</td>
<td colspan="2">633 (Linux, Win32), in 5 MB parts</td>
<td width="19%"><a href="mailto:mike@borft.student.utwente.nl">Michael Niblett</a>*</td>
</tr>
<tr>
<td width="7%">HTTP</td>
<td width="44%"><a href="http://sapi.vlsm.org/openoffice/">http://sapi.vlsm.org/openoffice/</a></td>
<td width="15%">&lt;anonymous&gt;</td>
<td width="15%">&lt;none&gt;</td>
<td width="19%">&nbsp;</td>
<td width="19%">633 (ZIP for Win32)</td>
<td width="19%">&nbsp;</td>
<td width="19%"><a href="mailto:rms46-oo@vlsm.org">Rahmat M. Samik-Ibrahim</a></td>
</tr>
<tr>
<td width="7%">FTP</td>
<td width="44%"><a href="ftp://sapi.vlsm.org/openoffice/">ftp://sapi.vlsm.org/openoffice/</a></td>
<td width="15%">&lt;anonymous&gt;</td>
<td width="15%">&lt;none&gt;</td>
<td width="19%">&nbsp;</td>
<td width="19%">633 (ZIP for Win32)</td>
<td width="19%">&nbsp;</td>
<td width="19%"><a href="mailto:rms46-oo@vlsm.org">Rahmat M. Samik-Ibrahim</a></td>
</tr>
<tr>
<td width="7%">FTP</td>
<td width="44%"><a href="ftp://sapi.vlsm.org/openoffice/">ftp://sapi.vlsm.org/openoffice/win32split/</a></td>
<td width="15%">&lt;anonymous&gt;</td>
<td width="15%">&lt;none&gt;</td>
<td width="19%">&nbsp;</td>
<td colspan="2">633 (ZIP for Win32) in 1440000 byte parts</td>
<td width="19%"><a href="mailto:rms46-oo@vlsm.org">Rahmat M. Samik-Ibrahim</a></td>
</tr>
<tr>
<td width="7%">HTTP</td>
<td width="44%"><a href="ftp://sapi.vlsm.org/openoffice/">http://sapi.vlsm.org/openoffice/win32split/</a></td>
<td width="15%">&lt;anonymous&gt;</td>
<td width="15%">&lt;none&gt;</td>
<td width="19%">&nbsp;</td>
<td colspan="2">633 (ZIP for Win32) in 1440000 byte parts</td>
<td width="19%"><a href="mailto:rms46-oo@vlsm.org">Rahmat M. Samik-Ibrahim</a></td>
</tr>
<tr>
<td width="7%">HTTP</td>
<td width="44%"><a href="http://office.qkaka.com/">http://office.qkaka.com/</a></td>
<td width="15%">&lt;n/a&gt;</td>
<td width="15%">&lt;n/a&gt;</td>
<td width="19%">&nbsp;</td>
<td width="19%">localized 627 zip </td>
<td width="19%">&nbsp;</td>
<td width="19%"><a href="mailto:zhanh@21cn.com">H.Z.</a></td>
</tr>
<tr>
<td width="7%">FTP</td>
<td width="44%"><a href="ftp://ftp.3way.com.hk">ftp://ftp.3way.com.hk</a></td>
<td width="15%">&lt;anonymous&gt;</td>
<td width="15%">&lt;none&gt;</td>
<td colspan="3">All current binaries, solver, and source; files in parts.</td>
<td width="19%"><a href="mailto:nelson@3way.com.hk">Nelson Lau</a></td>
</tr>
</table>
<br>
<p><b>Particulars</b> </p>
<ul>
<li>Table width: 100%</li>
<li>Cell Pad: 4</li>
<li>Cell Space: 1</li>
<li>Border: 1</li>
<li>Border Color: #ffffff</li>
<li>Background: #fofofo</li>
</ul>
<p><b>Note:</b> You can cut 'n' paste this table into any document needing a mailing
list table. (And, by deleting the elements, you can use the table for other
purposes.)</p>
<p><a href="#top">Back to top</a><br>
<br>
<br>
<h4> Simple, Unbordered Table, in HTML<a name="simpsamphtml"></a></h4>
<blockquote>
<table width="100%" bordercolor="#99ccff" cellpadding="2" cellspacing="0" border="1">
<tr>
<td> <font face="Courier New, Courier, mono" size="-1">&lt;table cellpadding=&quot;4&quot;
cellspacing=&quot;1&quot; bgcolor=&quot;#ffffff&quot; width=&quot;100%&quot;&gt;</font>
<p><font face="Courier New, Courier, mono" size="-1">&lt;tr&gt; </font></p>
<p><font face="Courier New, Courier, mono" size="-1">&lt;td colspan=&quot;2&quot;
bgcolor=&quot;#00315A&quot; align=&quot;CENTER&quot;&gt;&lt;font color=&quot;#ffffff&quot;
size=&quot;2&quot;&gt;&lt;b&gt; </font></p>
<p><font face="Courier New, Courier, mono" size="-1">Interesting modules
outside the UNO Development Kit Project &lt;/b&gt; &lt;/font&gt;&lt;/td&gt;</font></p>
<p><font face="Courier New, Courier, mono" size="-1">&lt;/tr&gt;</font></p>
<p><font face="Courier New, Courier, mono" size="-1">&lt;tr&gt; </font></p>
<p><font face="Courier New, Courier, mono" size="-1">&lt;th bgcolor=&quot;#99CCFF&quot;
align=&quot;CENTER&quot;&gt;&lt;font color=&quot;#00315A&quot; size=&quot;2&quot;&gt;&lt;b&gt;
</font></p>
<p><font face="Courier New, Courier, mono" size="-1">Module &lt;/b&gt;
&lt;/font&gt; &lt;/th&gt;</font></p>
<p><font face="Courier New, Courier, mono" size="-1">&lt;th bgcolor=&quot;#99CCFF&quot;
align=&quot;CENTER&quot;&gt;&lt;font color=&quot;#00315A&quot; size=&quot;2&quot;&gt;&lt;b&gt;Function
</font></p>
<p><font face="Courier New, Courier, mono" size="-1">&lt;/b&gt;&lt;/font&gt;&lt;/th&gt;</font></p>
<p><font face="Courier New, Courier, mono" size="-1">&lt;/tr&gt;</font></p>
<p><font face="Courier New, Courier, mono" size="-1">&lt;td bgcolor=&quot;#f0f0f0&quot;
valign=&quot;top&quot;&gt;&lt;code&gt;&lt;a href=&quot;cpp/ref/sal/index.html&quot;&gt;sal&lt;/a&gt;&lt;/code&gt;&lt;/td&gt;</font></p>
<p><font face="Courier New, Courier, mono" size="-1">&lt;td bgcolor=&quot;#f0f0f0&quot;
valign=&quot;top&quot;&gt; The System abstraction layer implements a
basic abstraction of the underlying system. For your components to be
system independent you should you SAL. SAL includes abstractions for
thread creation and synchronization. Mechanisms for process communication
and file system access are also part of this library. Management of
libraries and profiles is also included. Functions for creating and
manipulating strings and wide strings belong to SAL. SAL only exports
functions conforming to the c calling convention. So, it should be suitable
to be a system abstraction for any language. &lt;/td&gt;</font></p>
<p><font face="Courier New, Courier, mono" size="-1">&lt;/tr&gt;</font></p>
<p><font face="Courier New, Courier, mono" size="-1">&lt;td bgcolor=&quot;#f0f0f0&quot;
valign=&quot;top&quot;&gt;&lt;code&gt;&lt;a href=&quot;cpp/ref/store/index.html&quot;&gt;store&lt;/a&gt;&lt;/code&gt;&lt;/td&gt;</font></p>
<p><font face="Courier New, Courier, mono" size="-1">&lt;td bgcolor=&quot;#f0f0f0&quot;
valign=&quot;top&quot;&gt; This project provides the hierarchical </font></p>
<p><font face="Courier New, Courier, mono" size="-1">storages for the
component registry. &lt;/td&gt;</font></p>
<p><font face="Courier New, Courier, mono" size="-1">&lt;/tr&gt;</font></p>
<p><font face="Courier New, Courier, mono" size="-1">&lt;/table&gt;</font></p>
</td>
</tr>
</table>
</blockquote>
<p><a href="#top">Back to top</a><br>
<br>
<br>
<h4>The Nested Table<b><a name="nestedtable"></a></b></h4>
Here is a nested table, also from the homepage. Note: it is unbordered.<br>
<br>
<table width="100%" bordercolor="#99ccff" bgcolor="#ffffff" cellpadding="0" cellspacing="0">
<tr>
<td height="18" bordercolor="#99ccff" bgcolor="#00315A"><font size="-1" color="#ffffff"><b>Truly
useful news</b></font></td>
</tr>
<tr>
<td>
<table width="100%" border="0" cellpadding="2" height="100%">
<tr>
<td height="8" width="82%"><font size="-1"> <a href="/about_us/surveyreport.pdf">Community
Survey Report (472KB pdf)</a></font></td>
<td height="8" align="right" width="18%"><font size="-1">3 August</font></td>
</tr>
<tr>
<td height="8" width="82%"><font size="-1"><a href="//">Roadmap:
the guide to OpenOffice.org</a></font></td>
<td height="8" align="right" width="18%"><font size="-1">9 July</font></td>
</tr>
<tr>
<td height="8" width="82%"><font size="-1"><a href="//">Build
633</a></font></td>
<td height="8" align="right" width="18%"><font size="-1">18 June</font></td>
</tr>
<tr>
<td height="12" width="82%"><font size="-1"><a href="//screenshots/index.html">Screenshots</a></font></td>
<td height="12" align="right" width="18%"><font size="-1">9 July</font></td>
</tr>
<tr bordercolor="#99ccff">
<td width="74%" height="14"><font size="-1"><a href="//">
Newsletters</a></font></td>
<td width="18%" height="14" align="right" bgcolor="#ffffff"><font size="-1">Always</font></td>
</tr>
</table>
</td>
</tr>
</table>
<br>
<p> A nested table consists of at least two tables, an exterior, bordered table,
and an interior table with invisible borders; this is where the content is.
The basic colors and styles of the nested table are like the simple, un-nested
table. The advantage of nesting tables lies, then, in that you can create a
bordered table with cell demarcators that differ from the exteriors. This can
be quite useful.</p>
<br>
<h4>Table Formatting, Exterior, General<a name="extformatting1"></a> </h4>
<ul>
<li>Width: 100% </li>
<li>Height: Leave blank; in pixels </li>
<li>Cell pad: 0</li>
<li>Cell space: 0</li>
<li>Align: Default</li>
</ul>
<p><b>Note</b>: The border for the above table is not set; you can, for your particular
table, however, set it to &quot;1&quot; and make the exterior color light blue:
&quot;#99CCFF. </p>
<br>
<h4>Table Formatting, Exterior, Particulars<a name="extformatting2"></a> </h4>
<blockquote>
<p>This external table includes a row for the header. </p>
</blockquote>
<ul>
<ul>
<li>Header text: White (#ffffff), bold, no formatting. Size: you can alter
this by shrinking it to -1; that call is up to you. </li>
<li>Heading background: Dark blue (#00315A)<br>
</li>
</ul>
</ul>
<p><a href="#top">Back to top</a><br>
<br>
<br>
<h4>Table Formatting: Interior Table<a name="formattingint1"></a> </h4>
<p>The interior table is a regular table with the border set to 0 or left blank.
This way, you can organize information in a tabular fashion without having the
borders of the cells interrupt your aesthetic. The rule is:</p>
<ol>
<li>Make your table, setting border = 0 or leave it blank. (There is a difference
in the settings. Play around a little; I prefer to set the border to blank.)</li>
<li>Position the interior table within the exterior table and set the width
= 100%; leave the height blank, in pixels. The interior table should map perfectly
to the limits of the exterior table. </li>
<li>You can also do other things to accomplish the same effect, such as coloring
the cells, etc. Experiment; it's a pleasant way to use up time<br>
<br>
</li>
</ol>
<h4>Interior Table Particulars<a name="inttableparts"></a></h4>
<blockquote>
<p>The interior table above has the following characteristics:</p>
</blockquote>
<ul>
<ul>
<li>Border = 0</li>
<li>Cell Pad = 2 (you can raise it; lowering it is not recommended)</li>
<li>Cell Space = 0 or leave blank</li>
<li>Content background: Pale blue (#fofofo) (as will all tables)</li>
<li>Content text: Black, default font, no formatting. Size: you can shrink
the size to -1; that call is up to you.</li>
</ul>
</ul>
<p><a href="#top">Back to top</a><br>
<br>
<br>
<h4><font color="#000000">Here is what this table looks like in HTML<a name="inttableHTML"></a></font></h4>
<blockquote>
<table width="100%" bordercolor="#99ccff" cellpadding="2" cellspacing="0" border="1">
<tr>
<td>
<p><font face="Courier New, Courier, mono" size="-1">&lt;table width=&quot;100%&quot;
bordercolor=&quot;#99ccff&quot; bgcolor=&quot;#ffffff&quot; cellpadding=&quot;0&quot;
cellspacing=&quot;0&quot;&gt;</font></p>
<p><font face="Courier New, Courier, mono" size="-1">&lt;tr&gt; </font></p>
<p><font face="Courier New, Courier, mono" size="-1">&lt;td height=&quot;18&quot;
bordercolor=&quot;#99ccff&quot; bgcolor=&quot;#00315A&quot;&gt;&lt;font
size=&quot;-1&quot; color=&quot;#ffffff&quot;&gt;&lt;b&gt;Truly </font></p>
<p><font face="Courier New, Courier, mono" size="-1">useful news&lt;/b&gt;&lt;/font&gt;&lt;/td&gt;</font></p>
<p><font face="Courier New, Courier, mono" size="-1">&lt;/tr&gt;</font></p>
<p><font face="Courier New, Courier, mono" size="-1">&lt;tr&gt; </font></p>
<p><font face="Courier New, Courier, mono" size="-1">&lt;td&gt; </font></p>
<p><font face="Courier New, Courier, mono" size="-1">&lt;table width=&quot;100%&quot;
border=&quot;0&quot; cellpadding=&quot;2&quot; height=&quot;100%&quot;&gt;</font></p>
<p><font face="Courier New, Courier, mono" size="-1">&lt;tr&gt; </font></p>
<p><font face="Courier New, Courier, mono" size="-1">&lt;td height=&quot;8&quot;
width=&quot;82%&quot;&gt;&lt;font size=&quot;-1&quot;&gt; &lt;a href=&quot;/about_us/surveyreport.pdf&quot;&gt;Community
Survey Report (472KB pdf)&lt;/a&gt;&lt;/font&gt;&lt;/td&gt;</font></p>
<p><font face="Courier New, Courier, mono" size="-1">&lt;td height=&quot;8&quot;
align=&quot;right&quot; width=&quot;18%&quot;&gt;&lt;font size=&quot;-1&quot;&gt;3
August&lt;/font&gt;&lt;/td&gt; </font></p>
<p><font face="Courier New, Courier, mono" size="-1"> &lt;/tr&gt;</font></p>
<p><font face="Courier New, Courier, mono" size="-1">&lt;tr&gt; </font></p>
<p><font face="Courier New, Courier, mono" size="-1">&lt;td height=&quot;8&quot;
width=&quot;82%&quot;&gt;&lt;font size=&quot;-1&quot;&gt;&lt;a href=&quot;//white_papers/index.html&quot;&gt;Roadmap:
the guide to OpenOffice.org&lt;/a&gt;&lt;/font&gt;&lt;/td&gt;</font></p>
<p><font face="Courier New, Courier, mono" size="-1">&lt;td height=&quot;8&quot;
align=&quot;right&quot; width=&quot;18%&quot;&gt;&lt;font size=&quot;-1&quot;&gt;9
July&lt;/font&gt;&lt;/td&gt;</font></p>
<p><font face="Courier New, Courier, mono" size="-1">&lt;/tr&gt;</font></p>
<p><font face="Courier New, Courier, mono" size="-1">&lt;tr&gt; </font></p>
<p><font face="Courier New, Courier, mono" size="-1">&lt;td height=&quot;8&quot;
width=&quot;82%&quot;&gt;&lt;font size=&quot;-1&quot;&gt;&lt;a href=&quot;//dev_docs/source/download.html&quot;&gt;Build
633&lt;/a&gt;&lt;/font&gt;&lt;/td&gt;</font></p>
<p><font face="Courier New, Courier, mono" size="-1">&lt;td height=&quot;8&quot;
align=&quot;right&quot; width=&quot;18%&quot;&gt;&lt;font size=&quot;-1&quot;&gt;18
June&lt;/font&gt;&lt;/td&gt; &lt;/tr&gt; </font></p>
<p><font face="Courier New, Courier, mono" size="-1">&lt;tr&gt; &lt;td
height=&quot;12&quot; width=&quot;82%&quot;&gt;&lt;font size=&quot;-1&quot;&gt;&lt;a
href=&quot;//screenshots/index.html&quot;&gt;Screenshots&lt;/a&gt;&lt;/font&gt;&lt;/td&gt;</font></p>
<p><font face="Courier New, Courier, mono" size="-1">&lt;td height=&quot;12&quot;
align=&quot;right&quot; width=&quot;18%&quot;&gt;&lt;font size=&quot;-1&quot;&gt;9
July&lt;/font&gt;&lt;/td&gt;</font></p>
<p><font face="Courier New, Courier, mono" size="-1">&lt;/tr&gt;</font></p>
<p><font face="Courier New, Courier, mono" size="-1">&lt;tr bordercolor=&quot;#99ccff&quot;&gt;
</font></p>
<p><font face="Courier New, Courier, mono" size="-1">&lt;td width=&quot;74%&quot;
height=&quot;14&quot;&gt;&lt;font size=&quot;-1&quot;&gt;&lt;a href=&quot;//trulyusefulnews.html&quot;&gt;Truly
useful archives (two weeks plus)&lt;/a&gt;&lt;/font&gt;&lt;/td&gt;</font></p>
<p><font face="Courier New, Courier, mono" size="-1">&lt;td width=&quot;18%&quot;
height=&quot;14&quot; align=&quot;right&quot; bgcolor=&quot;#ffffff&quot;&gt;&lt;font
size=&quot;-1&quot;&gt;Always&lt;/font&gt;&lt;/td&gt;</font></p>
<p><font face="Courier New, Courier, mono" size="-1">&lt;/tr&gt;</font></p>
<p><font face="Courier New, Courier, mono" size="-1">&lt;/table&gt;</font></p>
<p><font face="Courier New, Courier, mono" size="-1">&lt;/td&gt;</font></p>
<p><font face="Courier New, Courier, mono" size="-1">&lt;/tr&gt;</font></p>
<p><font face="Courier New, Courier, mono" size="-1">&lt;/table&gt;</font></p>
</td>
</tr>
</table>
</blockquote>
<br>
<p><a href="#top">Back to top</a><br>
<br>
<br>
<h4>Sample Nested Table <a name="sampnestedtable"></a></h4>
<p>Here is a sample nested table. It may be easier to add content to the interior
table first, then cut and paste the completed interior table into the exterior
table shell. So, I've split them up.</p>
<table width="100%" border="1" cellpadding="0" bordercolor="#99ccff" cellspacing="0">
<tr bgcolor="#ffffff" bordercolor="#99ccff">
<td height="16" bordercolor="#99ccff" bgcolor="#00315A"><font size="-1" color="#ffffff"><b>[Your
heading here]</b></font></td>
</tr>
<tr>
<td bgcolor="#ffffff">&nbsp; </td>
</tr>
</table>
<br>
<table width="100%" border="0" bordercolor="#99ccff" cellpadding="2">
<tr>
<td height="12" width="82%"><font size="-1"><a href="//about_us/introduction.html" target="_blank">[content]</a></font></td>
</tr>
<tr>
<td height="12" width="82%"><a href="http://distribution.openoffice.org/mirrors/index.html"><font size="-1">[content]</font></a></td>
</tr>
<tr>
<td height="12" width="82%"><font size="-1" color="#666699"><a href="//about.html">[content]</a></font></td>
</tr>
</table>
<br>
<p><a href="#top">Back to top</a><br>
<hr>
<h3>Conclusion<a name="conclusion"></a></h3>
<h4>Another style guide<a name="otherguide"></a></h4>
<p>Todd Fahner has created a brief but beautifully clear <a href="http://collabnet.cleverchimp.com/notes/prodstandards/" target="_blank">style
guide</a> that also explains how to use style sheets. It is still a work in
progress, so be sure to check back on it periodically, but I heartily recommend
it.</p>
<p>And, if you have any questions, or wish to add (reasonable) material, please
let me know: <a href="mailto:louis@openoffice.org">louis@openoffice.org</a>.</p>
</body>
</html>