Examples for table
Basic use of `<table mat-table>`
No. Name Weight Symbol
1 Hydrogen 1.0079 H
2 Helium 4.0026 He
3 Lithium 6.941 Li
4 Beryllium 9.0122 Be
5 Boron 10.811 B
6 Carbon 12.0107 C
7 Nitrogen 14.0067 N
8 Oxygen 15.9994 O
9 Fluorine 18.9984 F
10 Neon 20.1797 Ne
Styling columns using their auto-generated column names
No. Name Weight Symbol
1 Hydrogen 1.0079 H
2 Helium 4.0026 He
3 Lithium 6.941 Li
4 Beryllium 9.0122 Be
5 Boron 10.811 B
6 Carbon 12.0107 C
7 Nitrogen 14.0067 N
8 Oxygen 15.9994 O
9 Fluorine 18.9984 F
10 Neon 20.1797 Ne
Adding and removing data when using an array-based datasource.
No.NameWeightSymbol
1Hydrogen1.0079H
2Helium4.0026He
3Lithium6.941Li
4Beryllium9.0122Be
5Boron10.811B
6Carbon12.0107C
7Nitrogen14.0067N
8Oxygen15.9994O
9Fluorine18.9984F
10Neon20.1797Ne
Table dynamically changing the columns displayed
name weight symbol position
Hydrogen 1.0079 H 1
Helium 4.0026 He 2
Lithium 6.941 Li 3
Beryllium 9.0122 Be 4
Boron 10.811 B 5
Carbon 12.0107 C 6
Nitrogen 14.0067 N 7
Oxygen 15.9994 O 8
Fluorine 18.9984 F 9
Neon 20.1797 Ne 10
Adding and removing data when using an observable-based datasource.
No.NameWeightSymbol
1Hydrogen1.0079H
2Helium4.0026He
3Lithium6.941Li
4Beryllium9.0122Be
5Boron10.811B
6Carbon12.0107C
7Nitrogen14.0067N
8Oxygen15.9994O
9Fluorine18.9984F
10Neon20.1797Ne
Table with expandable rows
name weight symbol position  
Hydrogen 1.0079 H 1
1
H
Hydrogen
1.0079
Hydrogen is a chemical element with symbol H and atomic number 1. With a standard atomic weight of 1.008, hydrogen is the lightest element on the periodic table. -- Wikipedia
Helium 4.0026 He 2
2
He
Helium
4.0026
Helium is a chemical element with symbol He and atomic number 2. It is a colorless, odorless, tasteless, non-toxic, inert, monatomic gas, the first in the noble gas group in the periodic table. Its boiling point is the lowest among all the elements. -- Wikipedia
Lithium 6.941 Li 3
3
Li
Lithium
6.941
Lithium is a chemical element with symbol Li and atomic number 3. It is a soft, silvery-white alkali metal. Under standard conditions, it is the lightest metal and the lightest solid element. -- Wikipedia
Beryllium 9.0122 Be 4
4
Be
Beryllium
9.0122
Beryllium is a chemical element with symbol Be and atomic number 4. It is a relatively rare element in the universe, usually occurring as a product of the spallation of larger atomic nuclei that have collided with cosmic rays. -- Wikipedia
Boron 10.811 B 5
5
B
Boron
10.811
Boron is a chemical element with symbol B and atomic number 5. Produced entirely by cosmic ray spallation and supernovae and not by stellar nucleosynthesis, it is a low-abundance element in the Solar system and in the Earth's crust. -- Wikipedia
Carbon 12.0107 C 6
6
C
Carbon
12.0107
Carbon is a chemical element with symbol C and atomic number 6. It is nonmetallic and tetravalent—making four electrons available to form covalent chemical bonds. It belongs to group 14 of the periodic table. -- Wikipedia
Nitrogen 14.0067 N 7
7
N
Nitrogen
14.0067
Nitrogen is a chemical element with symbol N and atomic number 7. It was first discovered and isolated by Scottish physician Daniel Rutherford in 1772. -- Wikipedia
Oxygen 15.9994 O 8
8
O
Oxygen
15.9994
Oxygen is a chemical element with symbol O and atomic number 8. It is a member of the chalcogen group on the periodic table, a highly reactive nonmetal, and an oxidizing agent that readily forms oxides with most elements as well as with other compounds. -- Wikipedia
Fluorine 18.9984 F 9
9
F
Fluorine
18.9984
Fluorine is a chemical element with symbol F and atomic number 9. It is the lightest halogen and exists as a highly toxic pale yellow diatomic gas at standard conditions. -- Wikipedia
Neon 20.1797 Ne 10
10
Ne
Neon
20.1797
Neon is a chemical element with symbol Ne and atomic number 10. It is a noble gas. Neon is a colorless, odorless, inert monatomic gas under standard conditions, with about two-thirds the density of air. -- Wikipedia
Table with filtering
No. Name Weight Symbol
1 Hydrogen 1.0079 H
2 Helium 4.0026 He
3 Lithium 6.941 Li
4 Beryllium 9.0122 Be
5 Boron 10.811 B
6 Carbon 12.0107 C
7 Nitrogen 14.0067 N
8 Oxygen 15.9994 O
9 Fluorine 18.9984 F
10 Neon 20.1797 Ne
Basic use of `<mat-table>` (uses display flex)
No. Name Weight Symbol 1 Hydrogen 1.0079 H 2 Helium 4.0026 He 3 Lithium 6.941 Li 4 Beryllium 9.0122 Be 5 Boron 10.811 B 6 Carbon 12.0107 C 7 Nitrogen 14.0067 N 8 Oxygen 15.9994 O 9 Fluorine 18.9984 F 10 Neon 20.1797 Ne
Flex table where one column's cells has a greater height than others.
No. Name Weight Symbol 1 Hydrogen 1.0079 H 2 Helium 4.0026 He 3 Lithium 6.941 Li 4 Beryllium 9.0122 Be 5 Boron 10.811 B 6 Carbon 12.0107 C 7 Nitrogen 14.0067 N 8 Oxygen 15.9994 O 9 Fluorine 18.9984 F 10 Neon 20.1797 Ne
Footer row table
Item Cost
Beach ball $4.00
Towel $5.00
Frisbee $2.00
Sunscreen $4.00
Cooler $25.00
Swim suit $15.00
Table with columns defined using a for loop instead of statically written in the template.
No. Name Weight Symbol
1 Hydrogen 1.0079 H
2 Helium 4.0026 He
3 Lithium 6.941 Li
4 Beryllium 9.0122 Be
5 Boron 10.811 B
6 Carbon 12.0107 C
7 Nitrogen 14.0067 N
8 Oxygen 15.9994 O
9 Fluorine 18.9984 F
10 Neon 20.1797 Ne
Testing with MatTableHarness
This example contains tests. Open in Stackblitz to run the tests.
Table retrieving data through HTTP
Created
State#Title
Feb 5, 2025open30448docs-bug(button): Change icon button size missing
Feb 4, 2025open30447bug(MatAutoComplete): requiredSelection value racecon on panel close
Feb 4, 2025open30446fix(material/core): remove animations from ng add
Feb 4, 2025open30445bug(MatTree): expandAll() only expand the first level
Feb 4, 2025open30444bug(Theming): When creating a theme using `mat.theme(` there is no way to configure typography like how we have with `mat.define-theme`
Feb 3, 2025closed30443build: fix failing test
Feb 3, 2025open30442docs-bug(MatFormFieldControl): Update "Creating a Custom Form Field Control" for Signals
Feb 3, 2025closed30441refactor(material/schematics): drop standalone flag from schematics
Feb 3, 2025open30440perf(material/tooltip): Defer injection of injectables not needed unt…
Feb 3, 2025open30439bug(cdkDrag): Items in DropLIst Jump Down When Using DragBoundary or ConstrainPosition with Custom Preview
Feb 3, 2025closed30438fix(material/datepicker): set aria-expanded on datepicker toggle
Feb 2, 2025closed30437docs(material-angular-io): fix clearing filter doesnt reset type filter
Feb 2, 2025open30436feat(cdk/drag-drop): introduce `resetToBoundary`
Feb 2, 2025closed30435Remove animations dependency from the public API
Feb 2, 2025open30434fix(material/radio): required attribute being set on buttons
Feb 1, 2025closed30433docs: update links for Shadow DOM & Constructable Stylesheets
Feb 1, 2025closed30432docs: add commit input validation in vscode settings
Feb 1, 2025open30431fix(cdk/tree): retainining previous objects
Jan 31, 2025open30430fix(material/chips): creates default aria-labelledby or placeholder for chips input
Jan 31, 2025open30429fix(material/chips): forced colors disabled chip fix
Jan 31, 2025closed30428perf(material/button): Optimize the remaining descendant state selector.
Jan 31, 2025closed30427fix(material/sidenav): end positioned sidenav not opening in RTL
Jan 31, 2025open30426bug(cdk/overlay): repeatedly opening and closing the overlay via (backdropClick) breaks responsiveness to clicks
Jan 31, 2025open30425docs-bug(button): I don't understand how to use most of design tokens
Jan 31, 2025closed30424Updated selectors in CSS snippet as per HTML snippet
Jan 30, 2025closed30423Bump version to "v19.2.0-next.2" with changelog.
Jan 30, 2025closed30422bug(mat-drawer): mat-drawer position="end" is broken in RTL since v19.0.5
Jan 30, 2025open30421feat(Timepicker): Implement a MAT_TIMEPICKER_SCROLL_STRATEGY for the component
Jan 30, 2025open30420bug(map-advanced-marker): mapMouseover and mapMouseout events not working on map-advanced-marker
Jan 30, 2025open30419docs(dialog-harness): fix typo
Items per page:
30
1 – 30 of 30253
Table with multiple header and footer rows
Item Cost
Name of the item purchased Cost of the item in USD
Beach ball $4.00
Towel $5.00
Frisbee $2.00
Sunscreen $4.00
Cooler $25.00
Swim suit $15.00
Table with multiple row template
No.NameWeightSymbol
1Hydrogen1.0079H
Secondary row for the element Hydrogen
2Helium4.0026He
Secondary row for the element Helium
3Lithium6.941Li
Secondary row for the element Lithium
4Beryllium9.0122Be
Secondary row for the element Beryllium
5Boron10.811B
Secondary row for the element Boron
6Carbon12.0107C
Secondary row for the element Carbon
7Nitrogen14.0067N
Secondary row for the element Nitrogen
8Oxygen15.9994O
Secondary row for the element Oxygen
9Fluorine18.9984F
Secondary row for the element Fluorine
10Neon20.1797Ne
Secondary row for the element Neon
11Sodium22.9897Na
Secondary row for the element Sodium
12Magnesium24.305Mg
Secondary row for the element Magnesium
13Aluminum26.9815Al
Secondary row for the element Aluminum
14Silicon28.0855Si
Secondary row for the element Silicon
15Phosphorus30.9738P
Secondary row for the element Phosphorus
16Sulfur32.065S
Secondary row for the element Sulfur
17Chlorine35.453Cl
Secondary row for the element Chlorine
18Argon39.948Ar
Secondary row for the element Argon
19Potassium39.0983K
Secondary row for the element Potassium
20Calcium40.078Ca
Secondary row for the element Calcium
Data table with sorting, pagination, and filtering.
ID
Name
Progress
Fruit
1 Violet A. 51% pomegranate
2 Amelia I. 84% lime
3 Cora A. 88% kiwi
4 Jack J. 84% pineapple
5 Jack J. 66% pomegranate
Items per page:
1 – 5 of 100
Table with pagination
No. Name Weight Symbol
1 Hydrogen 1.0079 H
2 Helium 4.0026 He
3 Lithium 6.941 Li
4 Beryllium 9.0122 Be
5 Boron 10.811 B
Items per page:
1 – 5 of 20
Table that uses the recycle view repeater strategy.
No. Name Weight Symbol
1 Hydrogen 1.0079 H
2 Helium 4.0026 He
3 Lithium 6.941 Li
4 Beryllium 9.0122 Be
5 Boron 10.811 B
6 Carbon 12.0107 C
7 Nitrogen 14.0067 N
8 Oxygen 15.9994 O
9 Fluorine 18.9984 F
10 Neon 20.1797 Ne
Table with re-orderable columns
No. Name Weight Symbol
1 Hydrogen 1.0079 H
2 Helium 4.0026 He
3 Lithium 6.941 Li
4 Beryllium 9.0122 Be
5 Boron 10.811 B
6 Carbon 12.0107 C
7 Nitrogen 14.0067 N
8 Oxygen 15.9994 O
9 Fluorine 18.9984 F
10 Neon 20.1797 Ne
Binding event handlers and properties to the table rows.
No.NameWeightSymbol
1Hydrogen1.0079H
2Helium4.0026He
3Lithium6.941Li
4Beryllium9.0122Be
5Boron10.811B
6Carbon12.0107C
7Nitrogen14.0067N
8Oxygen15.9994O
9Fluorine18.9984F
10Neon20.1797Ne

