Tables anchors
This presentation is the property of its rightful owner.
Sponsored Links
1 / 12

TABLES & ANCHORS PowerPoint PPT Presentation


  • 41 Views
  • Uploaded on
  • Presentation posted in: General

TABLES & ANCHORS. Table Tags. <TABLE> Identifies the Structure <TR> Table Row <TH> Column 1 </TH> Table Heading <TH> Column 2 </TH> </TR>. Table Tags Continued. <TR> <TD> First Cell </TD> Define the table cell <TD> Second Cell </TD> and enter the cell data </TR> <TR>

Download Presentation

TABLES & ANCHORS

An Image/Link below is provided (as is) to download presentation

Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author.While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server.


- - - - - - - - - - - - - - - - - - - - - - - - - - E N D - - - - - - - - - - - - - - - - - - - - - - - - - -

Presentation Transcript


Tables anchors

TABLES & ANCHORS


Table tags

Table Tags

  • <TABLE> Identifies the Structure

  • <TR> Table Row

  • <TH> Column 1 </TH> Table Heading

  • <TH> Column 2 </TH>

  • </TR>


Table tags continued

Table Tags Continued

  • <TR>

  • <TD> First Cell </TD> Define the table cell

  • <TD> Second Cell </TD> and enter the cell data

  • </TR>

  • <TR>

  • <TD> Third Cell </TD>

  • <TD> Fourth Cell </TD>

  • </TR>

  • </TABLE>


Table borders

Table Borders

  • Default = browsers will display tables without borders

  • <TABLE BORDER = “5”>

  • Has to be inside the TABLE TAG

  • BORDER tag will only effect the outside border


Table cell spacing padding

TABLE CELL SPACING/PADDING

  • CELL SPACING

  • Property that controls the amount of space between cells

  • <TABLE CELLSPACING = “2”>

  • CELL PADDING

  • Property that controls the amount of space between text and cell borders

  • <TABLE CELLPADDING = “3”>


Define table size

DEFINE TABLE SIZE

  • When no width or height is specified, the table will only be as wide and high as it needs to be

  • <TABLE WIDTH = “SIZE” HEIGHT = “SIZE”>

  • Can be pixels or percentages (70%)


Alignment

ALIGNMENT

  • You can specify how the data in the table cell will appear by aligning the text horizontally, vertically, or both.

  • Horizontal Alignment – Use the Align property inside the <TD> tag

  • The default is left

  • <TD ALIGN = “LEFT, RIGHT, or CENTER”>


Alignment1

ALIGNMENT

  • Vertical Alignment- use the VALIGN property inside the <TD> tag

  • <TD VALIGN=“TOP, MIDDLE, or BOTTOM”>

  • The ALIGN and VALIGN must be inside the <TD> tag


Colspan and rowspan

COLSPAN AND ROWSPAN

  • To give a cell a different width than the cell above it you need to use the COLSPAN attribute in the <TD> or <TH> tags

  • <TD COLSPAN = “VALUE”>

  • To give a cell a different height than the cell beside it, you need to use the ROWSPAN attribute in the <TD> or the <TH> tags

  • <TD ROWSPAN = “VALUE”>


Table backgrounds

TABLE BACKGROUNDS

  • Set BGCOLOR for <TABLE> tag

  • <TABLE BGCOLOR =“color”>

  • <TR BGCOLOR =“color”>

  • <TH BGCOLOR = “color”>

  • <TD BGCOLOR = “color”>


Links anchors

Links (Anchors)

  • The <a> tag creates an anchor

  • What is an anchor?

  • Text that is specifically marked so you can link it from other parts of the document

  • Text that is anchored will become the destination of the link; it is not the text you click(pointer)

  • <a name=“top”>Home</a>(destination)

  • <a href=“#top”> Home </a> (pointer)


Link to url

Link to URL

  • You can also link text or an image to an outside site

  • <a href = “URL”>


  • Login