HTML Practice

Setup CodePen Collection

• Setup a CodePen collection named HTML Markup Practice

• Save pens from this exercise to this collection

HTML Markup Practice

A markup language is one that is designed for defining and presenting text.

Practice marking up HTML content with unfamiliar elements.

---

Practice Pens for Collection

Mark

• Semantically use mark to highlight misspellings in this sentence.

Teh internet is a globell systamm of interconnected computerr netweerks that uses standardized communication protocols to link devices worldwide. 

Time

• Semantically markup the current time right now

• value for datetime attribute follows this format HR:MM e.g.12:34 is 12:34 pm

Reference

time - HTML Reference

Date

• Semantically markup the current date right now

• value of datetime attribute follows this format YYYY-MM-DD e.g.1970-01-01 is January 1, 1970

Reference

time - HTML Reference

Video

• Semantically markup this video of Gino Iannucci's flawless push on skateboard

  • https://assets.codepen.io/16425/gino-push.mp4

• Enable the attributes

  • controls

  • autoplay

  • loop

Reference

video - HTML Reference

Audio

• Semantically markup this audio clip, Woot Woot

  • https://assets.codepen.io/16425/woop-woop.mp3

• Enable the attributes

  • controls

  • autoplay

  • loop

Reference

video - HTML Reference

Blockquote

• Semantically markup your favorite quote

• cite the source

Reference

blockquote - HTML Reference

Address

• Semantically markup the address to the Catalyst Building

601 E Riverside Ave

Spokane, WA 99202f

Reference

address - HTML Reference

Button

• Semantically markup two(2) buttons

• First button text: Help Jeff Bezos Buy A 🛥️ Boat

  • Note: Button does not have to be functional

• Second button is disabled with text: Empty Amazon Cart

Reference

button - HTML Reference

Details

• Semantically markup a toggable block of content for EWU's beloved mascot Swoop

• summary text is: Who is Swoop?

• Content displayed is: Swoop, Eastern Washington University's mascot, is an ambassador, spirit leader, and fun-loving character. Go Eags!

Reference

details - HTML Reference

Phone Number

• Semantically markup the phone number: 509-123-4567

• On a phone-enabled device, tapping the number will make a phone call

Reference

Telephone Links: How to Add “Call-able” Links & CTA’s to Your Website