Student

Learn the basics of coding while building your own website

Parent

Track your student's progress and assign them challenges

Teacher

Create a classroom and assign lessons to your students

Welcome to the Playground!!

I see that it's your first time here. Please consider doing a few lessons first if you are not familiar with Codemoji, and in no time you'll be able to come back and master the playground!

This area is called the playground. You can use it to play around with the different tags, building whatever webpage you would like. There are no rules! Simply drag the emojis from the Emoji Box into the text editor on the left and then add text to see what you can create.

As always, press the blue "Run Code" button in the bottom left corner of the screen to run your code, then press the purple "View Code" button that appears to see what you've created!

If you forget your task (to play!) or would like a refresher as to how the playground works, simply click the white triangle in the bottom left corner of the screen and this tip will reappear.

Code Structure

HTML Document Structure

  1. <html>: This is the opening tag and should be the first element in an HTML document.
  2. <head>: Contains meta-information about the document, such as its title.
  3. <title>: Sets the title of the document, giving it a name.
  4. <body>: Holds the content that is displayed on the webpage.
    • <h1> to <h6>: Header tags for different levels of headings.
    • <p>: Used to define a paragraph.
    • <div>: A division or section in the document.
    • <br>: A line break.
    • <strong>: Indicates that the text is of strong importance.
    • <img>: Used to embed images.
    • <a>: Defines a hyperlink.
    • <ul>: Unordered list.
    • <li>: List item.
    • <blockquote>: For quoting text from another source.
    • <audio>: Embeds sound content.
    • <video>: Embeds video content.
    • <table>: For structured data in rows and columns.
    • <tr>: Table row.
    • <td>: Table cell providing data in a table.