Home > Web Front-end > CSS Tutorial > How to skillfully set table borders for table and td

How to skillfully set table borders for table and td

php中世界最好的语言
Release: 2017-11-20 17:37:45
Original
3061 people have browsed it

Many friends are very troubledTableHow to set the style. I mentioned before that I set borders on table and td. Today I will bring you tips on setting table borders for table and td. I will continue update tips and settings about tables in the future. Please continue to pay attention.

Set the left and top borders for td, so that when td and td are adjacent, only a single border style will appear. In this way, there will be no borders on the right and bottom of the table. At this time, we set the right and bottom borders of the table to solve the problem. The right and lower sides of the display are left with undisplayed borders.

1. Corresponding css code:

<style> 
.table-c table{border-right:1px solid #F00;border-bottom:1px solid #F00} 
.table-c table td{border-left:1px solid #F00;border-top:1px solid #F00} 
/* 
只对table td设置左与上边框,对table设置右与下边框; 
*/ 
</style>
Copy after login

2. Corresponding html source code fragment:

<div class="table-c"> 
<table width="400" border="0" cellspacing="0" cellpadding="0"> 
<tr> 
<td width="105">站名</td> 
<td width="181">网址</td> 
<td width="112">说明</td> 
</tr> 
<tr> 
<td>PHP</td> 
<td>www.divcss5.com</td> 
<td>PHP</td> 
</tr> 
<tr> 
<td>PHP</td> 
<td>www.php.cn</td> 
<td>PHP</td> 
</tr>
Copy after login

This is how to set table borders skillfully for table and td, you have learned ?

Related reading:

How to use CSS to set borders on td


How to use CSS only Set a border for the label of the table


##Use DIV and CSS to make a drop-down menu

The above is the detailed content of How to skillfully set table borders for table and td. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template