What Does HTML Look Like with Examples

HTML is made up of a series of elements, which are represented by tags. These tags are surrounded by angle brackets and are used to define different parts of a web page.

A basic HTML document starts with the doctype declaration, which tells the browser that the document is written in HTML. This is followed by the html tag, which contains all the other tags.

The head tag contains metadata about the document, such as the title and character encoding. The title tag is displayed in the browser's title bar and is also used by search engines as the title of the page in their results.

The body tag contains the content of the web page, which is made up of various elements such as headings, paragraphs, and links.

Expand your knowledge: Is Html Still Used

You can change the look of your website with a style sheet, which is like adding a layer of presentation onto the structure created with your markup. This is done using Cascading Style Sheets (CSS), which will be covered in more detail later.

A style element is used to apply a style sheet to the page, and it's placed inside the head of the document. The style element is added to the document, and style rules are typed within it.

You can use the style element to change the appearance of text elements and the page background. For example, you can set the background color to #faf2e4 and the font family to sans-serif. You can also specify the font size, color, and alignment for specific elements, such as headings.

Here's an example of a simple style sheet that changes the appearance of the Black Goose Bistro home page:

Non-Replaced Elements are the foundation of most web content. They're the basic building blocks that make up the structure of your website.

Non-Replaced elements have opening and closing tags that surround them, which can turn a phrase or image into a hyperlink. This is a simple yet powerful way to add interactivity to your content.

You might enjoy: Html Non Breaking Hyphen

These elements may include text and other tags as sub-elements, allowing you to create complex and nuanced content. For example, a paragraph can contain multiple sentences and even other elements like images or links.

Non-Replaced elements can also be used to give emphasis to words or phrases, making them stand out on the page. This can be particularly useful for drawing attention to important information or creating a sense of hierarchy in your content.

For more insights, see: B Tag Html

Changing the look of your website can make a big difference in how visitors perceive it. You can use Cascading Style Sheets (CSS) to add a personal touch to your website's design.

The Black Goose Bistro home page is a great example of this. The author wants to "pretty up" the page to make a good first impression on potential patrons. To do this, they'll be adding a style sheet to change the appearance of the text elements and the page background.

You can add a style element to the head of your document to apply a style sheet. This is one of the ways to add a style sheet, and it's covered in more detail in Chapter 11.

The style element is placed inside the head of the document, and it's where you'll add your style rules. For example, the Black Goose Bistro page uses the following style rules:

These style rules are added to the style element in the head of the document, and they change the appearance of the page.