Next: Itemized Lists [Contents][Index]

TexInfo Source To HTML List Output Test ¶

Copyright © 2014-2025  
            Mahlon R. Smith, The Software Samurai

This document describes version 0.0.16 of ’infodoc-styles.css’.

The infodoc-styles.css CSS style definitions are released under 
the GNU General Public License (GPL 3+), and 
the user documentation (this document) is released under 
the GNU Free Documentation License (FDL 1.3+):

 Permission is granted to copy, distribute and/or modify this document
 under the terms of the GNU Free Documentation License, Version 1.3
 or any later version published by the Free Software Foundation;
 with no Invariant Sections, no Front-Cover Texts, and no Back-Cover
 Texts.  A copy of the license is available from the 
 Free Software Foundation: ‘http://www.gnu.org/licenses/’

This is a minimalist document created to exercise the post-processing 
of @enumerate (<ol>) and @itemize (<ul>) lists and miscellaneous constructs.
We use this document during the development process primarily because it builds 
in less than one second, making the write/test/modify sequence much more efficient.
The bulk of the test data contained in this document may also be found 
in the project document: “Infodoc.html”.

Itemized Lists
Enumerated Lists
Special Tests A
Special Tests B
Special Tests C
Index

Next: Enumerated Lists, Previous: TexInfo Source To HTML List Output Test, Up: TexInfo Source To HTML List Output Test [Contents][Index]

Itemized Lists ¶

List Types Directly Supported by the Makeinfo Engine

Each of these bullet types is supported by a CSS style class in 'infodoc-styles.css'.

@itemize with no argument (defaults to '@bullet')

CSS Class defaults to: mark-bullet
Was Miss Woozy Wombat whisked away by Wallowing Wallaby?
CSS Class defaults to: mark-bullet
Perhaps Polly Platypus is playing with Penelope Potoroo.

@itemize with '@bullet' argument

CSS Class: mark-bullet
Was Miss Woozy Wombat whisked away by Wallowing Wallaby?
CSS Class: mark-bullet
Perhaps Polly Platypus is playing with Penelope Potoroo.

@itemize with '@textdegree' argument (U+00B0)

CSS Class: mark-textdegree
Was Miss Woozy Wombat whisked away by Wallowing Wallaby?
CSS Class: mark-textdegree
Perhaps Polly Platypus is playing with Penelope Potoroo.

@itemize with '@minus' argument

CSS Class: mark-minus
Was Miss Woozy Wombat whisked away by Wallowing Wallaby?
CSS Class: mark-minus
Perhaps Polly Platypus is playing with Penelope Potoroo.

Note that the ’@minus’ argument generates U+2212 (Unicode minus) but this looks very small and too close to the text in the HTML output. This is corrected during post-processing. (see CSS class 'mark-minus')

@itemize with the 'no-bullet' argument encoded as: '@w{}'

CSS Class: mark-none
Was Miss Woozy Wombat whisked away by Wallowing Wallaby?
CSS Class: mark-none
Perhaps Polly Platypus is playing with Penelope Potoroo.

Additional List Types Supported `Infodoc` CSS Classes

Additional lists types may be specified by constructing the list using one of the Texinfo macros listed in the table below.

Example:
@itemize @SSQUARE
@item first item
@item second item
@item third item
@end itemize

These macros are found in the file: 'texi_macros.texi'.

CSS Class disc-small — U+2022
Was Miss Woozy Wombat whisked away by Wallowing Wallaby?
CSS Class disc-small — macro: @SDISC
Perhaps Polly Platypus is playing with Penelope Potoroo.

CSS Class disc-medium — U+25CF (or ’disc’ style element)
Was Miss Woozy Wombat whisked away by Wallowing Wallaby?
CSS Class disc-medium — macro: @MDISC
Perhaps Polly Platypus is playing with Penelope Potoroo.

CSS Class disc-large — Unicode U+23FA
Was Miss Woozy Wombat whisked away by Wallowing Wallaby?
CSS Class disc-large — macro: @LDISC
Perhaps Polly Platypus is playing with Penelope Potoroo.

CSS Class circle-small — Unicode U+25E6
Was Miss Woozy Wombat whisked away by Wallowing Wallaby?
CSS Class circle-small — macro: @SCIRCLE
Perhaps Polly Platypus is playing with Penelope Potoroo.

CSS Class circle-medium — ’circle’ style element.
Was Miss Woozy Wombat whisked away by Wallowing Wallaby?
CSS Class circle-medium — macro: @MCIRCLE
Perhaps Polly Platypus is playing with Penelope Potoroo.

CSS Class circle-large — Unicode U+25CB
Was Miss Woozy Wombat whisked away by Wallowing Wallaby?
CSS Class circle-large — macro: @LCIRCLE
Perhaps Polly Platypus is playing with Penelope Potoroo.

CSS Class square-small — ’square’ style element.
Was Miss Woozy Wombat whisked away by Wallowing Wallaby?
CSS Class square-small — macro: @SSQUARE
Perhaps Polly Platypus is playing with Penelope Potoroo.

CSS Class square-medium — Unicode U+25AA
Was Miss Woozy Wombat whisked away by Wallowing Wallaby?
CSS Class square-medium — macro: @MSQUARE
Perhaps Polly Platypus is playing with Penelope Potoroo.

