Try these two elements for basic text formatting.
Paragraphs:
<p>Hello World!</p>
Line breaks:
A single <br> line break.
Headings are headlines or subheadlines you want to display on a webpage.They come in six available sizes:
<h1>Heading size 1</h1>
<h2>Heading size 2</h2>
...
<h6>Heading size 6</h6>
Lists allow you to group a set of related items together. Lists can either be ordered or unordered.
Ordered Lists:
<ol>
<li>First Item</li>
<li>Second Item</li>
<li>Third Item</li>
</ol>
You can use the list type attribute to change the numbers to uppercase letters, lowercase letters, uppercase roman numerals, or lowercase roman numerals. Try using one of these:
<ol type="A">
<ol type="a">
<ol type="I">
<ol type="i">
Unordered Lists:
<ul>
<li>Item</li>
<li>Item</li>
<li>Item</li>
</ul>
The blockquote element will indent content by adding some margin to the left and right sides. Typically, blockquote is used to indicate the quotation of a section of text from another source (e.g a pull quote in a story).
<blockquote>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer libero sem, ultrices et viverra quis, ornare vitae ex. Aliquam mollis viverra est sed rhoncus.
</blockquote>
First, be sure you create a subfolder within your project folder that will contain your image files (call it "images"). Keep folder names lowercase and do not use spaces. Then, save your image(s) into that subfolder. The most common image file types supported on the web are .jpg, .png, .gif, and .webp (though this last one is less common). Your image filenames should follow the same guidelines — no spaces and keep them lowercase.
Images are defined with the <img> tag. The <img> tag is an “empty element”, which means that it contains attributes only, and has no closing tag. There are two required attributes for images: src and alt.
<img src="images/logo.jpg" alt="Google logo">
Check out the video to see the entire process of saving an image to a folder and creating the HTML along with some additional attributes.
The <a> (or anchor) is the element that marks the beginning and/or the end of a hypertext link. The most important attribute of the <a> element is the href attribute, which indicates the link’s destination.
<a href="http://www.espn.com">Go to ESPN</a>
When you are linking to a page on a site other than the one you are currently on this is called an absolute link. You should open absolute links in a new browser tab by using the target attribute:
<a href="http://www.espn.com" target="new">Go to ESPN</a>
When you are linking to a page on the same site this is called a relative link. The syntax is the same as an absolute link but you do not not the full page url or the target attribute:
<a href="about.html">About Us</a>
You may have noticed that some HTML elements create new lines when you use them while others do not. Every HTML element has a default display value, depending on what type of element it is. There are two display values: block and inline.
Block-level elements always start on a new line and take up the full width/space available (stretches out to the left and right as far as it can). Examples: <h1> <p> <li>
Inline elements do not start on a new line and they only take up as much width as necessary. Examples: <a> <img>
You will learn how to change the element display value in CSS.