HTML - Anton-L-GitHub/Learning GitHub Wiki

DOM Document Object Model

Validating


Meta

Viewport

The visual area of a webpage

Keywords

Var en gång i tiden använda av sökmotorer för att hitta sidor. Används mindre nu förtiden.

Description

Används av sökmotorer för att visa en liten decsription om någon söker på din hemsida.


Text

&; = Escape character
&nbsp = None breaking character, (radbryt kan ej vara här).
<em> =
<i> = italic (don't use! , use css)
<b> = italic (don't use! , use css)
<strong> =
<H1 - H6> = Used as importance of the headers (NOT as size regulator)

Lorem32 = Generera 32st ord.


Hyperlinks

<a href="path_to.html">Link text</a>

download - Makes the client download the content in the link.
href="#section-b" - Jumpes to section on page.
href="#section-b" target="_blank" - Opens page in new tab.
href="mailto:[email protected]" - Email


Images

https://unsplash.com/

Videos

https://www.pexels.com/

<video src="videos/example.mp4">Your browser doesn't support videos.</video>

controls - Shows playing buttons autoplay - Starts video autp loop - Loops video

Autio

<audio src="sound/example.mp3">Your browser doesn't support audio.</video>

controls - Shows playing buttons autoplay - Starts video autp loop - Loops video


Lists

Unordered list

<ul>
    <li>Home</li>
    <li>About me</li>
</ul>

Ordered list

<ol>
    <li>Home</li>
    <li>About me</li>
</ol>

Ordered list (List item)

<ol>
    <li>Home</li>
    <li>About me</li>
</ol>

Described list (List item)

<ol>
    <li>Home</li>
    <li>About me</li>
</ol>

Tables

<table>
    <thead>
    <tr>
        <th>Kategori</th>
        <th>Summa</th>
    </tr>
    </thead>

    <tbody>
    <tr>
        <td>Glass</td>
        <td>100Kr</td>
    </tr>
    <tr>
        <td>Godis</td>
        <td>50kr</td>
    </tr>
    </tbody>

Containers

<div> - Containers for content (Block-level element)
<span> - Containers for text (Inline element)

Semantic containers
<article> - Forum post, comment, reviews, product cars osv..
<figure> - Wrap a figure.
<mark> - Highlight content.
<time> - Wrap time.

Structure

<header> - Header
<main> - Main content
<section> - Group related content
<aside> - Content not related to the main content
<footer> - Footer

⚠️ **GitHub.com Fallback** ⚠️