Creation and application of styles with CSS to make tables with an attractive decoration but easy to apply.
CSS are Cascading Style Sheets. Many of you must already know them and I suppose you have used them on more than one occasion. In any case, both to learn what they are and to strengthen your knowledge, you can access .com.
We are going to see a use of CSS that can be very interesting to make tables with titles that have a certain style. The good thing about CSS is that we can define the style once and it can be used on multiple page elements. With all this we are going to deal in this article: the definition of a style and the application to make different types of table decoration.
We can we’re going to get.
Defining the styles
In the header of the page we place the
Style attributes can be found in the CSS manual. In this case, for the tablestyle class we are defining a background color, a solid border, a border color, and a border width, in that order. For the cellstyle class we are defining a background color, a text color, a font weight, and a font size.
Use of styles to obtain a decorated table
Let's see the code for the first table in the example.
| Section title |
| This is a text of what could be the bottom of the table with the content related to this title. |
The only thing special about it is that it uses the classes that have been previously defined. The
| tag that we want to be the headline. The other cell will have the style defined for all cells in general.
The other table would have this code.
In this case we use two tables to do the effect. The table above has a border and the table below does not. To do this we apply the class defined for the table and the cell only in the table above, so the border defined in the style declaration only affects the table above. Can .
|
Facebook Comments
Disqus