Quote:
Originally Posted by paperwhite13
There is one thing I was wondering about - new chapter pages, which are styled like this:
1.
Chapter Title
2.
Chapter Title
Saying I want to keep the number and the dot, which are styled differently (in terms of size, margins and font type) than the Chapter Title, how should that be tagged semantically? Should it also be an <h1 class="chapter-number"> with different properties? Before that, I thought about making it <h4>  |
I also use the method mentioned by others in the previous few posts...
PHP Code:
<h3>Chapter 1</h3>
<p class="chapterh3">Divinity Avenue, Cambridge<br/>18 October, 1:00 p.m.</p>
Which is then styled in the css as...
PHP Code:
h3 {
display: block;
font-size: 1.3em;
font-weight: bold;
font-style: normal;
font-family: "Futura Std Medium", sans-serif;
margin-top: 2em;
margin-bottom: 0;
text-indent: 0;
text-align: left;
/* text-transform: uppercase;
text-decoration: underline;*/
}
.chapterh3 {
display: block;
font-size: 1.2em;
font-weight: bold;
font-style: normal;
font-family: "Futura Std Medium", sans-serif;
margin-top: 1.5em;
margin-bottom: 0;
margin-right: 0;
text-align: left;
text-indent: 0;
/*text-transform: uppercase;*/
/*text-decoration: underline;*/
}
Which then looks like the below image (for the current book I am reading)
Sometimes I will use the title tag to incorporate the chapter name with the chapter number in the TOC, but I didn't think it was necessary in this case, plus it would be too long for the TOC and make it wrap.
And the styling is easy to change with each book.
(note the enlarged first letter
)