100 days of code cont.. [From Day 8]

in #code5 years ago

I stopped at day 6 the lady time, right? We've done a lot more! I just finished setting up the task for day 11. I've missed three days so far; day 1, 9 and 10 and I hope I won't miss anyone again till the 100 days is complete. Today, I'll be dropping the task I did on day 7, 8 and 11. It would have been more if I didn't miss those two days between 8 and 11, but don't worry, you will still understand everything. The tasks are no big deal.

As usual, don't mind the tenses. They were written on the said date! Only day 11 was written today.

Day 7

Day 7 continues with creating tables. This time around, we categorized every section of the table. The head, body and footer was known and stated. The "th" tag made the texts bolder making it stand out as the head of a column.

It's pretty similar to the code we wrote yesterday, just some few tweaks to the code. Adding a body, head and footer is the main difference. So, the task was to replicate a table of phone with their price and manufacture date. I was able to do mine using the header, footer and body as it was instructed on day 7 task post.

Check out the code below;
Output is at the right hand side.


Capture.PNG

Day 8
Okay, we are done with tables. Guess what is next? Audios! Yes, syou heard that right. Playing music videos on a browser is cool, right? The HTML codes to create it was properly stated in the task post and I put it to use.

The first thing was to input the audio files into my HTML folder. I placed two of my great music in it. Ye by Burna Boy and Talk by Falz. This is it below:


Capture1.PNG

They are in mp3 format ready to play in a browser. And the next step was writing the codes to play and input it on the webpage. As usual, the code is at the left hand side while the output is at the right hand side.

Capture.PNG

You can see both songs on the browser. Once you click on play, it will start playing. You can even forward and pause the song.

The code has many formats because the browser might not support a particular format, so "wav" and "ogg" were added. If it still doesn't support these two formats, the message about "trying another browser" will display. All these were stated and discussed on the task post.

Day 11

Pheew! I missed day 9 and 10, but the tasks keeps getting interesting. Day 11 is all about forms. Those registration, signup and login forms we see on our browser were discussed this time.

First, we started with what we've learnt so far by creating an header with the h1 tag. The header carries "Simple HTML Form". It's just a heading to signify what the code and form is all about. A form tag was created, where every other form codes were inputted. The code and the output is shown below:


Capture.PNG

Those boxes were created using the "input" tag. The first three carried "text" to signify it's a form for text, while the last one carried "submit" to signify it's a button. It's pretty easy, right? Well, more are coming.

See you on day 12!

Sort:  

Thanks for using eSteem!
Your post has been voted as a part of eSteem encouragement program. Keep up the good work! Install Android, iOS Mobile app or Windows, Mac, Linux Surfer app, if you haven't already!
Learn more: https://esteem.app
Join our discord: https://discord.gg/8eHupPq

Coin Marketplace

STEEM 0.35
TRX 0.12
JST 0.040
BTC 70391.42
ETH 3572.68
USDT 1.00
SBD 4.74