My Daily learning - How to Code Day 9 of HTML: Lists

in #coding5 years ago

Good Evening everyone,

This is the continuation of prep for my honorable discharge from my Military Service. I'm going back to school for computer science. For my prep @richatvns is mentoring me in Calculus and the field of computer science. I'm taking online video classes on Calculus 3, learning HTML, then CSS, followed by Javascript on W3Schools As well as learning blockchain technology through Steem at the same time.

Everyday rich is requiring me as a "proof of work" to show what I learned that day to him.

So we came up with the great idea why not help others, and make a quick easy to follow tutorial by posting what I learned each day.
Since I'm only doing 1 short tutorial a day, it's so easy to follow along and learn (should be under 5 min).
I get the added bonus of repeating the material, such that I truly understand it.

jetseparator.gif

You can try your own coding here using this link:
https://www.w3schools.com/html/html_lists.asp

Lists are a neat way to present data in an organized manner. You can organize the data by numbering each item, or adding bullet points. It helps your reader understand the content on your web page.

Below i have a picture of an unordered list on top and an ordered list below it. The tags we use for an unordered list are < ul >. These tags go at the beginning and end of your list.

Check out the coding here below:
List coding.PNG

When we run it in safari it looks like this:
List coding.PNG

If we want to make an ordered HTML list we place < ol > tags at the front and end of our list. We mark each list item with < li > tags before and after the item. The coding will look like this:

html list coding.PNG

and the finished product in safari looks like this:

html list safari.PNG

If you just found this Post and want to start from the beginning here are the earlier posts in the series:

Introduction to my journey
Day 2 of HTML
Day 3 of Attributes
Day 4 of HMTL Background and Text Colors
Day 5 of HTML Fonts
Day 8 of HTML Fonts
Day 8 of HTML Images
Day 9 of HTML Tables

You want to learn, Just remember the Nike Slogan:
Just Do It

*** Thank you to @richatvns for setting up this template for posting and base artwork

poker_separator.gif

Sort:  

That's a nice idea! I'm thinking about doing something similar when going deeper into Python.

i been learning from this, maybe I'll write on watch repair tips I've learned over time.
I get different types all the time that require different tricks!

Good post Dave,

well done you need to edit your separator is not coming through and showing a file name.

This post has received a 55.36 % upvote from @boomerang.

Coin Marketplace

STEEM 0.18
TRX 0.13
JST 0.028
BTC 57743.27
ETH 3083.77
USDT 1.00
SBD 2.42