HTML and CSS Reference
In-Depth Information
The contents of the
cite
attribute will not be displayed to users but can be used by computer programs. To make
the source more accessible to the user, you could link to it using the
<a>
element that learned about in Chapter 3.
You can also mark up a quotation within a block of text using the
<q>
element. A good example of this would be if
you were writing a news article and wanted to quote an individual, as shown in the following example.
In reaction to the proposed budget cuts, Sam Dawson said
<q>This is crazy, they simply cannot turn off the Internet</q>.
Personally, I agree with Sam's comment.
For a quick recap on how to mark up quotes in your HTML code, check out this video on Treehouse:
ht-
Abbreviations
HTML has a number of elements for marking up key terms, abbreviations, and definitions in your text content.
Using these elements also enables you to use CSS to apply a custom styling to these parts of your text that can be
useful for indicating important terms or abbreviations. In this section, you are going to focus on the
<abbr>
ele-
ment; however, check out Appendix A for information about how to mark up terms and definitions.
The
<abbr>
element can be used to identify abbreviations within your text content. You can also optionally use the
title
attribute to define the full text version of an abbreviation. Most browsers will display this full text version to
a user if she hovers her mouse cursor over the abbreviation for a few seconds.
<p>The <abbr title="World Wide Web Consortium">W3C</abbr> is responsible for de-
veloping web standards.</p>
Using the
<abbr>
element allows computer programs to easily identify abbreviations in your text and understand
what they mean. This contributes to building a smarter web.
Adding the About Page Text
The text on the About page will include both a quotation and an abbreviation, perfect candidates for the new HTML
elements you have just learned about.
For this page, you are going to build on the content page template that you have already created in the
about.html
file.
The code for this exercise can be found in folder 4.
Follow these instructions to add the text content to your About page:
