In this chapter, we will focus on some helpful topics that are not easily grouped together. You will learn about:
The different versions of HTML and how to indicate which version you are using
How to add comments to your code
Global attributes, which are attributes that can be used on any element, including the class and id attributes
Elements that are used to group together parts of the page where no other element is suitable
How to embed a page within a page using iframes
How to add information about the web page using the element
Adding characters such as angled brackets and copyright symbols
Because there have been several versions of HTML, each web page should begin with a DOCTYPE declaration to tell a browser which version of HTML the page is using (although browsers usually display the page even if it is not included). We will therefore be including one in each example for the rest of the book.
If you want to add a comment to your code that will not be visible in the user’s browser, you can add the text between these characters. It is a good idea to add comments to your code because, no matter how familiar you are with the page at the time of writing it, when you come back to it later (or if someone else needs to look at the code), comments will make it much easier to understand.
Every HTML element can carry the id attribute. It is used to uniquely identify that element from other elements on the page. Its value should start with a letter or an underscore (not a number or any other character). It is important that no two elements on the same page have the same value for their id attributes (otherwise the value is no longer unique). As you will see when you come to look at CSS in the next section, giving an element a unique identity allows you to style it differently than any other instance of the same element on the page. For example, you might want to assign one paragraph within the page (perhaps a paragraph containing a pull quote) a different style than all of the other paragraphs. In the example on the right, the paragraph with the id attribute whose value is pullquote is made uppercase using CSS.
Every HTML element can also carry a class attribute. Sometimes, rather than uniquely identifying one element within a document, you will want a way to identify several elements as being different from the other elements on the page. For example, you might have some paragraphs of text that contain information that is more important than others and want to distinguish these elements, or you might want to differentiate between links that point to other pages on your own site and links that point to external sites.
Some elements will always appear to start on a new line in the browser window. These are known as block level elements.
Some elements will always appear to continue on the same line as their neighbouring elements. These are known as inline elements.
The <div> element allows you to group a set of elements together in one block-level box. For example, you might create a <div> element to contain all of the elements for the header of your site (the logo and the navigation), or you might create a <div> element to contain comments from visitors. In a browser, the contents of the <div> element will start on a new line, but other than this it will make no difference to the presentation of the page.
## HTML5 Layout Ch17
They are covered here (rather than with the other HTML elements you met earlier in the book) because you’ll find it easier to understand how they can be used now that you have seen how CSS can control the layout a page. These new elements are going to play an important part in creating layouts going forward. In this chapter you will see:
for more information https://www.w3schools.com/html/html_layout.asp
In this chapter, we will focus on some helpful topics that are not easily grouped together. You will learn about:
Bought a tennis racquet several years ago; now he wants to purchase one from your site for his girlfriend.
has read about your new doggy daycare service in the press and wants to find out whether it would be suitable for her to use.
had a bad experience staying in a hotel when visiting Sydney, Australia, and wants to make a complaint.
hopes to study architecture and wants to learn more about a new course that is being offered.
is a picture editor and wants to look at a photographer’s site to see## examples of his work before deciding whether to commission him.
The aim is to create a diagram of the pages that will be used to structure the site. This is known as a site map and it will show how those pages can be grouped. To help you decide what information should go on each page, you can use a technique called card sorting. This involves placing each piece of information that a visitor might need to know on a separate piece of paper and then organizing the related information into groups. The aim is to create a diagram of the pages that will be used to structure the site. This is known as a site map and it will show how those pages can be grouped. To help you decide what information should go on each page, you can use a technique called card sorting. This involves placing each piece of information that a visitor might need to know on a separate piece of paper and then organizing the related information into groups.
In this chapter, we will focus on some helpful topics that are not easily grouped together. You will learn about: