Here's my work on Lists & Links. I made it to keep track of my own work.
http://dl.dropbox.com/u/49688808/list1.html
I just needed to change the file name.
This course will become read-only in the near future. Tell us at community.p2pu.org if that is a problem.
Lets take a look at ways to itemize lists, link to other documents, and insert multimedia into our pages.
Lists come in two flavors ordered and unordered. Ordered lists flow in sequence while unordered lists have no required, or meaningful, order. For example, a shopping list may be considered as an unordered list as you are not concerened with the order in which you find the items in the store.
The <ol> tag is used to create ordered lists, while the <ul> tag denotes unordered lists.
Lets create two lists one will be a grocery list and the other wil be instructions describing how to check out at the market.
First the grocery list. Creating an unordered list has three steps:
Lets see an unordered list in its entirety:
<ul> <li>Asparigus</li> <li>Milk</li> <li>Tempeh</li> </ul>
Secondly, we will list the checkout steps.
<ol> <li>Unload your shopping basket</li> <li>Greet the cashier</li> <li>Smile at the cute baby next to you in line</li> <li>Pay the cashier</li> <li>Gather your groceries and leave</li> </ol>
Hyperlinks are interconnections between pages and resources on the World Wide Web. Creating hyperlinks requires another aspect of HTML tags called attributes. Attributes are descriptive text elements within the HTML tag enclosures (the < & >). Attributes are associated with values. For example:
<tag attribute="value">
The anchor tag <a> is how we create links both within a document and to external resources. An anchor tag has an attribute called 'href' which stands for hypertext reference. The hypertext reference is the internal or external element to which the link points. For example:
<a href="http://mozilla.org">Mozilla Website</a>
This link points to mozilla.org with the helpful link text "Mozilla Website".
Here's my work on Lists & Links. I made it to keep track of my own work.
http://dl.dropbox.com/u/49688808/list1.html
I just needed to change the file name.
I like the idea so much I want to try it later in the week (have two Univercity exams and a long paper early this week no time now) using semantic html / css and see if I can do something like that too, great idea. I shall pretend to think of the semantic html as Michelangelo did marble - Every block of stone has a statue inside it and it is the task of the sculptor to discover it. I hope you don't mind me commenting on it like that, thanks!
No, I don't mind it at all. Actually, I quite like your Michelangelo analogy because that's how I feel about html/css. The more Web pages I create, the more I realize that html and css are different sides of the same coin.
By the way, I was reading the w3's website recently and found out that "utf=8" /> is the pre html5 syntax, and that you don't need '/' for html5.
Wish you a great exam season!
Nice Demian, I like the idea and like the sprinkle of rounded corners... :)
Thanks much
Really nice, Demian. It is actually useful for all of us to remember the various tips that we have learned here!
Thank you. About the order of the lessons, I get confused also. I wish they just stay fixed.
Heres my creation - like "To do" list :
I like you incorporated multimedia into your list, Vita!
Thnx Elizabeth,
I am not sure though if I made it the right way... I mean the code editor keeps showing me that this is not right, but I am just ignoring it for now, coz the result is what i intended...
Glad you like it.
That is nice Vita, I did the free trial at Plurasight.
Thanks Joe, I did the trial too, found the HTML tutorials quite useful actualy. :)
Added a bit more to the Witch Website! Lists & links!
Nice one Jen! Good work!
Thx! :)
This is my "Lists and links" version. I used the new tags q (quotation) small (smaller fonts) big (biger fonts) cite (citation) b (bold). I added special characters trademark copyright.
I added a link to download a text file which contains the html code.
Here is the result:
lists&links everyone...
and now, the continuation of a page I should have names html5, but instead it's still named Basic Markup because I didn't think ahead.
http://etherpad.mozilla.org:9000/basicmarkup
Here are my two list types, with footer, H1, H2, and link
Here is my code for lists.
http://pastebin.com/u/shemric
http://htmlpad.org/SBrown/ my modified site
My lists and links page is found here.
Nice work!
Like some others, I have modified a previous page used for this course for this.
Here it is (my next stop is the img, video, and audio tags, so those will be added):
Thank you.
I just added a random audio sample (obtained from http://www.archive.org) to my excersize page.
Here's mine, evolved from the first set of lessons.
Here is my example http://htmlpad.org/alro-listexample/
Finished work is here: http://htmlpad.org/tdingman/
I am a bit of a history buff and got slightly carried away but here is a good example of order and ordered list mixed together.
Nice work! Sorry it took so long to get discovered, better late that never hey?