Table Zebra Stripes in Punjabi | Table Styling | HTML Tutorials | Online HTML Editor | CSPunjab.Com

Описание: If you add a background color on every other table row, you will get a nice zebra stripes effect.

To style every other table row element, use the :nth-child(even) selector like this:

Introducing new website & Social Media Pages
----------------------------------------
Web-Site » » https://www.cspunjab.com/
YouTube » »    / @cspunjab  
Instagram » »   / cspunjab  
Facebook » »   / cspunjabcom  
Twitter » »   / cspunjabcom  
----------------------------------------
Like, Comment, Share, Follow and SubScribe
----------------------------------------

Pseudo-class :nth-child()

The :nth-child() pseudo-class represents an element that has an+b siblings before it in the document tree, for any positive integer or zero value of n, and has a parent element.

Syntax
selector:nth-child(an+b){ properties }

The examples of an+b are as follows:
 :nth-child(2n) /* represents every even element */
 :nth-child(even) /* same, represents every even element */
 :nth-child(2n+1) /* represents every odd element */
 :nth-child(odd) /* same, represents every odd element */
 :nth-child(10n-1) /* represents the 9th, 19th, 29th, etc, element */
----------------------------------------
YouTube » »    • Table Zebra Stripes in Punjabi | Table Sty...  

Live Demo & try youself » »

Table Styling
1) Zebra Stripes » » https://www.cspunjab.com/html/9m8712-...
2) Vertical Zebra Stripes » » https://www.cspunjab.com/html/qrk512-...
3) Combine Vertical and Horizontal Zebra Stripes » » https://www.cspunjab.com/html/5zos12-...
4) Horizontal Dividers » » https://www.cspunjab.com/html/67oj12-...
5) Hoverable Table » » https://www.cspunjab.com/html/ghyj12-...

Blogger » »
Table Styling
----------------------------------------
#html #table #css #border #editor #alignment #gssskhokhar #computerfaculty #bintuchaudhary
#htmltutorial #htmltutorialinpunjabi #python #alu #imu #django #programmer #programming #coding #coder
----------------------------------------
https://www.nusratsahb.com/
https://www.gssskhokhar.com/
   / @bintuchaudhary  
  / bintu.chaudhary  
  / bintu.chaudhary.mks