html colspan rowspan [英] html colspan rowspan

查看:143
本文介绍了html colspan rowspan的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我使用html table,colspan和rowspan。我想创建这样的表:

 ._______________________。 
| | | |
| ______ | _______ | _______ |
| ___ | ___ | | ___ | ___ |
| | _______ | |
| _______ | ___ | ___ | _______ |

但找不到解决方案!请帮忙!

c $ c> rowspan 属性,查看我的示例以了解它是如何完成的。当< td> 有一个 colspan rowspan 它被展开,并且跳过该位置的下一个< td> >(参见最后一个< tr> code>只有2 < td> s)。 $ b



jsFiddle

 < table> 
< tr>
< td colspan =6>& nbsp;< / td>
< / tr>
< tr>
< td>& nbsp;< / td>
< td>& nbsp;< / td>
< td colspan =2rowspan =2>& nbsp;< br />& nbsp;< / td>
< td>& nbsp;< / td>
< td>& nbsp;< / td>
< / tr>
< tr>
< td colspan =2rowspan =2>& nbsp;< br />& nbsp;< / td>
< td colspan =2rowspan =2>& nbsp;< br />& nbsp;< / td>
< / tr>
< tr>
< td>& nbsp;< / td>
< td>& nbsp;< / td>
< / tr>
< / table>


I work with html table, colspan and rowspan. I want to create table like this:

._______________________.
|       |       |       |
|______ |_______|_______|
|___|___|       |___|___|
|       |_______|       |      
|_______|___|___|_______| 

But can't find solution! Please help!

解决方案

You need to use the colspan and rowspan attributes, examine my example to see how it's done. When you a <td> has a colspan or rowspan it is expanded and the next <td> that is meant to be in that position is skipped (see the last <tr> only has 2 <td>s).

jsFiddle

<table>
    <tr>
        <td colspan="6">&nbsp;</td>
    </tr>
    <tr>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td colspan="2" rowspan="2">&nbsp;<br />&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
    </tr>
    <tr>
        <td colspan="2" rowspan="2">&nbsp;<br />&nbsp;</td>
        <td colspan="2" rowspan="2">&nbsp;<br />&nbsp;</td>
    </tr>
    <tr>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
    </tr>
</table>

这篇关于html colspan rowspan的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