SlideShare a Scribd company logo

Working with html tables

•Download as PPTX, PDF•
•
A
Andz Bass
1 of 13
Working with HTML Tables <table>, <th>, <tr> and <td> tags
Template <table border=1> <caption> Table Caption</caption> <tr> <th> Heading 1</th> <th> Heading 2</th> </tr> <tr> <td>Row1 Col1 Data</td> <td>Row1 Col2 Data</td> </tr> <tr> <td>Row1 Col1 Data</td> <td>Row1 Col2 Data</td> </tr> <tr> <td>Row1 Col1 Data</td> <td>Row1 Col2 Data</td> </tr>
Table Element Attribute Align: -gives the horizontal alignment of the table as a whole -Legal Values are: Left, right and center, with left being its default Border: ,[object Object]
The Default is zero, which also results in the visible 3D divider between cells being turned off,[object Object]
Default is usually about 3Cellpadding: -determines the empty space, in pixels, between the cell’s border and the table element. - Default is usually by 1
Width: ,[object Object],BGColor: ,[object Object],Background: -nonstandard attribute supported by IE gives an image file that will be tiled as the background of the table. Frame: ,[object Object]
All four are drawn if this attribute is omitted
Legal Values are Border or Box(all), VOID(none), Above(top),bellow(bottom), Hsides(top and bottom), Vsides(left and right), LHS(left) and RHS(right)
<TR> Table Row ,[object Object]
Each row will contain TH and/or TD entried,[object Object]
Table Cells: <TH> and <TD> Colspan: ,[object Object],<Table Border=1> <tr> <thColspan=2> Col 1 & 2 Heading</th> <th> Col3 Heading</th> </tr> <tr> <td> Col1 data</td> <td> Col2 data</td> <td> Col3 data</td> </tr> </table>

Recommended

Tables
TablesTables
Tablesbuhiterita
 
Html tables
Html tablesHtml tables
Html tablesSikandar Pandit
 
HTML Tables
HTML TablesHTML Tables
HTML TablesWaheedaBanoShaikh
 
HTML Table Tags
HTML Table TagsHTML Table Tags
HTML Table TagsKainat Ilyas
 
Html tables
Html tablesHtml tables
Html tablesJagruti Ghadigaonkar
 
Html tables
Html tablesHtml tables
Html tablesEr. Nawaraj Bhandari
 
Html table
Html tableHtml table
Html tableJayjZens
 
Html table tags
Html table tagsHtml table tags
Html table tagseShikshak
 

Recommended

Tables
TablesTables
Tablesbuhiterita
 
Html tables
Html tablesHtml tables
Html tablesSikandar Pandit
 
HTML Tables
HTML TablesHTML Tables
HTML TablesWaheedaBanoShaikh
 
HTML Table Tags
HTML Table TagsHTML Table Tags
HTML Table TagsKainat Ilyas
 
Html tables
Html tablesHtml tables
Html tablesJagruti Ghadigaonkar
 
Html tables
Html tablesHtml tables
Html tablesEr. Nawaraj Bhandari
 
Html table
Html tableHtml table
Html tableJayjZens
 
Html table tags
Html table tagsHtml table tags
Html table tagseShikshak
 
Web topic 12 tables in html
Web topic 12 tables in htmlWeb topic 12 tables in html
Web topic 12 tables in htmlCK Yang
 
3.1 xhtml tables
3.1 xhtml tables3.1 xhtml tables
3.1 xhtml tablesBulldogs83
 
Html Tables
Html TablesHtml Tables
Html TablesKen Abraham Saluta
 
html-table
html-tablehtml-table
html-tableDhirendra Chauhan
 
Chapter 8: Tables
Chapter 8: TablesChapter 8: Tables
Chapter 8: TablesSteve Guinan
 
Web design - Working with tables in HTML
Web design - Working with tables in HTMLWeb design - Working with tables in HTML
Web design - Working with tables in HTMLMustafa Kamel Mohammadi
 
Standard Grade Administration - Software Applications
Standard Grade Administration - Software ApplicationsStandard Grade Administration - Software Applications
Standard Grade Administration - Software ApplicationsMusselburgh Grammar School
 
HTML Tables
HTML TablesHTML Tables
HTML TablesNisa Soomro
 