CSS Class square-large — Unicode U+25FB
Was Miss Woozy Wombat whisked away by Wallowing Wallaby?
CSS Class square-large — macro: @LSQUARE
Perhaps Polly Platypus is playing with Penelope Potoroo.

CSS Class pointer-small — Unicode U+2023
Was Miss Woozy Wombat whisked away by Wallowing Wallaby?
CSS Class pointer-small — macro: @SPOINTER
Perhaps Polly Platypus is playing with Penelope Potoroo.

CSS Class pointer-medium — Unicode U+25B8
Was Miss Woozy Wombat whisked away by Wallowing Wallaby?
CSS Class pointer-medium — macro: @MPOINTER
Perhaps Polly Platypus is playing with Penelope Potoroo.

CSS Class pointer-large — Unicode U+25B7
Was Miss Woozy Wombat whisked away by Wallowing Wallaby?
CSS Class pointer-large — macro: @LPOINTER
Perhaps Polly Platypus is playing with Penelope Potoroo.

CSS Class diamond-small — Unicode U+2666
Was Miss Woozy Wombat whisked away by Wallowing Wallaby?
CSS Class diamond-small — macro: @SDIAMOND
Perhaps Polly Platypus is playing with Penelope Potoroo.

CSS Class diamond-medium — Unicode U+25C6
Was Miss Woozy Wombat whisked away by Wallowing Wallaby?
CSS Class diamond-medium — macro: @MDIAMOND
Perhaps Polly Platypus is playing with Penelope Potoroo.

CSS Class diamond-large — Unicode U+25C7
Was Miss Woozy Wombat whisked away by Wallowing Wallaby?
CSS Class diamond-large — macro: @LDIAMOND
Perhaps Polly Platypus is playing with Penelope Potoroo.

=ps= The following list uses the greater-than '>' character which is a reserved character in HTML, and is therefore encoded by the makeinfo engine as an HTML constant entity: >. It is included here to validate the 'idpp' parsing algorithm, and is not recommended for use as a bullet character.

First greater-than item
Second greater-than item

Smaller and Larger Font Size ¶

Use the @SmallItemize macro to create an itemized list using a smaller font size.

The @SmallItemize macro takes two arguments:
1) the bullet type, and
2) the text for the first line item of the list.
Note that if the text of the item includes commas, they must be escaped.

The macro is invoked using the format:
   @SmallItemize{bullet_type,text of first line item}
Example:
   @SmallItemize{@bullet,Shopping List: tomatoes\, cabbage\, celery}
   @item ginger ale, pizza, chips and salsa
   @end itemize

The macro arguments are enclosed in braces. Note the comma separating the bullet type from the item text, AND note the escaped commas in the item-text argument. (Commas in other line items are not escaped.)

The @SmallItemize macro includes the embedded token =s= (in the HTML output only), which instructs the 'idpp' post-processor to render the list referencing the CSS "ul.font-small" class in 'infodoc-styles.css'. This styling class applies a font size of 0.85em which is approximately 15% smaller than the text of the parent environment.

@macro SmallItemize{BULL,ITEM}
@itemize \BULL\
@item 
@ifhtml
=s=
@end ifhtml
\ITEM\
@end macro

Here is an example itemized list created using the @SmallItemize macro.

=s= Outside of a dog, a book is man’s best friend.
Inside of a dog, it’s too dark to read.
− Groucho Marx

──  ──  ──  ──  ──  ──  ──

Use the @LargeItemize macro to create an itemized list using a larger font size.

The @LargeItemize macro is the same as the @SmallItemize macro described above, except that the embedded token is =l= and the 'idpp' post-processor renders the list to reference the CSS "ul.font-large" class in 'infodoc-styles.css'. This styling class applies a font size of 1.15em which is approximately 15% larger than the text of the parent environment.

=l= I find television very educational.
Every time somebody turns on the set,
I go into the other room and read a book.
− Groucho Marx

Infodoc Bullet Characters ¶

SMALL
------------------------------------
    Unicode Class          Macro
    ------- -------------- ---------
'•' U+2022  disc-small     @SDISC
'◦' U+25E6  circle-small   @SCIRCLE
'▫' U+25AB  square-small   @SSQUARE
'‣' U+2023  pointer-small  @SPOINTER
'♦' U+2666  diamond-small  @SDIAMOND

MEDIUM
------------------------------------
    Unicode Class          Macro
    ------- -------------- ---------
'●' U+25CF  disc-medium    @MDISC
'⚬' U+26AC  circle-medium  @MCIRCLE
'▪' U+25AA  square-medium  @MSQUARE
'▸' U+25B8  pointer-medium @MPOINTER
'◆' U+25C6  diamond-medium @MDIAMOND

LARGE
------------------------------------
    Unicode Class          Macro
    ------- -------------- ---------
'⏺' U+23FA  disc-large     @LDISC
'◯' U+25EF  circle-large   @LCIRCLE
'◻' U+25FB  square-large   @LSQUARE
'▷' U+25B7  pointer-large  @LPOINTER
'◇' U+25C7  diamond-large  @LDIAMOND

Nested Lists Under Direct Browser Control

