Building the User Interface by Using HTML5: Text, Graphics ... - server

24 | Lesson 2Figure 2-1A hyperlink is the result ofthe anchor element using thehref attributeLICENSED PRODUCT NOT FOR RESALETwo of the most common uses of attributes are to create hyperlinks and to insert simplegraphics. You’ll learn how to work with graphics later in this lesson. HTML5 includes severalglobal attributes, which you can use with any HTML5 element. Examples of global attributesinclude id, lang, and class, among many others.NESTING ELEMENTSHow a Web browser displays your HTML depends on the way you combine elements, theirattributes (if any), and content. When two or more elements apply to the same block of text,you should nest tag pairs appropriately so that they do what you intended. Nesting means toplace one element inside another. Here’s an example of correct nesting:Make sure your pet has plenty of fresh waterduring hot weather.In this case, we want the words “fresh water” to stand out so they are italicized and bolded byusing the and tags. If you placed the end tag after the end tag (shownbelow), the words “fresh water during hot weather” would appear bold but only “fresh water”would be italicized. It would look awkward, as shown in Figure 2-2.Make sure your pet has plenty of fresh waterduring hot weather.Figure 2-2Incorrectly nesting tagsThe rule for nesting is that nested tags must be closed before their parent tags. Looking backat the correct example, notice that the paragraph element opens first, followed by the italicelement, and then the font element. Then the bold element closes, followed by the italic element,and finally the paragraph element. The italic and bold elements are completely nestedwithin the paragraph element.UNDERSTANDING ENTITIESAn entity is a special character, such as the dollar symbol, the registered trademark (a capitalR within a circle), and accented letters. The process of incorporating entities in a Web page is