mirror of
https://github.com/boostorg/website2022.git
synced 2026-01-19 04:52:07 +00:00
dde98de1fb
This is based off of revision 56094d2c9f510f5ee4f1ffd4eb6b73788aaa62d7
of https://github.com/boostorg/website/.
URL of exact commit is: 56094d2c9f
315 lines
8.6 KiB
HTML
315 lines
8.6 KiB
HTML
---
|
|
title: Boost C++ Libraries
|
|
copyright: Rene Rivera 2005.
|
|
revised:
|
|
---
|
|
|
|
|
|
Boost C++ Libraries
|
|
|
|
|
|
|
|
Website Exemplars
|
|
=================
|
|
|
|
This is both a test page and a guide as to the various
|
|
styled elements available in the Boost web pages. And for self
|
|
reference this is a [class="section-body"] div inside a
|
|
[class="section"] div. Each [class="section"] div should have a
|
|
corresponding "id", in this case the section is [id="intro"].
|
|
Feel free to copy elements from here onto other pages to
|
|
quickly get the structure you want. **And of more import
|
|
please update this page if you add new content styles as it
|
|
helps everyone with the website documentation.**
|
|
|
|
|
|
Section [class="section-title"]
|
|
===============================
|
|
|
|
Simple paragraph inside the section body
|
|
[class="section-body"].
|
|
|
|
|
|
Heading 2
|
|
---------
|
|
|
|
|
|
The image to the
|
|
left uses a [class="left-inset"] as a shorthand for any
|
|
floating inset element aligned at both top and left edges.
|
|
— Lorem ipsum dolor sit amet, consectetuer adipiscing
|
|
elit. Duis ligula lorem, consequat eget, tristique nec, auctor
|
|
quis, purus. Vivamus ut sem. Fusce aliquam nunc vitae purus.
|
|
Aenean viverra malesuada libero. Fusce ac quam. Donec neque.
|
|
Nunc venenatis enim nec quam. Cras faucibus, justo vel accumsan
|
|
aliquam, tellus dui fringilla quam, in condimentum augue lorem
|
|
non tellus. Pellentesque id arcu non sem placerat iaculis.
|
|
Curabitur posuere, pede vitae lacinia accumsan, enim nibh
|
|
elementum orci, ut volutpat eros sapien nec sapien. Suspendisse
|
|
neque arcu, ultrices commodo, pellentesque sit amet, ultricies
|
|
ut, ipsum. Mauris et eros eget erat dapibus mollis. Mauris
|
|
laoreet posuere odio. Nam ipsum ligula, ullamcorper eu,
|
|
fringilla at, lacinia ut, augue. Nullam nunc.
|
|
|
|
|
|
### Heading 3
|
|
|
|
|
|
This image uses a
|
|
[class="right-inset"] to as a mirror of the previous section
|
|
for a floating inset element aligned to top and right edges.
|
|
— Sed et lectus in massa imperdiet tincidunt. Praesent
|
|
neque tortor, sollicitudin non, euismod a, adipiscing a, est.
|
|
Mauris diam metus, varius nec, faucibus at, faucibus
|
|
sollicitudin, lectus. Nam posuere felis ac urna. Vestibulum
|
|
tempor vestibulum urna. Nullam metus. Vivamus ac purus. Nullam
|
|
interdum ullamcorper libero. Morbi vehicula imperdiet justo.
|
|
Etiam mollis fringilla ante. Donec et dui. Class aptent taciti
|
|
sociosqu ad litora torquent per conubia nostra, per inceptos
|
|
hymenaeos. Etiam mi libero, luctus nec, blandit ac, rutrum ac,
|
|
lectus.
|
|
|
|
|
|
#### Heading 4
|
|
|
|
|
|
These are, hopefully all, the standard text markup styles.
|
|
Note, these are *not* structural markup elements. I.e.
|
|
these are the styles one sees to mark parts of the text inside
|
|
a paragraph, like the "not" in the second sentence of this
|
|
paragraph.
|
|
EM:
|
|
Indicates *emphasis*.
|
|
STRONG:
|
|
Indicates **stronger emphasis**.
|
|
CITE:
|
|
Contains a citation or a reference to other
|
|
sources.
|
|
DFN:
|
|
Indicates that this is the defining instance
|
|
of the enclosed term.
|
|
CODE:
|
|
Designates a fragment of `computer code`.
|
|
SAMP:
|
|
Designates `sample output` from programs,
|
|
scripts, etc.
|
|
KBD:
|
|
Indicates `text to be entered` by the user.
|
|
VAR:
|
|
Indicates an instance of a variable or program
|
|
argument.
|
|
ABBR:
|
|
Indicates an abbreviated form (e.g., WWW,
|
|
HTTP, URI, Mass.,
|
|
etc.).
|
|
ACRONYM:
|
|
Indicates an acronym (e.g., WAC,
|
|
radar, etc.).
|
|
Q:
|
|
Indicates a quotation possibly with
|
|
sub-quotes.
|
|
SUB and SUP:
|
|
Indicates either subscripts or
|
|
superscripts.
|
|
INS and DEL:
|
|
|
|
Used to markup sections of the document that have been
|
|
inserted or ~~deleted~~ with respect to a
|
|
different version of a document.
|
|
|
|
|
|
##### Heading 5
|
|
|
|
|
|
There are a variety of HTML structural elements. This means
|
|
that they do not tipically show with text flow. Bu tinstead
|
|
show as individual block elements. This paragraph being an
|
|
example. And the somewhat overused BLOCKQUOTE being
|
|
another:
|
|
>
|
|
> Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
|
|
> Duis ligula lorem, consequat eget, tristique nec, auctor
|
|
> quis, purus. Vivamus ut sem. Fusce aliquam nunc vitae purus.
|
|
> Aenean viverra malesuada libero. Fusce ac quam. Donec neque.
|
|
> Nunc venenatis enim nec quam. Cras faucibus, justo vel
|
|
> accumsan aliquam, tellus dui fringilla quam, in condimentum
|
|
> augue lorem non tellus. Pellentesque id arcu non sem placerat
|
|
> iaculis. Curabitur posuere, pede vitae lacinia accumsan, enim
|
|
> nibh elementum orci, ut volutpat eros sapien nec sapien.
|
|
> Suspendisse neque arcu, ultrices commodo, pellentesque sit
|
|
> amet, ultricies ut, ipsum. Mauris et eros eget erat dapibus
|
|
> mollis. Mauris laoreet posuere odio. Nam ipsum ligula,
|
|
> ullamcorper eu, fringilla at, lacinia ut, augue. Nullam
|
|
> nunc.
|
|
>
|
|
>
|
|
>
|
|
|
|
|
|
The Boost pages avoid the use of tables as a layout
|
|
mechanism. This helps, and hurts, in a variety of ways. The
|
|
most important benefit is the wider semantic access of the
|
|
content. It means that the largest set of browsers will
|
|
interpret tables as what they are; tabular content. The
|
|
following convenient sample comes from the helpful [HTML4 W3 standard](http://www.w3.org/TR/html4/struct/tables.html#h-11.5):
|
|
|
|
|
|
CODE-PAGE SUPPORT IN MICROSOFT WINDOWS
|
|
|
|
| Code-Page ID | Name | ACP | OEMCP | Windows NT 3.1 | Windows NT 3.51 | Windows 95 |
|
|
| --- | --- | --- | --- | --- | --- | --- |
|
|
| 1200 | Unicode (BMP of ISO/IEC-10646) | | | X | X | \* |
|
|
| 1250 | Windows 3.1 Eastern European | X | | X | X | X |
|
|
| 1251 | Windows 3.1 Cyrillic | X | | X | X | X |
|
|
| 1252 | Windows 3.1 US (ANSI) | X | | X | X | X |
|
|
| 1253 | Windows 3.1 Greek | X | | X | X | X |
|
|
| 1254 | Windows 3.1 Turkish | X | | X | X | X |
|
|
| 1255 | Hebrew | X | | | | X |
|
|
| 1256 | Arabic | X | | | | X |
|
|
| 1257 | Baltic | X | | | | X |
|
|
| 1361 | Korean (Johab) | X | | | \*\* | X |
|
|
| 437 | MS-DOS United States | | X | X | X | X |
|
|
| 708 | Arabic (ASMO 708) | | X | | | X |
|
|
| 709 | Arabic (ASMO 449+, BCON V4) | | X | | | X |
|
|
| 710 | Arabic (Transparent Arabic) | | X | | | X |
|
|
| 720 | Arabic (Transparent ASMO) | | X | | | X |
|
|
|
|
|
|
###### Heading 6
|
|
|
|
|
|
One of the most important elements of HTML is the hypertext
|
|
link. In the Boost pages all [links](/) are treated
|
|
in a similar, consistent, manner regardless of context as much
|
|
as possible. Stylistic variations are present to account for
|
|
color contrast differences in the context. For example the
|
|
links in the header, and footer use different colors to match
|
|
the text color and contrast as much as possible with the
|
|
respective backgrounds. Within section content, like here, the
|
|
links also provide differing look & feel based on wether
|
|
they target the [Boost web site](/), or some
|
|
[external web
|
|
site [class="external"]](http://www.google.com/). Since most of the time links are
|
|
internal, that is the default semantic. External links need to
|
|
be decorated with [class="external"].
|
|
|
|
|
|
* One
|
|
---
|
|
|
|
|
|
This a "directory" unordered list [ul
|
|
class="directory"]. It is styled to show a list of short
|
|
items in as compact a form as possible. Currently that
|
|
means the items are arrayed in two columns and items are
|
|
packed to read left-to-right and top-to-bottom.
|
|
* Two
|
|
---
|
|
|
|
|
|
Even though this an unordered list, one can also arrange
|
|
any block elements in this way. The top container needs to
|
|
be a [class="directory"] and the interior items
|
|
[class="directory-item"].
|
|
|
|
|
|
Unordered Lists [ul]
|
|
--------------------
|
|
|
|
|
|
This type of list is one of the most commonly used
|
|
structural elements used. It's used for directory listing,
|
|
history listings, table of contests, and many more. The goal is
|
|
to classify the various lists by type with a
|
|
[class="type-here"] attribute on the list [ul]. Please resist
|
|
the urge to use a classification just because it has the
|
|
particular look you want. As at some future point the look will
|
|
change and you will have no say in the effect of the particular
|
|
context.
|
|
|
|
|
|
### Default [ul]
|
|
|
|
|
|
* Item 1
|
|
+ Subitem 1a
|
|
- Subitem 1a1
|
|
- Subitem 1a2
|
|
+ Subitem 1b
|
|
* Item 2
|
|
+ Subitem 2a
|
|
+ Subitem 2b
|
|
|
|
|
|
### Directory [ul class="directory"]
|
|
|
|
|
|
* Item 1
|
|
+ Subitem 1a
|
|
- Subitem 1a1
|
|
- Subitem 1a2
|
|
+ Subitem 1b
|
|
* Item 2
|
|
+ Subitem 2a
|
|
+ Subitem 2b
|
|
|
|
|
|
### Table of contents [ul class="toc"]
|
|
|
|
|
|
* [Item 1](#)
|
|
+ [Subitem 1a](#)
|
|
+ [Subitem 1b](#)
|
|
* [Item 2](#)
|
|
+ [Subitem 2a](#)
|
|
+ [Subitem 2b](#)
|
|
|
|
|
|
### History [ul class="history"]
|
|
|
|
|
|
* Item 1
|
|
+ Subitem 1a
|
|
+ Subitem 1b
|
|
* Item 2
|
|
+ Subitem 2a
|
|
+ Subitem 2b
|
|
|
|
|
|
### Menus [ul class="menu"]
|
|
|
|
|
|
* [Item 1](#)
|
|
* [Item 2](#)
|
|
|
|
|
|
### Tree [ul class="tree"]
|
|
|
|
|
|
* Item 1
|
|
+ Subitem 1a
|
|
- Subitem 1a1
|
|
- Subitem 1a2
|
|
+ Subitem 1b
|
|
* Item 2
|
|
+ Subitem 2a
|
|
+ Subitem 2b
|
|
|
|
|
|
Preformatted [pre]
|
|
------------------
|
|
|
|
|
|
This is often used to show code examples, or more accurately
|
|
fixed examples. For example the [Boost Software License](/users/license.html):
|
|
```
|
|
```
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|