Quote: https://blog.csdn.net/aojiancc2/article/details/52130774
One: Apply page
Templates have a specialized content pages are blank page blank page, to help us apply the right menu, we do not need to stay a few deleted it
Right-source location of the content we can easily see,
In fact, he notes, and the style name clearly expressed, this (class = "container-fluid") style following the content is put too
Two: Use simple table
1: We find the basic table just to copy a table out
Note: If we are to find time in accordance with the style, then go to the query there may be a number, though the best is to go with the name, but the name is also a small chance of such repeated here Adance Table
In fact, we are right in your browser, right-edit as html source code directly copied, and more convenient than in a Web page to find a
Add the copy and paste into effect as follows:
The main problem with this table now is not the width of the adaptive filling up the content pages, looking for a long time to find, in fact, a style called span6 on a div
Can be removed
Tested fact class = "span6", if the change span7 is broadened, the greater the value the wider
Three: Edit the table plus columns
1: Copy the table that have the Edit button over the outside of class = "span6" adaptive remove him and put out his copy a few buttons
Results are as follows:
His adaptation led the Action column too long, we can add their own style within a line, specify a broadband
Results are as follows:
How to change their pitch it? Add an inline style magin-left directly on a label, just add a comparison look
Results are as follows:
Changing operation button icons, bootstrap template There is an icon there are many pages copied directly to the style inside the line
Just change a few
Results are as follows:
To add a block-level element when the top button style icon is removed leaving only the job attention span width setting
Results are as follows:
Four: the table style used to explain
1: table-bordered table plus border effect
2: table-advance header color effect
Note that if he and table-bordered simultaneous action would not add border effects
3: table-striped color effect interlacing
Demo Download:
http://download.csdn.net/detail/aojiancc2/9596750
----------------
Disclaimer: This article is CSDN blogger "aojiancc2 'original article, follow the CC 4.0 BY -SA copyright agreement, reproduced, please attach the original source link and this statement.
Original link: https: //blog.csdn.net/aojiancc2/article/details/52130774