Thursday, January 29, 2015

Emphasis in HTML and CSS

This is really a very simple matter, but perhaps one that will be helpful to other people. In working on reading notes for one of my classes, I have wanted to insert questions for the students to think about. The questions are indented and in italics, so that they stand out:
P.question {
 margin-left: 1em;
 margin-right: 1em;
 font-style: italic;
}
The downside to this is that emphasis doesn't work right. So if I write:
<p class="question">In Russell's reply (which you do not <em>have</em> to read)...</p>
the emphasis has no effect. A kludge would be to use bold, instead, which is what I want there, but then what if I copy it elsewhere? Then I have to change it again. A better solution is to use CSS to style it appropriately:
P.question em {
 font-weight: bold;
}
I am guessing that one could use similar techniques to make emphasis inside emphasis work properly.

No comments:

Post a Comment

Comments welcome, but they are expected to be civil.
Please don't bother spamming me. I'm only going to delete it.