If the specified class is not defined, the browser will generate the default ’disc’ bullet list, or in a nested list, an appropriate down-level bullet. Beginning with makeinfo version 7.x, all generated itemized lists are defined; therefore, the browser has no control over selection of the bullet type.
For this reason 'idpp' provides a Texinfo macro specifically to allow the browser to control nested bullet lists.
         @CIRCLESLASH '⊘' (U+2298) &osol;
Post-processing replaces either of the makeinfo constructs:
   <ul class="itemize" style="list-style-type: '⊘'">       OR
   <ul class="itemize" style="list-style-type: '&osol;'">
with the plain <ul> list tag for each level of the nested construct, which allows the browser to apply its internal rules for nested lists.

Example:

   @itemize @CIRCLESLASH
   @item top-level item
      @itemize @CIRCLESLASH
      @item second-level item
         @itemize @CIRCLESLASH
         @item third-level item
            @itemize @CIRCLESLASH
            @item additional-level item
            @item additional-level item
            @end itemize
         @item third-level item
         @end itemize
      @item second-level item
      @end itemize
   @item top-level item
   @end itemize

Output:

top-level item
- second-level item
  - third-level item
    - additional-level item
    - additional-level item
  - third-level item
- second-level item
top-level item

Next: Special Tests A, Previous: Itemized Lists, Up: TexInfo Source To HTML List Output Test [Contents][Index]

Enumerated Lists ¶

Compliance:
Output to ’info’ document: as specified
Output to ’HTML’ document: as specified EXCEPT as noted below

The generated HTML for this command is:

   <ol class="enumerate" ...>
      <li> ... </li>
      <li> ... </li>
   </ol>

PLEASE NOTE:
The texi-to-HTML converter uses three(3) HTML sequences for enumerated lists ( '@enumerate' ):
— Numeric: 1-nnn
— Alphabetic (lower-case): a-zzz
— Alphabetic (upper-case): A-ZZZ
Other enumeration types, such as Greek, Roman numerals, Arabic, Hebrew and other types supported by HTML are not directly available during the texi-to-HTML conversion.
Note also that the number or character used to specify the enumeration type also specifies the start value for the sequence. Some examples would be:
@enumerate 1  yields:
   1 some text
   2 some text
   3 some text

@enumerate 6  yields:
   6 some text
   7 some text
   8 some text

@enumerate a  yields:
   a some text
   b some text
   c some text

@enumerate F  yields:
   F some text
   G some text
   H some text
While this is a perfectly acceptable interpretation of a list structure, it does not allow for constructs such as:
@enumerate α
   α some text
   β some text
   γ some text
   δ some text
   ε some text
—OR—
@enumerate I
   I some text
  II some text
 III some text
  IV some text
   V some text
Alternate enumeration types are ignored by the texi-to-HTML converter and are rendered as simple numeric lists. While this is annoying and technically incorrect, we can’t really classify it as a bug because the converter would have to be enhanced to support all the enumeration types tested here. So, let’s call it an urgent enhancement request. Until that happens, we can use some post-processing to assign CSS definitions for each of the unsupported enumeration types.

Enumerate command without argument ¶

First no-argument item
Was Miss Woozy Wombat whisked away by Wallowing Wallaby?
Second no-argument item
Perhaps Polly Platypus is playing with Penelope Potoroo.
```
Here is some verbatim stuff at the end of an enumerated list...
```

Enumerate command with numeric argument ¶

First numeric item
Was Miss Woozy Wombat whisked away by Wallowing Wallaby?
Second numeric item
Perhaps Polly Platypus is playing with Penelope Potoroo.

Enumerate command with non-default numeric argument (24) ¶

First non-default-start numeric item
Was Miss Woozy Wombat whisked away by Wallowing Wallaby?
Second non-default-start numeric item
Perhaps Polly Platypus is playing with Penelope Potoroo.

Enumerate command with lower-case alpha argument ¶

First lower-alpha item
Was Miss Woozy Wombat whisked away by Wallowing Wallaby?
Second lower-alpha item
Perhaps Polly Platypus is playing with Penelope Potoroo.

Enumerate command with upper-case alpha argument ¶

First upper-alpha item
Was Miss Woozy Wombat whisked away by Wallowing Wallaby?
Second alpha item
Perhaps Polly Platypus is playing with Penelope Potoroo.

Enumerate command with non-default alpha argument (’S’) ¶

First non-default-start upper-alpha item
Was Miss Woozy Wombat whisked away by Wallowing Wallaby?
Second non-default-start alpha item
Perhaps Polly Platypus is playing with Penelope Potoroo.

Enumerate command with descending numeric sequence (10->0) ¶

NOTE: In this document, the sequence will be displayed in descending order due to the inclusion of an embedded formatting token.
Please see the “Interface Logic” chapter of the documentation and the section on interactive processing for additional information.

=d10.d= All systems report Green.
All personnel exit the gantry immediately.
Lock helmets now.
Verify oxygen flow to suits.
Control team: clear all hold switches.
Disengage life-support tether.
Verify environmental readouts.
Disengage LOx tether.
Grip the hand rails.
Tighten your sphincters.
Blast Off !!

Enumerate commands with extended definition arguments ¶

The specified enumeration-type arguments are interpreted by the postprocessor
as special-case constructs, and the lists are adjusted accordingly.

Specify lower-alpha (@enumerate a) with default start index:

First item
Was Miss Woozy Wombat whisked away by Wallowing Wallaby?
Second item
Perhaps Polly Platypus is playing with Penelope Potoroo.

