jonathantneal/README.md

## README.md

      
    Raw
  

              README.md
            
          
    #Marking up Headings on the Web

Headline - A large, succinct phrase at the top of an article or page to attract readers and indicate the nature of an accompanied article.
<h1 class="headline">Headline</h1>
<h1 class="headline">Bankers Promise Not to Steal Next Time</h1>
.headline {
	display: block;
	font-size: 200%;
	font-weight: bold;
}
Kicker - A smaller, succinct phrase set above the headline, serving as an introduction or section heading to identify a regular column or to classify an article.
<subline class="kicker">Kicker</subline>
<h1 class="headline">Headline</h1>
<subline class="kicker">Scarlet Fever</subline>
<h1 class="headline">World ready for &lsquo;Gone with the Wind&rsquo; sequel</h1>
.kicker {
	display: block;
	font-size: 100%;
	font-weight: bold;
	text-decoration: underline;
	text-transform: uppercase;
}
Hammer - A larger, succinct phrase set above the headline, serving to attract attention to a major article.
<subline class="hammer">Hammer</subline>
<h1 class="headline">Headline</h1>
<subline class="hammer">War</subline>
<h1 class="headline">Casino Debuts New Game</h1>
.hammer {
	display: block;
	font-size: 300%;
	font-weight: bold;
}
Slammer - A larger, succinct phrase set before the headline, serving to attract attention to a major article.
<subline class="slammer">Slammer</subline>
<h1 class="headline">Headline</h1>
.slammer {
	display: inline-block;
	font-size: 300%;
	font-weight: bold;
}

.slammer + .headline {
	display: inline-block;
}
Deck - A smaller, succinct phrase or paragraph, expanding the headline or summarizing the topic.
<h1 class="headline">Headline</h1>
<subline class="deck">Deck</subline>
<h1 class="headline">Rather signs off for last time</h1>
<subline class="deck">After 124 years as anchor, veteran steps down at CBS</subline>
.deck {
	display: block;
	font-size: 150%;
}
Byline - A smaller, succinct phrase or paragraph identifying the author of the article.
<h1 class="headline">Headline</h1>
<subline class="byline">Byline</subline>
<h1 class="headline">President Proves Awesomeness Again</h1>
<subline class="byline">By B. H. Obama</subline>
.byline {
	display: block;
	font-size: 100%;
}
Subhead - A smaller, succinct headline within the article, serving to divide the article into smaller sections.
<h1 class="headline">Headline</h1>
<p>Content regarding the headline...</p>

<h2 class="subhead">Subhead</h2>
<p>Content regarding the headline in context of the subhead...</p>
<h1 class="headline">Lawn Mowers on Sale</h1>
<p>It would appear that weed is no longer an issue for...</p>

<h2 class="subhead">Remote-Controls and Artificial Intelligence</h2>
<p>Setting up a CRON job for a lawn job is as easy as...</p>

<h2 class="subhead">Selecting the Best Lawn Mower</h2>
<p>While Craftsman and Google are the two most widely...</p>
.subhead {
	display: block;
	font-size: 150%;
	font-weight: bold;
}