CSS3 Table Layouts tutorial for Beginner - PowerPoint PPT Presentation

About This Presentation
Title:

CSS3 Table Layouts tutorial for Beginner

Description:

CSS3 table layouts tutorials designed for beginners to learn various layouts use to create tables on web pages.it covers auto table,fixed table layouts and border-spacing,border-collapse properties briefly. – PowerPoint PPT presentation

Number of Views:45

less

Transcript and Presenter's Notes

Title: CSS3 Table Layouts tutorial for Beginner


1
CSS3 Table Layouts Tutorial Videos for
Beginners by
2
Highlights
  • Table Layout
  • Auto Table Layout
  • Fixed Table Layout
  • Border-spacing Property
  • Border-collapse Property

3
Table Layout
  •  Sets the table layout algorithm to be used for a
    table.
  • Syntax table  table-layout Value . its
    default value is Initial, it uses inherit
    property to obtain parent properties
  • Table layout value would be anyone of below
    properties.
  •    

4
Auto Table Layout
  • Auto layout value creates automatic table layout
    algorithm.
  • Column width is set by the widest indestructible
    content in the cells.
  • Commonly used by most browsers for table layout. 
  • Width of the table and its cells depends on the
    content.
  • Syntax table table-layout auto

5
Fixed Table Layout
  • Fixed value describes fixed layout algorithm for
    the table.
  • Fixed value Allows a browser to lay out the table
    faster than the automatic table layout.
  •  Browsers starts displaying the table whenever
    the first row has been created.
  • Rendering speed is greater than auto table
    layout.
  • Syntax table table-layout fixed

6
Border-spacing Property
  • Specifies the distance between the borders of
    adjacent table cells.
  • Similar as cell spacing attribute of HTML.
    Syntax border-spacing value
  • Border spacing values three types. They are
    length, horizontal, vertical.
  • Length describes both the horizontal and vertical
    spacing between cells.
  • Horizontal value describes the horizontal spacing
    between cells.
  • Vertical value describes the vertical spacing
    between cells.

7
Border-collapse Property
  • Determines whether a table's borders are
    separated or collapsed.
  • In collapsed model one table cell share borders
    with adjacent cells.
  • Syntax border-collapse value collapse and
    separate are the two values of collapse property.
  • Separate keyword request the use of the separated
    border table rendering model.
  • Collapse keyword request the use of the collapsed
    border table rendering model.
  • Separate is the initial or default value.

8
Feedback
Like It ? Hate It?
We would love to hear from you whatever you think
about the course.
Click HERE to share what you think!
9
Thank you
Thank You for Watching CSS3 Table Layouts
Tutorial Videos for Beginner by
http//www.courseing.com
Write a Comment
User Comments (0)
About PowerShow.com