Specify upper-alpha (@enumerate A) with default start index:

First item
Was Miss Woozy Wombat whisked away by Wallowing Wallaby?
Second item
Perhaps Polly Platypus is playing with Penelope Potoroo.

Specify decimal-with-leading zero (@enumerate D) (’info’ and HTML will not be symmetrical).

First item
Was Miss Woozy Wombat whisked away by Wallowing Wallaby?
Second item
Perhaps Polly Platypus is playing with Penelope Potoroo.

Specify lower-case Roman Numerals (@enumerate i), (’info’ and HTML will not be symmetrical).

First item
Was Miss Woozy Wombat whisked away by Wallowing Wallaby?
Second item
Perhaps Polly Platypus is playing with Penelope Potoroo.

Specify upper-case Roman Numerals (@enumerate I), (’info’ and HTML will not be symmetrical).

First item
Was Miss Woozy Wombat whisked away by Wallowing Wallaby?
Second item
Perhaps Polly Platypus is playing with Penelope Potoroo.

Specify lower-case Greek characters (@enumerate g), (’info’ and HTML will not be symmetrical).

First item
Was Miss Woozy Wombat whisked away by Wallowing Wallaby?
Second item
Perhaps Polly Platypus is playing with Penelope Potoroo.

Specify upper-case Greek characters (@enumerate G), (’info’ and HTML will not be symmetrical).

First item
Was Miss Woozy Wombat whisked away by Wallowing Wallaby?
Second item
Perhaps Polly Platypus is playing with Penelope Potoroo.
Note that not all browsers support uppercase Greek enumeration.

Specify CJK (Han) (informal) numeric (@enumerate j), (’info’ and HTML will not be symmetrical).

第一个中日韩项目
在哪里可以找到母语为普通话的人？
第二个中日韩项目
我的普通话很差。
第三中日韩项目
也许我会回到成都继续深造。

Targeted Katakana alpha (Gojūon) (@enumerate k),
’info’ and HTML will not be symmetrical.

果物
アルフレッドはキウイやオレンジやストロベリーやすっぱいのくだものがすきですよ！
中毒薬
パトリックはビールやワインやアルコールはのみますか。

Specify Hebrew alphabetic (@enumerate h),
The 'info' and HTML will not be symmetrical; Hebrew is an RTL language.

יש שני דברים אינסופיים,
היקום וטיפשות האדם ...
ואני לא בטוח לגבי היקום.
אלברט איינשטיין

Targeted Arabic-Indic numeric (@enumerate e),
The 'info' and HTML will not be symmetrical; Arabic is an RTL language.

الذكاء
أشد الفاقة عدم العقل
شخص برئاسة المستوى
اتق شر الحليم اذا غضب
فعل الخير للآخرين
أباد الله خضراءهم ابذل لصديقك دمك ومالك

Smaller and Larger Font Size ¶

Use the @SmallEnumerate macro to create an enumerated list using a smaller font size.

The @SmallEnumerate macro takes two arguments:
1) the enumeration type, and
2) the text for the first line item of the list.
Note that if the text of the item includes commas, they must be escaped.

The macro is invoked using the format:
   @SmallEnumerate{enumeration_type,text of first line item}
Example:
   @SmallEnumerate{A,Shopping List: tomatoes\, cabbage\, celery}
   @item ginger ale, pizza, chips and salsa
   @end enumerate

The macro arguments are enclosed in braces. Note the comma separating the enumeration type from the item text, AND note the escaped commas in the item-text argument. (Commas in other line items are not escaped.)

The @SmallEnumerate macro includes the embedded token =...s.= (in the HTML output only), which instructs the 'idpp' post-processor to render the list referencing the CSS "ol.font-small" class in 'infodoc-styles.css'. This styling class applies a font size of 0.85em which is approximately 15% smaller than the text of the parent environment.

@macro SmallEnumerate{ETYPE,ITEM}
@enumerate \ETYPE\
@item 
@ifhtml
=...s.=
@end ifhtml
\ITEM\
@end macro

Here is an example itemized list created using the @SmallEnumerate macro.

=...s.= Eat sensibly,
Exercise extensively,
Drive defensively,
Love decisively,
Live intentionally.
− Sam, 2022

Use the @LargeEnumerate macro to create an enumerated list using a larger font size.

The @LargeEnumerate macro is the same as the @SmallEnumerate macro described above, except that the embedded token is =...l.= and the 'idpp' post-processor renders the list to reference the CSS "ol.font-large" class in 'infodoc-styles.css'. This styling class applies a font size of 1.15em which is approximately 15% larger than the text of the parent environment.

This list is created using the @LargeEnumerate macro.
Name the film in which each of these quotations appears...

=...l.= Hasta la vista, baby.
There’s no crying in baseball.
May the Force be with you.
Inconceivable!
You can’t handle the truth!
You shall not pass!
Frankly, my dear, I don’t give a damn.
Go ahead, make my day.
Gentlemen, you can’t fight in here,
this is the War Room!
Toto, I’ve a feeling we’re not in Kansas anymore.

Direct HTML markup passed through converter ¶

The following examples are enclosed within a non-converted sequence:
’@html ... @end html’
The examples reference the style definitions within the ’infodoc-styles.css’ file. If this file is not referenced within the HTML output, then the examples will be style-less and therefore not representative of the referenced classes.

