BOOTSTRAP3 Learning Notes (iii) Form _JAVASCRIPT skills

In the previous article to introduce the BOOTSTRAP3 learning notes (i) of the grid system BOOTSTRAP3 learning notes (ii) of the typesetting

You only need to use the. Table class on the Table tab to use the Bootstrap default table style

If you want alternating changes to the row background, you can set this:

Copy Code code as follows:

<table class= "Table table-striped" >

If you need a border, you can set it this way:

Copy Code code as follows:

<table class= "Table table-bordered" >

If you want the mouse to move to a content row that has a response effect, you can set this:

Copy Code code as follows:

<table class= "Table Table-hover" >

If you want the table to be compact a little space-saving, you can set this, cell pedding will be halved to 4px, the default padding is 8px:

Copy Code code as follows:

<table class= "Table table-condensed" >

You can also add a specific style to a row:

<TR class= "Active" >
<tr class= "Success" >
<tr class= "info" >
<tr class= "Warning" >
<tr class= "Danger" >

For a consistent display on different devices, you can use a response setting on the table, decorated with div outside the table, and automatically adapt to devices less than or greater than 768px:

Copy Code code as follows:

<div class= "Table-responsive" >

Bootstrap supported table elements:

The above is a small set to introduce the BOOTSTRAP3 learning notes (iii) of the relevant knowledge of the table, I hope to help you, if you have any questions please give me a message, small series will promptly reply to everyone. Here also thank you very much for the cloud Habitat Community website support!