Welcome to Frontend Development Class

Buckle up and get ready to become a coding superhero! 🦸‍♂️

Class Activity Links

Home page | Favorite Food | Login Form | Favorite Book | Feedback Form | Basic Calculator | Html Multimedia | Page Replicate | Financial Webpage Replication | Weekly Planner | Weekly Classroom Schedule | Revision 1 | Revision 2 |

Assignment Links

T-Shirt Signup Form | Kaduna Electric Form | Cable TV Packages |

Project Preview Links

Delicious Bytes Food Menu |

Bakery Image
Below is an online image reference
Bakery Image

Below are Html Formatting

this is a strong text

this is a bold text

this is an italicize text

this is an emphasize text

this is a small text

this is a marked text

this is a deleted text

I am Subscripted below

I am Superscripted above

Below is a Table

Monday Tuesday Wednesday Thursday Friday
Database Management Data Analytics Cyber Security Html/Css/JavaScript ReactJs
Mr Omoni Mr Yusuf / Mr Moses Mr Joshua Mr Jasaphet ???

Working with Hyperlinks

Frontend Developers

an image embedded in hyperlinks, click the image to visit google

Google Logo

No account create one now

List Items

unordered list below

ordered list below

  1. Monday
    1. Database Management
    2. Data Analytics
    3. Cyber Security
    4. Html/Css/JavaScript
    5. ReactJs
  2. Tuesday
  3. Wednesday
  4. Thursday
  5. Friday
  1. Monday
  2. Tuesday
  3. Wednesday
  4. Thursday
  5. Friday

Description Lists

Milk
Coconut Milk
Soya Milk
Cow Milk
Meat
Beef
Chicken

Block Level Elements

  1. <aside>
  2. <blockquote>
  3. <canvas>
  4. <dd>
  5. <div>
  6. <dl>
  7. <table>
  8. <main>
  9. <nav>
  10. <header>
  11. <section>
  12. <footer>
  13. <hr>
  14. <noscript>

Inline Level Elements

  1. <img>
  2. <button>
  3. <cite>

Working with HTML Div

Html Classes

I am a red paragraph

I am a red paragraph

I am a green paragraph

I am a Blue paragraph

I am a Blue paragraph

I am a red paragraph

I am a Yellow paragraph

HTML ID

I am styled using my id

Emoji

😊😆😋👍😎

Html Entity

  1. less than: <

  2. greater than: >

  3. copyright: ©

  4. trade mark: ™

Html Form

form in a fieldset element






Select you favorite food







Html Semantic element

Clearly define the type of the element to the browser and the developer

  1. <nav>
  2. <form>
  3. <table>
  4. <section>
  5. <article>
  6. <aside>
  7. <header>
  8. <footer>
  9. <main>
  10. <figcaption>

Html Responsive Design

The ability to make a design to look good on all devices

Html Iframe

Iframe is a container used to display a webpage within a page

The below video is embedded in an <Iframe>

Html Multimedia

  1. <audio>

  2. <video>

Html Plugins

  1. <object>

Html Navbar