HTML

HTML INLINE

HTML BLOCK LEVEL ELEMENTS

HTML Block and Inline
HTML Charsets
HTML Classes
HTML Comments
HTML Colors
HTML Computercode
HTML CSS
HTML Div
HTML Elements
HTML Emojis
HTML Entities
HTML Favicon
HTML File Paths
HTML Formatting
HTML Head
HTML Heading
HTML Id
HTML Iframes
HTML Images
HTML JavaScript
HTML Layout
HTML Lists
HTML Page Title
HTML Paragraphs
HTML Semantics
HTML Style Guide
HTML Styles
HTML Symols
HTML Tables
HTML URL Encode
HTML vs. XHTML

HTML<!DOCTYPE>Declaration

  • This represents the document type, and gives the browsers help to display web pages correctly.
  • It must appear once only, at the top of the HTML page.
  • The <!DOCTYPE> declaration for HTML5 is <!DOCTYPE>
  • All HTML documents must start with the document type declaration <!DOCTYPE html>
  • The HTML document itself begins with <html>and must end with the closing tag </html>
  • The visible part or what you see of the HTML document is between <body> and the closing tag </body>
  • It helps browsers to display web pages correctly by the <!DOCTYPE> declaration represents the document type.
  • <!DOCTYPE> declaration for HYML5 is <!DOCTYPE>
  • The <!DOCTYPE> declaration is not case sensitive.

<!DOCTYPE html>
<html>
<head>
<title>Your first HTML </title>
<style>
h1
{
color: blue;
}
p
{
color: red;
}
</style>
</head>
<body>
</body>
</html>

Paragraphs

<!DOCTYPE html>
<html>
<head>
<title>HTML Headings </title>
</head>
<body>
<p> Would be your first paragraph>/p>
<p>Would be your second paragraph</p>
</body>
</html>


Paragraph Results

Would be your first paragraph
Would be your second paragraph

Source

View HTML Source code by right clicking on a web page or Click CTRL + U in an HTML page, or right-click on the page and select "View Page Source".
Inspect an HTML Element:
INSPECT
Right-click on an element (or a blank area), and choose "Inspect" to see what elements are made up of (you will see both the HTML and the CSS). You can also edit the HTML or CSS on-the-fly in the Elements or Styles panel that opens
You may copy and paste, however you can not change anything or delete it.

Headings

<h1> This is the most important heading and the largest </h1>

<h2> This is the second most important heading and the second largest </h2>

<h3> This is the third most important heading and the third largest </h3>

<h4> This is the fourth most important heading and the fourth largest </h4>

<h5> This is the most important heading and the largest </h5>

<h6> This is the least important heading and the smallest </h6>


Heading Results

This is the most important heading and the largest

This is the second most important heading and the second largest

This is the third most important heading and the third largest

This is the fourth most important heading and the fourth largest

This is the most important heading and the largest
This is the least important heading and the smallest

Images

  • HTML images are defined with the <img>. attribute
  • The source file ( <src> ), alternative text ( <alt> ), <height>. are provided as attributes
  • img src ="../repel.jpg" ;alt ="../rep.jpg" width ="104" height ="140"
<!DOCTYPE html>
<html>
<head>
<title>HTML Images </title>
</head>
<body>
<img src="repel.jpg" width="437" height="419" alt=""/>
</body>
</html>

Image Results

HTML Images

Links

Links
  • HTML links are defined with the <a> tag.
  • The link's destination is specified in the <href>
Example:
  • < a href> ="https://www.learningcodeforgod.net">Home page. </a>
  • < a href> ="https://www.christisalive.net">Home page. </a>

Hyperlinks:

  • Rules for that anchor name.
    • First you need to accessibility to make an Anchor to the page you are going to link to.
      The name you use for the anchor can not have any spaces in it.
      The name you use must be a unique name
      Two anchor can not have the same name on the same page.
  • You may use lower case (small) or upper case (large) letters. You can not use "troop" and then use "TROOP" for another anchor.
  • Must Remember the exact spelling and case of the word used. It is recommended to use lowercase letters all the time. (write the spelling down to make sure it is correct, it will save you time.)

Example of Hyperlink:

  • First Parts:
    • First part being: where you are sending it from: <a href="basic.html#link">Link</a>
        <a href=""> making it a link
        basic.html is the page where it is going to.
        # is used as a identifier to where it is going on that page
        Link is the word used to have a visible location
    • Second Part
      • Second Part: This is located on the page it is going to and location on that page
        <h2 id="link">Link</h2>