1-06: More HTML Elements
1-06: More HTML Elements1-06: More HTML Elements
1-06: More HTML Elementsapnwebdev
 
Computer language - Html tables
Computer language - Html tablesComputer language - Html tables
Computer language - Html tablesDr. I. Uma Maheswari Maheswari
 
Table structure introduction
Table structure introductionTable structure introduction
Table structure introductionnobel mujuji
 
Create table relationships
Create table relationshipsCreate table relationships
Create table relationshipsDastan Kamaran
 
Documents and formatting
Documents and formattingDocuments and formatting
Documents and formattingDiversido
 
HTML + CSS
HTML + CSSHTML + CSS
HTML + CSSJorge Zapico
 
HTML Basic
HTML BasicHTML Basic
HTML BasicPranita Talwatkar
 
Netiquette
NetiquetteNetiquette
NetiquetteAndz Bass
 
Working with tables
Working with tablesWorking with tables
Working with tablesAndz Bass
 
Html links
Html linksHtml links
Html linksAndz Bass
 
Imagetag
ImagetagImagetag
ImagetagAndz Bass
 
Css intro
Css introCss intro
Css introAndz Bass
 
Netiquette
NetiquetteNetiquette
NetiquetteCecilia Tagliapietra
 
Tables and Forms in HTML
Tables and Forms in HTMLTables and Forms in HTML
Tables and Forms in HTMLDoncho Minkov
 

More Related Content

What's hot

Web topic 12 tables in html
Web topic 12 tables in htmlWeb topic 12 tables in html
Web topic 12 tables in htmlCK Yang
 
3.1 xhtml tables
3.1 xhtml tables3.1 xhtml tables
3.1 xhtml tablesBulldogs83
 
Web design - Working with tables in HTML
Web design - Working with tables in HTMLWeb design - Working with tables in HTML
Web design - Working with tables in HTMLMustafa Kamel Mohammadi
 
Standard Grade Administration - Software Applications
Standard Grade Administration - Software ApplicationsStandard Grade Administration - Software Applications
Standard Grade Administration - Software ApplicationsMusselburgh Grammar School
 
1-06: More HTML Elements
1-06: More HTML Elements1-06: More HTML Elements
1-06: More HTML Elementsapnwebdev
 
Table structure introduction
Table structure introductionTable structure introduction
Table structure introductionnobel mujuji
 
Create table relationships
Create table relationshipsCreate table relationships
Create table relationshipsDastan Kamaran
 
Documents and formatting
Documents and formattingDocuments and formatting
Documents and formattingDiversido
 

What's hot (15)

Web topic 12 tables in html
Web topic 12 tables in htmlWeb topic 12 tables in html
Web topic 12 tables in html
 
3.1 xhtml tables
3.1 xhtml tables3.1 xhtml tables
3.1 xhtml tables
 
Html Tables
Html TablesHtml Tables
Html Tables
 
html-table
html-tablehtml-table
html-table
 
Chapter 8: Tables
Chapter 8: TablesChapter 8: Tables
Chapter 8: Tables
 
Web design - Working with tables in HTML
Web design - Working with tables in HTMLWeb design - Working with tables in HTML
Web design - Working with tables in HTML
 
Standard Grade Administration - Software Applications
Standard Grade Administration - Software ApplicationsStandard Grade Administration - Software Applications
Standard Grade Administration - Software Applications
 
HTML Tables
HTML TablesHTML Tables
HTML Tables
 
1-06: More HTML Elements
1-06: More HTML Elements1-06: More HTML Elements
1-06: More HTML Elements
 
Computer language - Html tables
Computer language - Html tablesComputer language - Html tables
Computer language - Html tables
 
Table structure introduction
Table structure introductionTable structure introduction
Table structure introduction
 
Create table relationships
Create table relationshipsCreate table relationships
Create table relationships
 
Documents and formatting
Documents and formattingDocuments and formatting
Documents and formatting
 
HTML + CSS
HTML + CSSHTML + CSS
HTML + CSS
 
HTML Basic
HTML BasicHTML Basic
HTML Basic
 

Viewers also liked

Working with tables
Working with tablesWorking with tables
Working with tablesAndz Bass
 

Viewers also liked (6)

Netiquette
NetiquetteNetiquette
Netiquette
 
Working with tables
Working with tablesWorking with tables
Working with tables
 
Html links
Html linksHtml links
Html links
 
