Shorthand Examples
(These examples use the terms from the project glossary).
Simple cases
Shorthand starts with an HTML element name
It the simplest case, the shorthand is just the HTML element
name, without attributes or properties, followed by the contents
of the element.
q quotation
<q>quotation</q>
Attributes are suffixed to shorthand with a dot
One or more attributes can be added to the element name in the
fluent dot-attached naming style.
h3.id=hidden_head.hidden Hidden Sub-subtitle
<h3 id='hidden_head' hidden>Hidden Sub-subtitle</h3>
The ID attribute has a special shorthand
The ID attribute can be joined to the element name with a single
hash. If the ID should contain a hash, then it must be
specified with the .id=#ex
notation (because multiple hashes
can be confused for href or src shorthand
described below).
h1#intro-title Chapter [incr chap]: Introduction
h2#$chap.1 Section 1
h3#$chap.1.1 Subsection 1.1
h4#$chap.1.1.a Ooops! not what I want
h4#$chap.1.1..a Paragraph 1.1.a
<h1 id='intro-title'>Chapter 1: Introduction</h1>
<h2 id='1'>Section 1</h2>
<h3 id='1.1'>Subsection 1.1</h3>
<h4 id='1.1' a>Ooops! not what I want</h4>
<h4 id='1.1.a'>Paragraph 1.1.a</h4>
Note that a data-dot that does not precede a digit must be doubled, as demonstrated in the last line of the preceding
example shorthand and expansion.
In HTML the first value associated with an attribute name is
used, later values are redundant.
hr#first.id=second.id=third
<hr id='first'/>
The class attribute also has a special shorthand
The class attribute can be joined to the element name with an
equals sign; ID shorthand cannot come before the class shorthand,
but it can come afterwards.
hr=fatrule.id=r1
hr=thinrule#r2
<hr class='fatrule' id='r1'/>
<hr class='thinrule' id='r2'/>
- CSS properties can be written in shorthand
h3.color:green.bgcolor:black {$ echo "hello, world!"}
In CSS the last value associated with a property is used,<h3 style='color: green; bgcolor: black'>$ echo "hello, world!"</h3>
earlier values are redundant.h1.color:blue.color:green Greetings!
## Special cases ### cite The special cite-notation applies to the elements<h1 style='color: green'>Greetings!</h1>
blockquote
,
del
,ins
andq
. Read about the more common
href-notation and substitutecite=
forhref=
. ### href Because several elements take an href attribute, and because we
expect them to be written frequently in hypertext, there is a
special, optional shorthand for element taking an href attribute.
Shorthand with two or more hashes attached to the elementsa
(anchor),area
,base
, andlink
expands to ID (if present)
and href attributes.a#uid#url#fragment a#uid#url a#uid##fragment a##url#fragment a##url a###fragment
### src The special src-notation applies to the elements<a id='uid' href='url#fragment'> <a id='uid' href='url'> <a id='uid' href='#fragment'> <a href='url#fragment'> <a href='url> <a href='#fragment'>
audio
,
embed
,iframe
,img
,input
,script
,source
,track
,
andvideo
elements. Read about the more common
href-notation and substitutesrc=
forhref=
. ## Rare cases ### Shorthand can end with a dotq. another quotation
The dot is useful when an element name is the same as that of a<q>another quotation</q>
Tcl command.set. [set message "Hello, world!"]
### Void-element shorthand element names can end with a slash<set>Hello, world!</set>
hr/
The slash is useful when the element name is the same as that of<hr/>
a Tcl command.source/
<source/>