This code will not be visible within the ’info’ output, but should be passed through the texi-to-HTML converter as unprocessed HTML markup.

Some unprocessed HTML code examples for <ol> lists.
Requires linking in the 'infodoc-styles.css' file.

Note that the older (possibly deprecated) <ol type="xxx"> construct may no longer work.
For this reason, we use CSS to specify the enumeration type: <ol style:"list-style-type:xxx"> ... </ol>

Default 'ol' Element
Default 'ol' Element

'ol' Element with hard-coded 'decimal' style
'ol' Element with hard-coded 'decimal' style

'ol' Element referencing 'enum-decimal' class
'ol' Element referencing 'enum-decimal' class

'ol' Element with hard-coded 'lower-alpha' style
'ol' Element with hard-coded 'lower-alpha' style

'ol' Element referencing 'enum-lower-alpha' class
'ol' Element referencing 'enum-lower-alpha' class

'ol' Element with hard-coded 'upper-alpha' style
'ol' Element with hard-coded 'upper-alpha' style

'ol' Element referencing 'enum-upper-alpha' class
'ol' Element referencing 'enum-upper-alpha' class

'ol' Element with hard-coded 'lower-roman' style
'ol' Element with hard-coded 'lower-roman' style

'ol' Element referencing 'enum-lower-roman' class
'ol' Element referencing 'enum-lower-roman' class

'ol' Element with hard-coded 'upper-roman' style
'ol' Element with hard-coded 'upper-roman' style

'ol' Element referencing 'enum-upper-roman' class
'ol' Element referencing 'enum-upper-roman' class

'ol' Element with hard-coded 'lower-greek' style
'ol' Element with hard-coded 'lower-greek' style

'ol' Element referencing 'enum-lower-greek' class
'ol' Element referencing 'enum-lower-greek' class

'ol' Element with hard-coded 'upper-greek' style
'ol' Element with hard-coded 'upper-greek' style
Note that not all browsers support uppercase Greek enumeration.

'ol' Element referencing 'enum-upper-greek' class
'ol' Element referencing 'enum-upper-greek' class
Note that not all browsers support uppercase Greek enumeration.

Next: Special Tests B, Previous: Enumerated Lists, Up: TexInfo Source To HTML List Output Test [Contents][Index]

Special Tests A ¶

The following are lists nested inside other lists which exercises the 'idpp' list-recursion algorithm.

@enumerate nested within @enumerate ¶

Nested Enumerate (a)
The HTML for this list should be post-processed with (a)
New Boots
1. There once was a man from Nantucket
2. Who always peed into a bucket
3. Till one day, he missed
4. And his boots got all pissed,
5. And shouted "Now I’ll have to wash them!"
Nested Enumerate (A)
The HTML for the following list should be post-processed with (A)
Old Wife
1. There once was a man from Poughkeepsie
2. Who often got rather tipsy.
3. He was roundly ashamed;
4. Twas his wife that he blamed,
5. For she was quite prone to be ditzy.

Blocks Inside Lists ¶

It is possible to place a pre-formatted data block inside a list; however, both enumerated and itemized lists are inherently flowing text and interrupting that flow is generally unwise, unattractive and unnecessary. For test purposes, examples of both “@format” and “@display” formatted blocks are embedded in the following list. However, it is recommended that if you need a formatted block inside a list, you should break the list before the block and continue it after the block.

@itemize nested within @enumerate ¶

Nested Itemize @bullet(•)

   The HTML for the following list should not need post-processing, 
   but the browser sees that it is nested and automagically converts 
   the ’disc’ bullets to (level-down) ’circle’ bullets. 
   (See note above and simulated disc-bullet list below.)

"Your Love" from: "The One Where Monica Gets a New Roommate"

Love is sweet as summer showers,
Love is a wondrous work of art.
But your love, oh your love, your love
is like a giant pigeon, crapping on my heart.

Nested Itemize @w{} with simulated disc bullets(•)
```
   Although there are at least seven children born during the 
   series, this one occurred during the birth of Ross’ son Ben. 
   Indentation adjusted during post-processing.
   
```
"Babies" from "The One With the Birth"
- ⏺ They’re tiny and chubby and so sweet to touch
  Soon they’ll grow up and resent you so much
- ⏺ Now they’re yelling at you and you don’t know why
  And you cry and you cry and you cry
- ⏺ And you cry and you cry...
Nested Itemize @textdegree(°)
Indentation adjusted during post-processing.
"Crazy Underwear" from: "The One With Ross’s Thing"
- Crazy underwear,
  creepin up my butt.
- Crazy underwear,
  Always in a rut.
- Crazy underwear...
Nested Itemize @minus(−)
This is a three-level itemized list, and the HTML for
all levels should contain an embedded ‘−’ character.
Each line item will be post-processed to adjust indentation.
"Smelly Cat" from "The One With the Baby On the Bus, et al"
- Smelly cat, smelly cat
  What are they feeding you?
- Smelly cat, smelly cat
  It’s not your fault
  - They won’t take you to the vet
    You’re obviously not their favorite pet.
  - You may not be a bed of roses
    And you’re no friend to those with noses.
- Smelly cat, smelly cat
  What are they feeding you?
- Smelly cat, smelly cat
  It’s not your fault

