Lab 5 Table and Lists

In this lab, I created a table with lists about certain topics. First off, opened Atom.io to by clicking on the shortcut. Next I saved the file as a HTML file so that it could be presented online in a web page. Thirdly, I began to type my HTML code into the file. I typed in the doctype which is HTML. I typed in the HTML tags, head tags, meta charset="UTF-8", title tags which I placed the title inside, and body tags. I typed in style tags and inside those style tags, I put td, th {vertical-align:top;} to align the lists to the top of the table. Inside the body tags, center tags to make the table and lists center. Inside the center tags, I placed h1 tags which I wrote inside it Visual Design, Lab 5, the date, and my name. I also put the table inside the body and center tags. I placed the table tags with a style of 100% width and a border of 5. I placed the tr tags inside the table tags. I placed multiple th tags with the title of the column. I wrote 10 favorite foods, 10 favorite movies, 3 favorite subjects, 3 least favorite subjects, 3 favorite music genres, and grocery shopping list in the th tags. Then I wrote the td tags. Next I wrote ul tags which stands for unordered list to start my 10 favorite foods list. I wrote li tags or list tags to create my lists of my 10 favorite foods. I put inside the li tags my 10 favorite foods. Most of them were meat. For the next list, I put ol tags which stand for ordered lists. I placed li tags inside the ol tags. I wrote inside the li tags my favorite movies. Afterwords, I placed the td, ol, ul, and li tags for the next list. I made the ol tags have a type of "I". I made the ul tags have a style of a circle making the bullet points circles. I put inside the list my 3 favorite subjects and 3 reasons why. For the next list, I wrote script sources inside the head tags which have an asterisk icon in it. I wrote a span class of the asterisk inside the list tags. I also put the ul type as none. I wrote inside the lists my least favorite subjects and three reasons why. I did the same thing for each section of the list. For the next list I wrote about my 3 favorite music genres, I wrote ol tags with type="A", next li tags with the music genre, after that the ol type="a",  next the list tags with the song album in it, then ol type="a" with list tags with the songs/song names in it 3 times in a row, and repeated the process 3 times to get 3 music genres, 3 albums, and 3 songs. For the final list, I put td tags, ul tags,  ol tags with type="I", and list tags. Inside the list tags I placed the isles of a grocery and the items in the isles. Lastly, I saved the document and uploaded it to the world wide web. Knowing how to do lists and tables is important to a web designer because it helps a web designer do their job efficiently and productively. Also, it is good to know in case the job wants the web designer to make a table or list or both.

My Lab 5 Website:http://techteach.us/Web2020/ZWeiJian/Labs/Lab5/LB5.html