Webdesign - Les 2 (23/24): Links

• Informatica
• Middelbare school
• havo, vwo
• Leerjaar 4

Introductie HTML

Antje Roestenburg

[e-mail]

Vorige les: 

Fundament: HTML & CSS (A2)
* t/m hoofdstuk 2
* vraag 1 & 2 van hoofdstuk 2.8

YouTube:

* Kijk t/m video 2 (zie Google Classroom)

Hyperlinks

Hyperlinks

• Interne link

• Externe link

• Anchor link

Welke HTML code hoort hierbij?

1. <href="afbeelding.html"><a>Klik hier</a> om naar de webpagina te gaan.
2. <a="afbeelding.html">Klik hier</a> om naar de webpagina te gaan.
3. <a href="afbeelding.html">Klik hier om </a> naar de webpagina te gaan.
4. <a href="afbeelding.html">Klik hier</a> om naar de webpagina te gaan.

List

(opsomming)

Boodschappen:

<ul>

  <li>Melk</li>

  <li>Boter</li>

  <li>Eieren</li>

  <li>Brood</li>

</ul>

Boodschappen:

• Melk
  
• Boter
  
• Eieren
  
• Brood

w3schools.com/html/html_lists.asp

Opsomming (unordered list)

Boodschappen:

<ol>

  <li>Melk</li>

  <li>Boter</li>

  <li>Eieren</li>

  <li>Brood</li>

</ol>

Boodschappen:

1. Melk
2. Boter
   
3. Eieren
   
4. Brood

w3schools.com/html/html_lists.asp

Genumereerde lijst (ordered list)

  <dl>

    <dt>Espresso</dt>  

    <dd>Sterke koffie</dd>

    <dt>Cappuccino</dt>

    <dd>Koffie met opgeschuimde melk</dd>

  </dl>

    Espresso

             Sterke koffie

      Cappuccino

             Koffie met opgeschuimde melk

Definitielijst

<ul>

  <li>Vaders interesses

    <ol>

      <li>Voetbal</li>

      <li>Breien</li>

    </ol>

  </li>

  <li>Moeders interesses

    <ol>

      <li>Voetbal haten</li>

      <li>Paarden</li>

    </ol>

  </li>

</ul>

• Vaders interesses

         1. Voetbal
         2. Breien

•  Moeders interesses

         1. Voetbal haten

         2. Paarden

Genestelde lijst

Tables

Tables

Tabel (1)

w3schools.com/html/html_tables.asp

  <table>

      <tr>

        <td colspan=3>colspan</td>

      </tr>

      <tr>

        <td>cel A2</td>

        <td>cel B2</td>

        <td>cel C2</td>

      </tr>

      <tr>

        <td>cel A3</td>

        <td>cel B3</td>

        <td>cel C3</td>

      </tr>

    </table>

  <table>

      <tr>

        <td rowspan=3>rowspan</td>

        <td>cel B1</td>

        <td>cel C1</td>

      </tr>

      <tr>

        <td>cel B2</td>

        <td>cel C2</td>

      </tr>

      <tr>

        <td>cel B3</td>

        <td>cel C3</td>

      </tr>

    </table>

Aan de slag:

Fundament: HTML & CSS (A2)
* t/m hoofdstuk 3 (Multimedia)
* vraag 1 t/m 3 van hoofdstuk 3.6

YouTube:

* Kijk t/m video 3 (zie Google Classroom)