@itemize nested within @itemize ¶

Nested Itemize @bullet(•)
Barney
- There was a cute girl from Killarney
- Got seduced by a tosser named Barney.
- Though he’d touted his prowess,
- When they got to his howse,
- She found it was all naught but blarney.
Nested Itemize @textdegree(°)
Long Jack
- Jack was a rough ’un from Bristol.
- Who was wont to whip out his pistol.
- Though not much of a shot,
- And he’d miss like as not,
- In length, ’twas surprisingly distal.
Nested Itemize @minus(−)
Wedding Night Blues
- Though the bride was quite powerfully built,
- The groom vowed he’d prevail ’neath the quilt.
- But try as he might
- Through the long wedding night,
- ’Twas his nose blood that finally got spilt.

@enumerate nested within @itemize ¶

The HTML for the following should be post-processed with lowercase Roman

   The items in this group of lists are specified in the 
   Texinfo source as ’@enumerate i’, ’@enumerate I’ and 
   ’@enumerate g’, respectively. After post-processing, the 
   HTML and ’info’ documents will not be symmetrical. This 
   is necessary for this test document, but use care when 
   creating production documents, so that the ’info’ and 
   post-processed HTML documents remain synchronized.

"Blackout" from "The One With the Blackout"

New York City has no power,
and the milk is getting sour;
But to me, it is not scary
’cause I stay away from dairy.

The HTML for the following should be post-processed with uppercase Roman
"Shower Song" from "The One With the Baby On the Bus"
1. I’m in the shower,
  and I’m writing a song.
2. Stop me if you’ve heard it.
3. My skin is soapy,
  and my hair is wet,
4. and Tegrin spelled backward
  is Nirget.
5. Lather, rinse, repeat
  and lather, rinse, repeat
  and lather, rinse, repeat
6. as needed.
The HTML for the following should be post-processed with lowercase Greek.
"Barnyard Animals" from "The One After the Superbowl, Part One"
1. Oh, the cow in the meadow goes ’moo’,
  the cow in the meadow goes ’moo’.
2. Then the farmer hits him in the head,
  and grinds him all up
3. and that’s how we get hamburger.
4. Noooowww chickens!...

Deeply Nested Lists ¶

Itemized Below Enumerated (disc bullet)
"Sticky Shoes" from "The One With Phoebe’s Ex-partner"
- My favorite shoes, so good to me
  I wear them every day.
- Down at the heel, holes in the toe
  Don’t care what people say.
- My feet’s best friend, pals to the end
  with them I’m one hot chickie
- Thought late one night, not much light
  I stepped in something icky...
  Enumerated Below Itemized (decimal leading-zero)
  1. Sticky shoes, sticky shoes
    Always make me smile.
  2. Sticky shoes, sticky shoes
    Next time, I’ll avoid the pile!
All Hail, Phoebe Buffay!

Lyrics in this section copyright (c) NBC / Warner Bros. Television.
(but the limericks are our fault :-)

Next: Special Tests C, Previous: Special Tests A, Up: TexInfo Source To HTML List Output Test [Contents][Index]

Special Tests B ¶

Quotation Block with ’author’ Attached ¶

Correct is better than fast. Simple is better than complex.
Clear is better than cute. Safe is better than insecure.

— Sutter and Alexandrescu, C++ Coding Standards

Correct is better than fast. Simple is better than complex.
Clear is better than cute. Safe is better than insecure.

— Sutter and Alexandrescu, C++ Coding Standards

Important Note:
In previous versions of the texi-2-HTML converter, (prior to v:6.6_2019_02_10), 
six of the seven block types supported the “small...” versions of the block type. 
For example “@smallquotation”. The small versions of these block types had all 
the same characteristics of the standard versions except that the font size was smaller. 
The “small...” option was still available for Tex and other output formats.
Beginning with version 7.0 of the texi-2-HTML converter, support for these commands 
has been restored.

Lists Inside Blocks ¶

The HTML specification says that lists are allowed within any construct where text “flows”. It is important to note that within texinfo formatted blocks, @format, @display, @example, @lisp text DOES NOT “flow”.
Of course lists are not possible inside a @verbatim block.

With that said, the following blocks look surprisingly good in the ‘info’ document; however, the texi-to-HTML converter does some nasty (and in our opinion, completely unnecessary) stuff inside blocks that are defined as “preformatted” i.e. non-flowing text.

By default, the worst of this unfortunate formatting of embedded lists is removed during post-processing. If you are curious about what these lists look like without post-processing, rebuild this HTML file and perform post-processing using the '--no_special' option.

In conclusion, it is STRONGLY recommended that lists not be placed inside pre-formatted blocks.

In contrast, text inside an @indentedblock DOES flow, so those lists require no special processing.

@indentedblock ¶

Here we are inside an @indentedblock block.

Bathe.
Brush your teeth.
Shave unwanted hair.
Eat a healthful breakfast.
Pack your bag.
Kiss all family members.
Go to work.

Bathe.
Brush your teeth.
Shave unwanted hair.
Eat a healthful breakfast.
Pack your bag.
Kiss all family members.
Go to work.

Leaving the @indentedblock block.

@display block ¶

This is a preformatted block containing an itemized list and an enumerated list. Without post-processing, it looks awful (see note above). Even with post-processing, you can see that the spacing above and below the lists is too much.