Imagetag
ImagetagImagetag
Imagetag
 
Css intro
Css introCss intro
Css intro
 
Netiquette
NetiquetteNetiquette
Netiquette
 

Similar to Working with html tables

Tables and Forms in HTML
Tables and Forms in HTMLTables and Forms in HTML
Tables and Forms in HTMLDoncho Minkov
 
Cascading Style Sheets
Cascading Style SheetsCascading Style Sheets
Cascading Style SheetsJerome Locson
 
1 06-more html-elements
1 06-more html-elements1 06-more html-elements
1 06-more html-elementsapnwebdev
 
03. session 03 using lists and tables
03. session 03 using lists and tables03. session 03 using lists and tables
03. session 03 using lists and tablesPhúc Đỗ
 
Chapter 3 class presentation
Chapter 3 class presentationChapter 3 class presentation
Chapter 3 class presentationcmurphysvhs
 
Tables overview 2010
Tables overview 2010Tables overview 2010
Tables overview 2010Mark Carter
 
Kml Basics Chpt 2 Placemarks
Kml Basics Chpt 2 PlacemarksKml Basics Chpt 2 Placemarks
Kml Basics Chpt 2 Placemarkstcooper66
 

Similar to Working with html tables (20)

Tables and Forms in HTML
Tables and Forms in HTMLTables and Forms in HTML
Tables and Forms in HTML
 
Tables
TablesTables
Tables
 
Html Ppt
Html PptHtml Ppt
Html Ppt
 
Tables
TablesTables
Tables
 
Lecture 4
Lecture 4Lecture 4
Lecture 4
 
Html tutorial
Html tutorialHtml tutorial
Html tutorial
 
Cascading Style Sheets
Cascading Style SheetsCascading Style Sheets
Cascading Style Sheets
 
1 06-more html-elements
1 06-more html-elements1 06-more html-elements
1 06-more html-elements
 
Tables
TablesTables
Tables
 
Understanding THML
Understanding THMLUnderstanding THML
Understanding THML
 
03. session 03 using lists and tables
03. session 03 using lists and tables03. session 03 using lists and tables
03. session 03 using lists and tables
 
Html
HtmlHtml
Html
 
Html
HtmlHtml
Html
 
Chapter 3 class presentation
Chapter 3 class presentationChapter 3 class presentation
Chapter 3 class presentation
 
Tables overview 2010
Tables overview 2010Tables overview 2010
Tables overview 2010
 
Kml Basics Chpt 2 Placemarks
Kml Basics Chpt 2 PlacemarksKml Basics Chpt 2 Placemarks
Kml Basics Chpt 2 Placemarks
 
Html intro
Html introHtml intro
Html intro
 
Html intro
Html introHtml intro
Html intro
 
HTML Tables
HTML TablesHTML Tables
HTML Tables
 
AK html
AK htmlAK html
AK html
 

Working with html tables

  • 1. Working with HTML Tables <table>, <th>, <tr> and <td> tags
  • 2. Template <table border=1> <caption> Table Caption</caption> <tr> <th> Heading 1</th> <th> Heading 2</th> </tr> <tr> <td>Row1 Col1 Data</td> <td>Row1 Col2 Data</td> </tr> <tr> <td>Row1 Col1 Data</td> <td>Row1 Col2 Data</td> </tr> <tr> <td>Row1 Col1 Data</td> <td>Row1 Col2 Data</td> </tr>
  • 3.
  • 4.
  • 5.
  • 6. Default is usually about 3Cellpadding: -determines the empty space, in pixels, between the cell’s border and the table element. - Default is usually by 1
  • 7.
  • 8. All four are drawn if this attribute is omitted
  • 9. Legal Values are Border or Box(all), VOID(none), Above(top),bellow(bottom), Hsides(top and bottom), Vsides(left and right), LHS(left) and RHS(right)
  • 10.
  • 11.
  • 12.
  • 13.
  • 14.
  • 15. Sample 1 <TABLE BORDER="1"> <TR> <TD WIDTH="25">A</TD> <TD WIDTH="25" align=center>B</TD> <TD WIDTH="25" align=right>C</TD> </TR> <TR> <TD WIDTH="25">D</TD> <TD WIDTH="25" align=center>E</TD> <TD WIDTH="25" align=right>F</TD> </TR> </TABLE>