See below for samples of the CSS, HTML, and XML code used in The Book of Margery Kempe.
CSS
@font-face Rule (for Embedding Fonts within Web Pages)With a manuscript with as many "special characters" and abbreviations as The Book of Margery Kempe, "font‐embedding" is all but imperative. Accordingly, one of the first challenges to be tackled by our project team was font‐embedding—that is a mechanism through which a specialized font used in the construction of a Web page is provided automatically, invisibly, and directly to visitors' Web browsers so that the text on that page renders completely. To that end, our team, after selecting a font suitable for our project, worked to adapt the @font-face cascading style sheet (CSS) rule syntactically for support by the five major Web browsers.
The result is seen the code below, which has been tested extensively and confirmed to work in Chrome, Firefox, Internet Explorer, Opera, and Safari. For ease of reference, it has been color‐coded on this page to match the colors used by popoular Web design software in validating CSS. Accordingly, should you wish to copy the code for use as a model in your own project, you should do so directly from this page and not from this page's source, which is written in HTML.
Should you choose to use the code as a model in your own project, we ask only that, as a courtesy (both to us and to others who might encounter the code), you not remove the first two lines, which specify its origin and required syntax.
To learn more about the Andron Scriptor Web font embedded by our project and referenced below, click here.
To learn more about why this project embeds fonts, click here.
/* Cross-browser support REQUIRES that 1) the style sheet containing the @font-face rule(s), 2) the font(s) referenced by the rule(s), and 3) the Web page(s) that will use them share the SAME folder. */
@font-face {
font-family: Andron;
src: url('andron_scriptor_web_3_1.eot'); /* Embedded Font Type REQUIRED by IE8 */
}
@font-face {
font-family: Andron;
src: url('andron_scriptor_web_3_1.woff'); /* Embedded Font Type Used by Other Browsers */
}
.medieval {
font-family: Andron;
}
