For WOD 1, we needed to create subsections that were for the introduction, and the brief history of Internet Explorer, Firefox, and Chrome. It wasn’t too difficult to separate these into sections as I just used the “p” tags and “h2” tags in order to separate everything. I then needed to create a table of contents for the page. This was done by using the “li” tags to create a list, and then the “a” tag with the “href” to reference each subsection. I used the “id” to create variables for each subsection so that I was able to reference them in the table of contents. This allowed me to be able to click on each link in the table of contents and the webpage will take me to that specific subsection. I also used the “a” tag and the “href” to put in a weblink for one word per subsection. For example, I was able to link the Google wikipedia page to the word “Google” in the Chrome subsection for people to gather more info about Google.
For WOD 2, it took me three tries, but only because there were problems with my style sheets that were not referencing properly in my index sheet. Although things went pretty smoothly after as I was able to finish it in the recommended time frame. All I needed to do was create the style sheet for the index. Then reference that in the header of the index with “href”. Then in the style sheet, I just coded h1 and h2 to have the font “Oswald” using the Google link that was provided for us in our resources. Then I created another section for the body in the style sheet. This section contained the color change to dark blue, changing the font family, changing the margins, changing the width of each section, and the background color of the web page to ivory. Lastly I created another section in the style sheet for the pictures called “img”. In this section, I assigned the float “left”, so that the pictures would be on the left, and the margin set right 10 pixels so that there would be a margin on the right.
For WOD 3, I just had to change the style sheet from the previous WOD so that the table of contents will look a bit cleaner, and the subsections will be sectioned into thirds, giving the index page a bit of a cleaner look. For this, I gave each section, besides the introduction, assigned to a class named either right, center or left, depending on where the subsection would be on the webpage. Then I had to reference that into the stylesheet calling for each subsection, and assigning where it would be by putting the float as either left, right, or center. Then adjust the margins so that it would look nice. Finally, for the table of contents, I had to change the display of the list by putting a list section in the stylesheet and assigning it to “inline”, then changing up the margins to make it look evenly spaced out.