How to create zebra stripes on the html table without using javascript generation and unpaired or odd classes?

I want to zebra-stripe a html table without using any js stuff or writing server-side code to generate even/odd classes for table rows. Is it ever possible to do using raw css?

It is possible, with CSS3 selectors:

tr:nth-child(even) {
  background-color: red;
}

tr:nth-child(odd) {
  background-color: white;
}

According to caniuse.com, every browser supports it now.

Load the CSS file in the head section or in the HTML section without using Javascript

I have a web page in which I add a css file in head section using javascript code from the bootom of the page: $(document).ready(function(){ var css=document.createElement('link'); css.type='text/css'; css.href='/css/user.css'; css.rel='stylesheet';

How to create a yii form with HTML tag without using CAactive and CHtml?

I am new to Yii and have created a form in pure HTML code Here TesterUserReg is the different controller.. <form id="signup" action="/xyzApp/index.php?r=testerUserReg/create" method="post" accept-charser="UTF-8"&

Adding multiple rows to the html table dynamically using javascript

Adding a single row in a table (html) and deleting it, using JavaScript, is simple. But, is it possible to add multiple rows, like 2 or more, by calling the addrow function only once? The added rows will have different elements, like first row will b

How to create three elements of the same size without javascript?

I have three columns and inside each one there is an element with the class text-container. I want them all to be the same height as the tallest one, without using JavaScript. This is the code: <div class="column"> <!--more elements--&g

How to create a text file on a client machine using javascript or jquery

How to create a text file on a client machine using javascript or jqueryit is possible on IE and firefox... but wonder how it will work on Safari and Crome searching the same... for FF netscape.security.PrivilegeManager.enablePrivilege("UniversalXPCo

Analyze the HTML document without using a tag or any other selector in Java

I have a HTML page, lets say http://www.crisil.com/Ratings/RatingList/RatingDocs/_G_Telecom_Infra_India_Private_Limited_August_28_2015_RR.html I want to parse About the Company paragraph and the below table without using any kind of selector or XPath

How to load the JSON file on an HTML table? Using JavaScript

My json file, named as "subject.json" contains: [ { "subject":"ProgApps", "codeNo":"9594", "courseNo":"IT 312L", "instructor":"Maria Clemente Concepcion" }, { "

How to create a simple graphical interface in python without using tools such as Tkinter, Eclipse, etc?

I'm making an app using python. I want a very simple user interface just to read a query. It should contain a text box where to type the query and a submit button. Can I make such an interface without using any drag and drop softwares, i.e just by us

How to remove a row from the parent table without deleting a row from the child table?

Am having parent table which has foreign three foreign key but i want to delete row in parent table alone ,how to achieve it ?? The query that am using currently is DELETE FROM TableName WHERE ColumnName= '89416' The query show error: Cannot delete o

How do I create JSON from the HTML table parsed using Nokogiri?

I want to create A JSON object from each TR from this site. For now I'm able to get the whole table and each TR but it is not enough... That's why I'm confused. Here is an example of the JSON I want in return. This one is for chapter 07: { "chapter&q

How does a zebra style CSS for HTML table?

I would like to make a Zebra style on my PHP table for each row. Now with the above CSS code that i have: table.imagetable td:nth-child(odd) { background-color:#ccc; } I have Zebra style but only for each column which is not desirable. Any ideas of h

How to send server data to the html page without a request

I'm in the process of building my first site, so far I figures out how to make ajax calls to request data from servlets. Now I need to make a notification system, in which the html page may receive data from the server without requesting it. (such as

how to extract data from the html table by using jQuery each function

I'm need to extract data from a html table to create a JSON array. Here is the structure of HTML table, <table class="tableClass"> <thead class="tableHeaderClass" > <tr> <th>header_column1</th> <th>h

How to disable all lines in the HTML table?

[Not exactly the same as the question "how to disable knockout click...". My question involves specific usage of an HTML table and contains valuable approaches on solving such case.] I have the following table and button below it: <table>

Related Articles