Thomas Wiley

Hello world, this page will be a showcase of the HTML coding skills I’ve accumulated over the course of this semester. I was unsure what the professor wanted as I saw that the directions said to post a paragraph here stating that this page was for my coding, but when I saw other pages they were physical codes. Whether it’s one or the other, this is my introduction paragraph to say that I’ll be posting on this page!

<!DOCTYPE html>
<html>

  <head>
    <style>
      ul {
        list-style-type: none;
        margin: 0;
        padding: 0;
        overflow: hidden;
        background-color: #421814;
      }

      li {
        float: left;
      }

      li a {
        display: block;
        color: white;
        text-align: center;
        padding: 14px 16px;
        text-decoration: none;
      }

      li a:hover {
        background-color: #111;
      }

    </style>
  </head>

  <head>

  <body>

    <ul>
      <li><a class="active" href="#home">Home</a></li>
      <li><a class="About">About Me</a></li>
      <li><a class="Sched">My Schedule</a></li>
      <li><a class="Form">A Form</a></li>
    </ul>

  </body>

  <title>Final Project J215</title>
  </head>

  <body>
    <div class="About">
      <h1 style="text-align:center;font-size:60px;border:2px solid Tomato;">About Me Page <br>
        <span style="text-align:center;font-size:35px;"> A J215 Final Project By Thomas Wiley </span></h1>
    </div>
  </body>
  <div>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <style>
      img {
        display: block;
        margin-left: auto;
        margin-right: auto;
      }

    </style>
    <img src="https://media.licdn.com/dms/image/D5603AQE6HKEIWLMyEg/profile-displayphoto-shrink_800_800/0/1692568626706?e=1704931200&v=beta&t=T0xhhpqjU9gxEFCOqAe8fBykCzuCWECSXUyyg9JOotQ" alt="LinkedIn.com" width="200" height="200">
  </div>
  <br>
  <div>
    <style>
      p {
        text-align: center;
        font-family: "Times New Roman", Times, serif;
        font-size: large;
      }

      </body>

    </style>
    <p>


      Hello World! My name is Thomas Wiley. I'm a junior here at the University of Kansas studying Strategic Communications at the School of Journalism. Below are some of the skills I've learned to do while taking J215: Web Coding! For more information on me, go to my <a href="https://www.linkedin.com/in/thomas-wiley-9b0637220/">LinkedIn Page!</a>
    </p>
  </div>

  <div class="Sched">
    <style>
      table {
        font-family: arial, sans-serif;
        border-collapse: collapse;
        width: 100%;
      }

      td,
      th {
        border: 1px solid #457725;
        text-align: left;
        padding: 8px;
      }

      tr:nth-child(even) {
        background-color: #f0c282;
      }

    </style>

    <body>

      <h2 style="text-align:center" ;> My Schedule this Semester </h2>

      <table>
        <tr>
          <th>Class</th>
          <th>Days</th>
          <th>Times</th>
        </tr>
        <tr>
          <td>JMC 460</td>
          <td>Monday, Wednesday</td>
          <td>9:30 - 10:45</td>
        </tr>
        <tr>
          <td>HIST 350</td>
          <td>Monday, Wednesday</td>
          <td>11:00 - 12:15</td>
        </tr>
        <tr>
          <td>BIOL 100</td>
          <td>Tuesday, Thursday</td>
          <td>11:00 - 12:15</td>
        </tr>
        <tr>
          <td>JMC 420</td>
          <td>Tuesday, Thursday</td>
          <td>1:00 - 2:15</td>
        </tr>
      </table>

    </body>
  </div>
  <div class="Form">

    <body>

      <h2>Here is a form. If you see this page, feel free to put your name!</h2>

      <form action="/action_page.php">
        <label for="fname">First name:</label><br>
        <input type="text" id="fname" name="fname" value="Your"><br>
        <label for="lname">Last name:</label><br>
        <input type="text" id="lname" name="lname" value="Mom"><br><br>
        <input type="submit" value="Click for good luck!">
      </form>

      <p>If you don't submit your name it's okay, but they HTML gods will be sad.</p>

    </body>
  </div>

</html>