Here we are inside a @display block.

```
Bathe.
```
```
Brush your teeth.
```
```
Shave unwanted hair.
```
```
Eat a healthful breakfast.
```
```
Pack your bag.
```
```
Kiss all family members.
```
```
Go to work.
```

```
Bathe.
```
```
Brush your teeth.
```
```
Shave unwanted hair.
```
```
Eat a healthful breakfast.
```
```
Pack your bag.
```
```
Kiss all family members.
```
```
Go to work.
```

Leaving the @display block.

Here is the HTML markup generated for this mess: ¶

<div class="display">
<pre class="display-preformatted">Here we are inside a @display block.
</pre><ul class="itemize mark-bullet">
<li><pre class="display-preformatted">Bathe.
</pre></li><li><pre class="display-preformatted">Brush your teeth.
. . .
</pre></li><li><pre class="display-preformatted">Go to work.
</pre></li></ul>
<pre class="display-preformatted">

</pre><ol class="enumerate">
<li> <pre class="display-preformatted">Bathe.
</pre></li><li> <pre class="display-preformatted">Brush your teeth.
. . .
</pre></li><li> <pre class="display-preformatted">Go to work.
</pre></li></ol>
<pre class="display-preformatted">Leaving the @display block.
</pre></div>

Here is the post-processed version of the same code: ¶

<div class="display">Here we are inside a @display block.
<ul class="itemize mark-bullet">
<li>Bathe.
</li><li>Brush your teeth.
. . .
</li><li>Go to work.
</li></ul>

<ol class="enumerate">
<li> Bathe.
</li><li> Brush your teeth.
. . .
</li><li> Go to work.
</li></ol>
Leaving the @display block.
</div>

@example block ¶

Here is another fine mess! This is a preformatted block containing an itemized list and an enumerated list. See note above.

Here we are inside an @example block.

```
Bathe.
```
```
Brush your teeth.
```
```
Shave unwanted hair.
```
```
Eat a healthful breakfast.
```
```
Pack your bag.
```
```
Kiss all family members.
```
```
Go to work.
```

```
Bathe.
```
```
Brush your teeth.
```
```
Shave unwanted hair.
```
```
Eat a healthful breakfast.
```
```
Pack your bag.
```
```
Kiss all family members.
```
```
Go to work.
```

Leaving the @example block.

Next: Index, Previous: Special Tests B, Up: TexInfo Source To HTML List Output Test [Contents][Index]

Special Tests C ¶

Blocks Inside Blocks ¶

Except for @indentedblock blocks it is strongly recommended that block environments NOT be nested within other block environments, but we run a few tests here, just to see what happens.
(Note that 'idpp' handles these tests smoothly :)

(Remember that the contents of PRE-FORMATTED blocks are not processed)
(  by idpp, but are merely copied, unchanged from source to target.  )

@indentedblock within @indentedblock block ¶

This text is part of the outer indented block. It should be indented by a few spaces as specified by the document’s @exampleindent command (5 spaces by default in info output).

This is a doubly-indented paragraph, i.e. it lives within a nested @indentedblock. This is a bit unlikely is a production document, but we want to see how makeinfo handles it for info-format and HTML-format output.

This text is part of the outer indented block. It should be indented by a few spaces as specified by the document’s @exampleindent command (5 spaces by default in info output).

@example within @indentedblock block ¶

This text is part of the outer indented block. It should be indented by a few spaces as specified by the document’s @exampleindent command (5 spaces by default in info output).
This text is within an @example block (monospaced text).
It can often be useful to change font families for emphasis.
This text is part of the outer indented block. It should be indented by a few spaces as specified by the document’s @exampleindent command (5 spaces by default in info output).

Simple @quotation block with @author ¶

"Give a man a fish, and he’ll eat fish."

— Samwise Gamgee

@quotation block within @indentedblock ¶

This text is within the indented block. It should be indented by a few spaces as specified by the document’s @exampleindent command if present (5 spaces by default in info output).

"Give a man a fish, and he’ll think something is rotten in Denmark, but teach a man to fish, and he’ll think you want to have sex with him."

— Samwise Shakespeare

This text is within the indented block. It should be indented by a few spaces as specified by the document’s @exampleindent command if present (5 spaces by default in info output).

@indentedblock within @quotation block ¶

"Why is the rum gone?"

"One, Because it is a vile drink that turns even the most respectable men into complete scoundrels..."

This text is within an indented block within a @quotation command. Note that we cannot follow an @author sub-command with an indented block because makeinfo always places the @author just inside the end of the @quotation block.

"But why is the rum gone?"

"... and two, because that signal is over a thousand feet high. The entire royal navy is out looking for me; do you think there is even the slightest chance they won’t see it?"

This text is within an indented block within a @quotation command. We don’t name the author of this exchange because everyone on the planet already knows who the speakers are–but it is after all copyrighted material–so give credit where credit is due.

"There’ll be no living with her after this."

The Cartouche ¶

A “cartouche” is a bordered paragraph. The border is not visible within the ‘info’ document, and may as well have beeen ignored. However, the border is rendered correctly for the HTML document. CSS style for margins and interior padding is added to beautify the output. By default, text within an HTML cartouche block is pre-formatted during post-processing, but may be allowed to flow using the "--cartouche" post-processing option.

