top of page

How to Build a Website: Part IV—HTML Starter Code; HTML <p>, <a>, <br>, and <hr> tags; Style Tags

This section is the beginning of the discussion of HTML.


The default HTML document will begin with starter code, which sets up the document for being displayed. The bare minimum is something like this:

<!DOCTYPE html> <!-- declares the document type -->

<html>

<head>

<!-- The head contains links to external resources and metadata, such as linking to a CSS sheet or declaring the character set. -->

<meta charset="UTF-8"> <!-- defines the document's character set; defaults to "UTF -8"-->

<title>Page Title</title> <!--The document title; displayed as the tab name-->

</head>

<body>

<!-- This area begins the code actually displayed on the page -->

</body>

</html>


The HTML <p> tag is the basic text element. It holds a section of plain text:

<p>Hello World</p>. <p> tags are the main element used to display text on the page. They can be stylized by using classes or the style="" attribute.

The <a> tag defines a link. The required attribute, href="", defines the link target:

<a href="http://www.minecaptain.com">My site!</a>. An <a> tag displays, by default, blue underlined text. The href="" attribute can also target an element on the page:

<a href="#bottom">Go to the footer</a>

––––––––––––––––

<footer id="bottom">The Bottom</footer>


The <br> element is a self-closing tag that signals a page break, or the equivalent of pressing enter in Word. The <hr> element displays a thin line to visually divide content.

Style tags are HTML tags that apply styling effects. They include <strong>, <u>, and <em>. The <strong> tag makes text bold. The <em> tag makes italics, and the <u> tag underlines text. These tags are often nested inside other elements:

<p><strong>Bold text</strong></p>

<button class="abuseReportLink buttonLink"><u>ReportAbuse</u></button>

Rather than use a <strong> tag inside of a paragraph eement, HTML involves the <h1-6> elements. <h1> displays large bold text, while <h6> displays small bold text.

HTML comments are blocks of code marked out so as not to be displayed by the browser. Comments are signaled by the <!-- --> tag:

<p>Text</p>

<!--<p>This text will not be displayed</p>-->

<p>More Text</p>

The above code will output:


Text


More Text


The comment essentially 'marked out' the unwanted code.


This was another short post, but it's all for now!


__RESOURCES__

http://www.minecaptain.com—This isn't really a resource, but it is one of the only places to contact me.

A blank HTML starter file— will be linked to in every post.

I am so sneaky! TRY to find the MYSTERIOUS THING now!


14 views0 comments

Recent Posts

See All

Comentários


Post: Blog2_Post
bottom of page