Skip to content
This repository has been archived by the owner on Nov 11, 2019. It is now read-only.

Commit

Permalink
Fix syntax highlighting (hopefully)
Browse files Browse the repository at this point in the history 
fix #65

make `pre` elements `class="html"` and they seem to be reliably
highlighted (and wrap if necessary)
  • Loading branch information
chaals committed Jul 4, 2017
1 parent eb68a65 commit 04609d0
Showing 1 changed file with 33 additions and 33 deletions.
66 changes: 33 additions & 33 deletions index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -145,7 +145,7 @@ <h2>Terminology</h2>
characters" or "return false and abort these steps") are to be interpreted with the meaning of the
key word ("must", "should", "may", etc) used in introducing the algorithm.</p>

<div class="example">
<aside class="example" title="conformance language">

<p>For example, were the spec to say:</p>

Expand All @@ -166,7 +166,7 @@ <h2>Terminology</h2>
<p>The former (imperative) style is generally preferred in this specification for stylistic
reasons.</p>

</div>
</aside>

<p>Conformance requirements phrased as algorithms or specific steps may be implemented in any
manner, so long as the end result is equivalent. (In particular, the algorithms defined in this
Expand Down Expand Up @@ -234,7 +234,7 @@ <h3>The basic syntax</h3>

<p>Here there are two items, each of which has the property "name":</p>

<pre>&lt;div itemscope&gt;
<pre class="html">&lt;div itemscope&gt;
&lt;p&gt;My name is
&lt;span itemprop="name"&gt;Elizabeth&lt;/span&gt;.&lt;/p&gt;
&lt;/div&gt;
Expand Down Expand Up @@ -287,7 +287,7 @@ <h3>The basic syntax</h3>
<p>These two examples are exactly equivalent, at a Microdata level, as the previous two examples
respectively:</p>

<pre>&lt;div itemscope&gt;
<pre class="html">&lt;div itemscope&gt;
&lt;p&gt;My &lt;em&gt;name&lt;/em&gt; is
&lt;span itemprop="name"&gt;E&lt;strong&gt;liz&lt;/strong&gt;abeth&lt;/span&gt;.&lt;/p&gt;
&lt;/div&gt;
Expand All @@ -312,7 +312,7 @@ <h3>The basic syntax</h3>

<p>Here the item has three properties:</p>

<pre>&lt;div itemscope&gt;
<pre class="html">&lt;div itemscope&gt;
&lt;p&gt;My name is &lt;span itemprop="name"&gt;Neil&lt;/span&gt;.&lt;/p&gt;
&lt;p&gt;My band is called &lt;span itemprop="band"&gt;Four Parts Water&lt;/span&gt;.&lt;/p&gt;
&lt;p&gt;I am &lt;span itemprop="nationality"&gt;British&lt;/span&gt;.&lt;/p&gt;
Expand All @@ -330,7 +330,7 @@ <h3>The basic syntax</h3>
A Microdata processor can extract the content from the <a>content</a> attribute without running scripts.
The value of the <var>product-id</var> property for this item is <samp>9678AOU879</samp></p>

<pre>&lt;li itemscope&gt;
<pre class="html">&lt;li itemscope&gt;
&lt;span itemprop="product-id" content="9678AOU879"
class="reference--id_code-autoinsert"&gt;&lt;/span&gt;
&lt;/li&gt;</pre>
Expand All @@ -348,15 +348,15 @@ <h3>The basic syntax</h3>
of the <code>data</code> element, and the product's name is used as the text content of the element
that is rendered on the page.</p>

<pre>&lt;h1 itemscope&gt;
<pre class="html">&lt;h1 itemscope&gt;
&lt;data itemprop="product-id" value="9678AOU879"&gt;The Instigator 2000&lt;/data&gt;
&lt;/h1&gt;</pre>

<p class="warning">This will not work if there is a <a>content</a> attribute as well. In the following example,
the value of the <var>product-id</var> property is taken from the <a>content</a> attribute, so it will be
<samp>This one rocks!</samp>:</p>

<pre>&lt;h1 itemscope&gt;
<pre class="html">&lt;h1 itemscope&gt;
&lt;data itemprop="product-id" value="9678AOU879"
content="This one rocks!"&gt;The Instigator 2000&lt;/data&gt;
&lt;/h1&gt;</pre>
Expand All @@ -372,15 +372,15 @@ <h3>The basic syntax</h3>

<p>In this example, the item has one property, <var>logo</var>, whose value is a URL based on the location of the page, and ending with <samp>our-logo.png</samp>:</p>

<pre>&lt;div itemscope itemtype="https://schema.org/LocalBusiness"&gt;
<pre class="html">&lt;div itemscope itemtype="https://schema.org/LocalBusiness"&gt;
&lt;img itemprop="logo" src="our-logo.png" alt="Our Company"&gt;
&lt;/div&gt;</pre>

<p class="warning">Note that accessibility information, such as the <code>alt</code> attribute in the previous example,
is ignored. To provide that as a value, repeat it in a <a>content</a> attribute. In the following example, the value
of the <var>name</var> property is <samp>The Company</samp>:</p>

<pre>&lt;div itemscope itemtype="https://schema.org/LocalBusiness"&gt;
<pre class="html">&lt;div itemscope itemtype="https://schema.org/LocalBusiness"&gt;
&lt;img itemprop="name" src="our-logo.png"
content="The Company" alt="Our Company"&gt;
&lt;/div&gt;</pre>
Expand All @@ -394,7 +394,7 @@ <h3>The basic syntax</h3>

<p>Here a rating of <samp>3.5</samp> is given using a <code>meter</code> element.</p>

<pre>&lt;div itemscope itemtype="https://schema.org/Product"&gt;
<pre class="html">&lt;div itemscope itemtype="https://schema.org/Product"&gt;
&lt;span itemprop="name"&gt;Panasonic White 60L Refrigerator&lt;/span&gt;
&lt;img src="panasonic-fridge-60l-white.jpg" alt=""&gt;
&lt;div itemprop="aggregateRating"
Expand All @@ -414,7 +414,7 @@ <h3>The basic syntax</h3>

<p>In this example, the item has one property, "birthday", whose value is a date:</p>

<pre>&lt;div itemscope&gt;
<pre class="html">&lt;div itemscope&gt;
I was born on &lt;time itemprop="birthday" datetime="2009-05-10"&gt;May 10th 2009&lt;/time&gt;.
&lt;/div&gt;</pre>

Expand All @@ -430,7 +430,7 @@ <h3>The basic syntax</h3>

<p>In this example, the outer item represents a person, and the inner one represents a band:</p>

<pre>&lt;div itemscope&gt;
<pre class="html">&lt;div itemscope&gt;
&lt;p&gt;Name: &lt;span itemprop="name"&gt;Amanda&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;Band: &lt;span itemprop="band" itemscope&gt; &lt;span itemprop="name"&gt;Jazz Band&lt;/span&gt; (&lt;span itemprop="size"&gt;12&lt;/span&gt; players)&lt;/span&gt;&lt;/p&gt;
&lt;/div&gt;</pre>
Expand All @@ -455,7 +455,7 @@ <h3>The basic syntax</h3>
<p>This example is the same as the previous one, but all the properties are separated from their
<a data-lt="concept item">items</a>:</p>

<pre>&lt;div itemscope id="amanda" itemref="a b"&gt;&lt;/div&gt;
<pre class="html">&lt;div itemscope id="amanda" itemref="a b"&gt;&lt;/div&gt;
&lt;p id="a"&gt;Name: &lt;span itemprop="name"&gt;Amanda&lt;/span&gt;&lt;/p&gt;
&lt;div id="b" itemprop="band" itemscope itemref="c"&gt;&lt;/div&gt;
&lt;div id="c"&gt;
Expand All @@ -476,7 +476,7 @@ <h3>The basic syntax</h3>

<p>This example describes an ice cream, with two flavors:</p>

<pre>&lt;div itemscope&gt;
<pre class="html">&lt;div itemscope&gt;
&lt;p&gt;Flavors in my favorite ice cream:&lt;/p&gt;
&lt;ul&gt;
&lt;li itemprop="flavor"&gt;Lemon sorbet&lt;/li&gt;
Expand All @@ -497,7 +497,7 @@ <h3>The basic syntax</h3>
<p>Here we see an item with two properties, "favorite-color" and "favorite-fruit", both set to
the value "orange":</p>

<pre>&lt;div itemscope&gt;
<pre class="html">&lt;div itemscope&gt;
&lt;span itemprop="favorite-color favorite-fruit"&gt;orange&lt;/span&gt;
&lt;/div&gt;</pre>

Expand All @@ -510,13 +510,13 @@ <h3>The basic syntax</h3>

<p>The following two examples are exactly the same Microdata, because they produce exactly the same information when processed:</p>

<pre>&lt;figure&gt;
<pre class="html">&lt;figure&gt;
&lt;img src="castle.jpeg"&gt;
&lt;figcaption&gt;&lt;span itemscope&gt;&lt;span
itemprop="name"&gt;The Castle&lt;/span&gt;&lt;/span&gt; (1986)&lt;/figcaption&gt;
&lt;/figure&gt;</pre>

<pre>&lt;span itemscope&gt;&lt;meta itemprop="name"
<pre class="html">&lt;span itemscope&gt;&lt;meta itemprop="name"
content="The Castle"&gt;&lt;/span&gt;
&lt;figure&gt;
&lt;img src="castle.jpeg"&gt;
Expand Down Expand Up @@ -551,7 +551,7 @@ <h3>Typed items</h3>

<p>Assuming a page at http://example.net/some/dataexample contains the following code:</p>

<pre>&lt;section itemscope itemtype="http://example.org/animals#cat"&gt;
<pre class="html">&lt;section itemscope itemtype="http://example.org/animals#cat"&gt;
&lt;h1 itemprop="name"&gt;Hedral&lt;/h1&gt;
&lt;p itemprop="desc"&gt;Hedral is a male american domestic
shorthair, with a fluffy black fur with white paws and belly.&lt;/p&gt;
Expand Down Expand Up @@ -601,7 +601,7 @@ <h3>Global identifiers for items</h3>

<p>Here, an item is talking about a particular book:</p>

<pre>&lt;dl itemscope
<pre class="html">&lt;dl itemscope
itemtype="http://vocab.example.net/book"
<strong>itemid="urn:isbn:0-330-34032-8"</strong>&gt;
&lt;dt&gt;Title
Expand Down Expand Up @@ -651,7 +651,7 @@ <h3>Selecting names when defining vocabularies</h3>
and most of the properties have names defined in the context of that type.
There are also a few additional properties whose names come from other vocabularies.</p>

<pre>&lt;section itemscope itemtype="http://myvocab.example.org/animals/cat"&gt;
<pre class="html">&lt;section itemscope itemtype="http://myvocab.example.org/animals/cat"&gt;
&lt;h1 itemprop="name http://example.com/fn"&gt;Hedral&lt;/h1&gt;
&lt;p itemprop="desc"&gt;Hedral is a male american domestic
shorthair, with a fluffy &lt;span
Expand Down Expand Up @@ -835,7 +835,7 @@ <h3>Items: <a>itemscope</a>, <a>itemtype</a>, and <a>itemid</a></h3>

<p>Thus, a locomotive might be marked up as:</p>

<pre>&lt;dl itemscope itemtype="http://md.example.com/loco
<pre class="html">&lt;dl itemscope itemtype="http://md.example.com/loco
http://md.example.com/lighting"&gt;
&lt;dt&gt;Name:
&lt;dd itemprop="name"&gt;Tank Locomotive (DB 80)
Expand All @@ -849,7 +849,7 @@ <h3>Items: <a>itemscope</a>, <a>itemtype</a>, and <a>itemid</a></h3>

<p>A turnout lantern retrofit kit might be marked up as:</p>

<pre>&lt;dl itemscope itemtype="http://md.example.com/track
<pre class="html">&lt;dl itemscope itemtype="http://md.example.com/track
http://md.example.com/lighting"&gt;
&lt;dt&gt;Name:
&lt;dd itemprop="name"&gt;Turnout Lantern Kit
Expand All @@ -862,7 +862,7 @@ <h3>Items: <a>itemscope</a>, <a>itemtype</a>, and <a>itemid</a></h3>

<p>A passenger car with no lighting might be marked up as:</p>

<pre>&lt;dl itemscope itemtype="http://md.example.com/passengers"&gt;
<pre class="html">&lt;dl itemscope itemtype="http://md.example.com/passengers"&gt;
&lt;dt&gt;Name:
&lt;dd itemprop="name"&gt;Express Train Passenger Car (DB Am 203)
&lt;dt&gt;Product code:
Expand Down Expand Up @@ -929,23 +929,23 @@ <h3>Properties: the <dfn data-lt="attr-itemprop"><code>itemprop</code></dfn> and
<p>In the following example, the "a" property has the values "1" and "2", <em>in that order</em>,
but whether the "a" property comes before the "b" property or not is not important:</p>

<pre>&lt;div itemscope&gt;
<pre class="html">&lt;div itemscope&gt;
&lt;p itemprop="a"&gt;1&lt;/p&gt;
&lt;p itemprop="a"&gt;2&lt;/p&gt;
&lt;p itemprop="b"&gt;test&lt;/p&gt;
&lt;/div&gt;</pre>

<p>Thus, the following is equivalent:</p>

<pre>&lt;div itemscope&gt;
<pre class="html">&lt;div itemscope&gt;
&lt;p itemprop="b"&gt;test&lt;/p&gt;
&lt;p itemprop="a"&gt;1&lt;/p&gt;
&lt;p itemprop="a"&gt;2&lt;/p&gt;
&lt;/div&gt;</pre>

<p>As is the following:</p>

<pre>&lt;div itemscope&gt;
<pre class="html">&lt;div itemscope&gt;
&lt;p itemprop="a"&gt;1&lt;/p&gt;
&lt;p itemprop="b"&gt;test&lt;/p&gt;
&lt;p itemprop="a"&gt;2&lt;/p&gt;
Expand All @@ -970,15 +970,15 @@ <h3>Properties: the <dfn data-lt="attr-itemprop"><code>itemprop</code></dfn> and

<p>The preceding example:</p>

<pre>&lt;div itemscope&gt;
<pre class="html">&lt;div itemscope&gt;
&lt;p itemprop="a"&gt;1&lt;/p&gt;
&lt;p itemprop="a"&gt;2&lt;/p&gt;
&lt;p itemprop="b"&gt;test&lt;/p&gt;
&lt;/div&gt;</pre>

<p>Could also be written as follows:</p>

<pre>&lt;div id="x"&gt;
<pre class="html">&lt;div id="x"&gt;
&lt;p itemprop="a"&gt;1&lt;/p&gt;
&lt;/div&gt;
&lt;div itemscope itemref="x"&gt;
Expand All @@ -997,9 +997,9 @@ <h3>Properties: the <dfn data-lt="attr-itemprop"><code>itemprop</code></dfn> and

<p>For the following code:</p>

<pre><code>&lt;div itemscope itemtype="http://example.com/a" itemref="x"&gt;&lt;/div&gt;
<pre class="html">&lt;div itemscope itemtype="http://example.com/a" itemref="x"&gt;&lt;/div&gt;
&lt;div itemscope itemtype="http://example.com/b" itemref="x"&gt;&lt;/div&gt;
&lt;meta id="x" itemprop="z" content=""&gt;</code></pre>
&lt;meta id="x" itemprop="z" content=""&gt;</pre>

<p>The author should be certain that <samp>z</samp> is a valid property name for both the
http://example.com/a and http://example.com/b vocabularies.</p>
Expand Down Expand Up @@ -1182,7 +1182,7 @@ <h3>Associating names with items</h3>
<p>In this example, a single license statement is applied to two works, using
<code><a>itemref</a></code> from the items representing the works:</p>

<pre>&lt;!DOCTYPE HTML&gt;
<pre class="html">&lt;!DOCTYPE HTML&gt;
&lt;html&gt;
&lt;head&gt;
&lt;title&gt;Photo gallery&lt;/title&gt;
Expand Down Expand Up @@ -1341,7 +1341,7 @@ <h3>JSON</h3>

<p>For example, take this markup:</p>

<pre>&lt;!DOCTYPE HTML&gt;
<pre class="html">&lt;!DOCTYPE HTML&gt;
&lt;title&gt;My Blog&lt;/title&gt;
&lt;article itemscope itemtype="https://schema.org/BlogPosting"&gt;
&lt;header&gt;
Expand Down

0 comments on commit 04609d0

Please sign in to comment.