Bullet Characters ¶

The character codes used by HTML for unordered lists. Note that the characters shown in the ’info’ document only approximate the characters in the HTML document which are browser-specific.

HTML NAME	NESTING LEVEL	EXAMPLE
’disc’	top	( ⏺ )
’circle’	second	( ⚬ )
’square’	third and lower	( ▪ )

HTML-only output follows: default unordered lists nested to demonstrate the bullets used by default for each level.

This is embedded HTML markup:

Some stuff A

Some stuff B

Some stuff C

Some stuff D

Test the capture and handling of previously-processed tags.
(simulated data)

disc-small #1
disc-small #2

disc-medium #1
disc-medium #2

disc-large #1
disc-large #2

circle-small #1
circle-small #2

circle-medium #1
circle-medium #2

circle-large #1
circle-large #2

square-small #1
square-small #2

square-medium #1
square-medium #2

square-large #1
square-large #2

pointer-small #1
pointer-small #2

pointer-medium #1
pointer-medium #2

pointer-large #1
pointer-large #2

diamond-small #1
diamond-small #2

diamond-medium #1
diamond-medium #2

diamond-large #1
diamond-large #2

mark-none #1
mark-none #2

Bullet Characters Defined in Texinfo ¶

Texinfo character @bullet ( • )
   texi-to-HTML converter outputs ’&bull;’ U+2022
Texinfo character @textdegree ( ° )
   texi-to-HTML converter outputs ’&deg;’ U+00B0
Texinfo character @minus ( − )
   texi-to-HTML converter outputs U+2212 i.e. Unicode minus
   texi-to-info outputs U+2212 i.e. Unicode minus

Useful Character Codes ¶

=bi= UNICODE	EXAMPLE	HTML(hex)	DESCRIPTION
U+25CF	( ● )	●	black-circle
U+26AB	( ⚫ )	⚫	medium-black-circle
U+2022	( • )	•	medium-small-black-circle
U+2219	( ∙ )	∙	bullet-operator (math)
U+25CB	( ○ )	○	white-circle
U+26AA	( ⚪ )	⚪	medium-white-circle
U+26AC	( ⚬ )	⚬	medium-small-white-circle
U+25E6	( ◦ )	◦	white-bullet
U+25A0	( ■ )	■	black-square
U+25FC	( ◼ )	◼	black-medium-square
U+25FE	( ◾ )	◾	black-medium-small-square
U+25AA	( ▪ )	▪	black-small-square

Previous: Special Tests C, Up: TexInfo Source To HTML List Output Test [Contents][Index]

Index ¶

Jump to:	C D E F I M N Q V

C
	Index Entry	Section

	cartouche	Special Tests C

D
	display block	Special Tests A
	display block	Special Tests B

E
	enumerated lists	Enumerated Lists
	example block	Special Tests B
	example block	Special Tests C
	exampleindent	Special Tests C

F
	format block	Special Tests A

I
	indentedblock	Special Tests B
	indentedblock	Special Tests C
	itemized lists	Itemized Lists

M
	main menu	Top

N
	nested enumerations	Special Tests A
	nested itemizations	Special Tests A

Q
	quotation block	Special Tests B
	quotation block	Special Tests C
	quotation block	Special Tests C

V
	verbatim block	Special Tests B

TexInfo Source To HTML List Output Test ¶

Table of Contents

Itemized Lists ¶

List Types Directly Supported by the Makeinfo Engine

@itemize with no argument (defaults to '@bullet')

@itemize with '@bullet' argument

@itemize with '@textdegree' argument (U+00B0)

@itemize with '@minus' argument

@itemize with the 'no-bullet' argument encoded as: '@w{}'

Additional List Types Supported Infodoc CSS Classes

Smaller and Larger Font Size ¶

Infodoc Bullet Characters ¶

Nested Lists Under Direct Browser Control

Enumerated Lists ¶

Enumerate command without argument ¶

Enumerate command with numeric argument ¶

Enumerate command with non-default numeric argument (24) ¶

Enumerate command with lower-case alpha argument ¶

Enumerate command with upper-case alpha argument ¶

Enumerate command with non-default alpha argument (’S’) ¶

Enumerate command with descending numeric sequence (10->0) ¶

Enumerate commands with extended definition arguments ¶

Smaller and Larger Font Size ¶

Direct HTML markup passed through converter ¶

Special Tests A ¶

@enumerate nested within @enumerate ¶

Blocks Inside Lists ¶

@itemize nested within @enumerate ¶

@itemize nested within @itemize ¶

@enumerate nested within @itemize ¶

Deeply Nested Lists ¶

Special Tests B ¶

Quotation Block with ’author’ Attached ¶

Lists Inside Blocks ¶

@indentedblock ¶

@display block ¶

Here is the HTML markup generated for this mess: ¶

Here is the post-processed version of the same code: ¶

@example block ¶

Special Tests C ¶

Blocks Inside Blocks ¶

@indentedblock within @indentedblock block ¶

@example within @indentedblock block ¶

Simple @quotation block with @author ¶

@quotation block within @indentedblock ¶

@indentedblock within @quotation block ¶

The Cartouche ¶

Bullet Characters ¶

Bullet Characters Defined in Texinfo ¶

Useful Character Codes ¶

Index ¶

Additional List Types Supported `Infodoc` CSS Classes