CSS stands for Cascading Style Sheets.
CSS saves a lot of work. It can control the layout of multiple web pages all at once.
Cascading Style Sheets (CSS) is used to format the layout of a webpage.
With CSS, you can control the color, font, the size of text, the spacing between elements, how elements are positioned and laid out, what background images or background colors are to be used, different displays for different devices and screen sizes, and much more!
HTML colors are specified with predefined color names, or with RGB, HEX, HSL, RGBA, or HSLA values.
In HTML, a color can be specified by using a color name:
See the Pen
Color Names by Iampsp.com (@iampsp)
on CodePen.
HTML comments are not displayed in the browser, but they can help document your HTML source code.
You can add comments to your HTML source by using the following syntax:
<!-- Write your comments here -->
Notice that there is an exclamation point (!) in the start tag, but not in the end tag.
In this chapter we will go through the <blockquote>,<q>, <abbr>, <address>, <cite>, and <bdo> HTML elements.
See the Pen
HTML Quotation and Citation Elements by Iampsp.com (@iampsp)
on CodePen.
HTML contains several elements for defining text with a special meaning.
See the Pen
HTML Text Formatting by Iampsp.com (@iampsp)
on CodePen.
The HTML style attribute is used to add styles to an element, such as color, font, size, and more.
See the Pen
HTML Styles by Iampsp.com (@iampsp)
on CodePen.
A paragraph always starts on a new line, and is usually a block of text.
The HTML <p> element defines a paragraph.
A paragraph always starts on a new line, and browsers automatically add some white space (a margin) before and after a paragraph.
<p>This is a paragraph.</p> <p>This is another paragraph.</p>
HTML headings are titles or subtitles that you want to display on a webpage.
HTML headings are defined with the <h1> to <h6> tags.
<h1> defines the most important heading. <h6> defines the least important heading. Continue reading HTML Headings
HTML attributes provide additional information about HTML elements.
The HTML element is everything from the start tag to the end tag:
Examples of some HTML elements:
| Start tag | Element content | End tag |
|---|---|---|
| <h1> | My First Heading | </h1> |
| <p> | My first paragraph. | </p> |
| <br> | none | none |
HTML elements can be nested (this means that elements can contain other elements).
All HTML documents consist of nested HTML elements.
The following example contains four HTML elements (<html>, <body>, <h1> and <p>):
<!DOCTYPE html> <html> <body> <h1>My First Heading</h1> <p>My first paragraph.</p> </body> </html>
The <html> element is the root element and it defines the whole HTML document.
It has a start tag <html> and an end tag </html>.
Then, inside the <html> element there is a <body> element:
<body> <h1>My First Heading</h1> <p>My first paragraph.</p> </body>
The <body> element defines the document’s body.
It has a start tag <body> and an end tag </body>.
Then, inside the <body> element there are two other elements: <h1> and
<p>
<h1>My First Heading</h1> <p>My first paragraph.</p>
The <h1> element defines a heading.
It has a start tag <h1> and an end tag </h1>:
<h1>My First Heading</h1>
The <p> element defines a paragraph.
It has a start tag <p> and an end tag </p>:
<p>My first paragraph.</p>
Some HTML elements will display correctly, even if you forget the end tag:
<html> <body> <p>This is a paragraph <p>This is a paragraph </body> </html>
However, never rely on this! Unexpected results and errors may occur if you forget the end tag!
HTML elements with no content are called empty elements.
The <br> tag defines a line break, and is an empty element without a closing tag:
<p>This is a <br> paragraph with a line break.</p>
HTML tags are not case sensitive: <P> means the same as <p>.
The HTML standard does not require lowercase tags, but W3C recommends lowercase in HTML, and demands lowercase for stricter document types like XHTML.
