News:

This week IPhone 15 Pro winner is karn
You can be too a winner! Become the top poster of the week and win valuable prizes.  More details are You are not allowed to view links. Register or Login 

Main Menu

How to specify font styles for text inside tables, the easy way

Started by charleychacko, October 13, 2006, 02:07:03 PM

Previous topic - Next topic

0 Members and 1 Guest are viewing this topic.

Print
Go Down Pages1
User actions

charleychacko

October 13, 2006, 02:07:03 PM
If you're using font tags inside large tables to change the style of the text inside cells, you maybe making your pages larger than necessary.

Let's look at the following sample table. Note how the FONT tags are being used to set the font style of text inside each cell. If you have a large table, these font style tags could multiply the size of your page, specially if the text inside the cells are smaller than the font tags.

<table border=1>

<tr><td>
  <font face="Arial">test 1</font>
</td></tr>

<tr><td>
  <font face="Arial">test 2</font>
</td></tr>

<tr><td>
  <font face="Arial">test 3</font>
</td></tr>

<tr><td>
  <font face="Arial">test 4</font>
</td></tr>

</table>
Listing #1 : HTML code. Download tblcss1.html (0.22 KB).

If your visitors are using Cascading Style Sheets enabled browsers such as {X_CSSBROWSERS} or compatible, you could use the TD{font-family: Arial; font-size: 10pt;} style sheet tag as follows. Doing so will make text inside all TD tags use the specified font face and other specified attributes such as the font size.

<html>
<head>

<STYLE TYPE="text/css">
<!--
TD{font-family: Arial; font-size: 10pt;}
--->
</STYLE>

</head>
<body>

<table border=1>
<tr><td> test 1 </td></tr>
<tr><td> test 2 </td></tr>
<tr><td> test 3 </td></tr>
<tr><td> test 4 </td></tr>
</table>

</body>
</html>
Listing #2 : HTML code. Download tblcss2.html (0.29 KB).
Print
Go Up Pages1
User actions