Click Log

Clicked rows will be logged here
Table showing each row context properties.
$implicit index count first last even odd
one 0 5 true false true false
two 1 5 false false false true
three 2 5 false false true false
four 3 5 false false false true
five 4 5 false true true false
Table with selection
No. Name Weight Symbol
1 Hydrogen 1.0079 H
2 Helium 4.0026 He
3 Lithium 6.941 Li
4 Beryllium 9.0122 Be
5 Boron 10.811 B
6 Carbon 12.0107 C
7 Nitrogen 14.0067 N
8 Oxygen 15.9994 O
9 Fluorine 18.9984 F
10 Neon 20.1797 Ne
Table with sorting
No.
Name
Weight
Symbol
1 Hydrogen 1.0079 H
2 Helium 4.0026 He
3 Lithium 6.941 Li
4 Beryllium 9.0122 Be
5 Boron 10.811 B
6 Carbon 12.0107 C
7 Nitrogen 14.0067 N
8 Oxygen 15.9994 O
9 Fluorine 18.9984 F
10 Neon 20.1797 Ne
Table with sticky columns
Name No. Weight Symbol No. Weight Symbol  
Hydrogen 1 1.0079 H 1 1.0079 H
Helium 2 4.0026 He 2 4.0026 He
Lithium 3 6.941 Li 3 6.941 Li
Beryllium 4 9.0122 Be 4 9.0122 Be
Boron 5 10.811 B 5 10.811 B
Carbon 6 12.0107 C 6 12.0107 C
Nitrogen 7 14.0067 N 7 14.0067 N
Oxygen 8 15.9994 O 8 15.9994 O
Fluorine 9 18.9984 F 9 18.9984 F
Neon 10 20.1797 Ne 10 20.1797 Ne
Flex-layout tables with toggle-able sticky headers, footers, and columns
Sticky Headers:
Sticky Footers:
Sticky Columns:
Position Name Filler header cell Filler header cell Filler header cell Filler header cell Filler header cell Filler header cell Filler header cell Filler header cell Filler header cell Filler header cell Filler header cell Filler header cell Filler header cell Filler header cell Filler header cell Filler header cell Filler header cell Filler header cell Filler header cell Filler header cell Weight Symbol Position Name Filler header cell Filler header cell Filler header cell Filler header cell Filler header cell Filler header cell Filler header cell Filler header cell Filler header cell Filler header cell Filler header cell Filler header cell Filler header cell Filler header cell Filler header cell Filler header cell Filler header cell Filler header cell Filler header cell Filler header cell Weight Symbol 1 Hydrogen Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell 1.0079 H 2 Helium Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell 4.0026 He 3 Lithium Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell 6.941 Li 4 Beryllium Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell 9.0122 Be 5 Boron Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell 10.811 B 6 Carbon Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell 12.0107 C 7 Nitrogen Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell 14.0067 N 8 Oxygen Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell 15.9994 O 9 Fluorine Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell 18.9984 F 10 Neon Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell 20.1797 Ne Position Footer Name Footer Filler footer cell Filler footer cell Filler footer cell Filler footer cell Filler footer cell Filler footer cell Filler footer cell Filler footer cell Filler footer cell Filler footer cell Filler footer cell Filler footer cell Filler footer cell Filler footer cell Filler footer cell Filler footer cell Filler footer cell Filler footer cell Filler footer cell Filler footer cell Weight Footer Symbol Footer Position Footer Name Footer Filler footer cell Filler footer cell Filler footer cell Filler footer cell Filler footer cell Filler footer cell Filler footer cell Filler footer cell Filler footer cell Filler footer cell Filler footer cell Filler footer cell Filler footer cell Filler footer cell Filler footer cell Filler footer cell Filler footer cell Filler footer cell Filler footer cell Filler footer cell Weight Footer Symbol Footer
Tables with toggle-able sticky headers, footers, and columns
Sticky Headers:
Sticky Footers:
Sticky Columns:
Position Name Filler header cell Filler header cell Filler header cell Filler header cell Filler header cell Filler header cell Filler header cell Filler header cell Filler header cell Filler header cell Filler header cell Filler header cell Filler header cell Filler header cell Filler header cell Filler header cell Filler header cell Filler header cell Filler header cell Filler header cell Weight Symbol
Position Name Filler header cell Filler header cell Filler header cell Filler header cell Filler header cell Filler header cell Filler header cell Filler header cell Filler header cell Filler header cell Filler header cell Filler header cell Filler header cell Filler header cell Filler header cell Filler header cell Filler header cell Filler header cell Filler header cell Filler header cell Weight Symbol
1 Hydrogen Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell 1.0079 H
2 Helium Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell 4.0026 He
3 Lithium Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell 6.941 Li
4 Beryllium Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell 9.0122 Be
5 Boron Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell 10.811 B
6 Carbon Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell 12.0107 C
7 Nitrogen Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell 14.0067 N
8 Oxygen Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell 15.9994 O
9 Fluorine Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell 18.9984 F
10 Neon Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell Filler data cell 20.1797 Ne
Table with a sticky footer
Item Cost
Beach ball $4.00
Towel $5.00
Frisbee $2.00
Sunscreen $4.00
Cooler $25.00
Swim suit $15.00
Table with sticky header
No. Name Weight Symbol
1 Hydrogen 1.0079 H
2 Helium 4.0026 He
3 Lithium 6.941 Li
4 Beryllium 9.0122 Be
5 Boron 10.811 B
6 Carbon 12.0107 C
7 Nitrogen 14.0067 N
8 Oxygen 15.9994 O
9 Fluorine 18.9984 F
10 Neon 20.1797 Ne
Use of 'mat-text-column' with various configurations of the interface.
Position Element Weight Symbol
1 Hydrogen 1.01 H
2 Helium 4 He
3 Lithium 6.94 Li
4 Beryllium 9.01 Be
5 Boron 10.81 B
6 Carbon 12.01 C
7 Nitrogen 14.01 N
8 Oxygen 16 O
9 Fluorine 19 F
10 Neon 20.18 Ne
Use of `mat-text-column` which can be used for simple columns that only need to display a text value for the header and cells.
Position Name Weight Symbol
1 Hydrogen 1.0079 H
2 Helium 4.0026 He
3 Lithium 6.941 Li
4 Beryllium 9.0122 Be
5 Boron 10.811 B
6 Carbon 12.0107 C
7 Nitrogen 14.0067 N
8 Oxygen 15.9994 O
9 Fluorine 18.9984 F
10 Neon 20.1797 Ne
Tables with Material Design ripples.
Name Hydrogen Helium Lithium Beryllium Boron Carbon Nitrogen Oxygen Fluorine Neon
Table example that shows how to wrap a table component for definition and behavior reuse.
No.
Name
Weight
Symbol
1 Hydrogen 1.0079 H
2 Helium 4.0026 He
3 Lithium 6.941 Li
4 Beryllium 9.0122 Be
5 Boron 10.811 B
6 Carbon 12.0107 C
7 Nitrogen 14.0067 N
8 Oxygen 15.9994 O
9 Fluorine 18.9984 F
10 Neon 20.1797 Ne