html lists and tables

14
Mr. Rouda’s CSCI 101 sections

Upload: dante

Post on 06-Jan-2016

60 views

Category:

Documents


3 download

DESCRIPTION

HTML Lists and Tables. Mr. Rouda’s CSCI 101 sections. Web Expression Tutorial. New Folder. New File. Code View. Format of Every Page. my page this is the body . Lists. Unordered Lists Ordered Lists - PowerPoint PPT Presentation

TRANSCRIPT

Page 1: HTML Lists and Tables

Mr. Rouda’s CSCI 101 sections

Page 2: HTML Lists and Tables

Web Expression TutorialNew Folder

Code View

New File

Page 3: HTML Lists and Tables

Format of Every Page<html><head> <title> my page </title></head><body>this is the body</body></html>

Page 4: HTML Lists and Tables

ListsUnordered ListsOrdered ListsDefinition Lists

Page 5: HTML Lists and Tables

Lists - UnOrdered List Example – UnOrdered - 1Here is a list of days.<ul><li> monday </li><li> tuesday </li><li> wednesday </li></ul>That is the end of the list.

Page 6: HTML Lists and Tables

Lists - UnOrdered List Example – UnOrdered - 2<ul><li> monday<li> tuesday<ul><li> Do Laundry<li> Cut Grass<li> Clean House</ul><li> wednesday</ul>

Page 7: HTML Lists and Tables

Lists - OrderedList Example – Orderedchange the ul’s to ol’s

<ol><li> monday </li><li> tuesday </li><li> wednesday </li></ol>

Page 8: HTML Lists and Tables

Lists - Definition Definition List<dl><dt>Due Date:<dd>Next Class<dd>at 2:00pm</dl>

Page 9: HTML Lists and Tables

Tablestables are grids of rows and columnsWe fill in each cell row by row Table Example – simple<table> <tr><td> AAAAAAAAA<td> BBB <tr><td> CCC<td> DDD </table>

Page 10: HTML Lists and Tables

TableTable Example – adding some space<table><tr><td> AAA<td> &nbsp &nbsp &nbsp &nbsp <td> BBB<tr><td> CCC<td><td> DDD</table>

Page 11: HTML Lists and Tables

TableTable Example – border<table border=10><table border=10 cellspacing=20

cellpadding=30>

Page 12: HTML Lists and Tables

TableTable Example – lines<table rules=rows><table rules=cols><table rules=all> 

Page 13: HTML Lists and Tables

TableTable Example - width<table rules=all width=50%><tr><td width=25%> AAA<td align=center> BBB<tr><td> CCC<td> DDD</table>

Page 14: HTML Lists and Tables

Next timeTalk about Paper

Images / Styles / CSS