HTML表格Colspan [英] HTML Table Colspan

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

问题描述

我使用以下HTML代码制作日历:

 <!DOCTYPE HTML PUBLIC -  // W3C / / DTD HTML 4.01 // ENhttp://www.w3.org/TR/html4/strict.dtd\"> 
< html>
< head>< / head>
< body>
< table border =1>
< tr>
< td colspan =2> Mon< / td>
< td colspan =2> Tue< / td>
< td colspan =2>星期三< / td>
< td colspan =2> Thu< / td>
< td colspan =2> Fri< / td>
< / tr>
< tr>
< td colspan =1> Item1< / td>
< td colspan =9> Item2< / td>
< / tr>
< / table>
< / body>



每天都有一个2,以便我可以显示某个项目是在早上还是整日等发生。



在上面的示例中,我希望Item1显示在第一个单元格(周一上午)和周二下午到周五显示的Item2。然而,在查看输出时,Item1占用了整个Mon和Item2显示从星期二到星期五。

是否可以做我想做的事情?



感谢

解决方案

我认为问题在于您实际上必须有 colspan =1,以便您的跨度实际工作。



如果您实际上在日历中代表am / pm ,为什么不只是在Mon Tue ... Fri行中添加一行,如下所示:

 <!DOCTYPE HTML PUBLIC -  // W3C // DTD HTML 4.01 // ENhttp://www.w3.org/TR/html4/strict.dtd\"> 
< html>
< head>
< style>
td,th {min-width:50px; }
< / style>
< / head>
< body>
< table border =1>
< thead>
< tr>
< th colspan =2> Mon< / th>
< th colspan =2> Tue< / th>
< th colspan =2> Wed< / th>
< th colspan =2> Thu< / th>
< th colspan =2> Fri< / th>
< / tr>
< tr>
< th> AM< / th>
< th> PM< / th>
< th> AM< / th>
< th> PM< / th>
< th> AM< / th>
< th> PM< / th>
< th> AM< / th>
< th> PM< / th>
< th> AM< / th>
< th> PM< / th>
< / tr>
< / thead>
< tbody>
< tr>
< td colspan =1> Item1< / td>
< td colspan =9> Item2< / td>
< / tr>
< / tbody>
< / table>
< / body>
< / html>

我也将标题放入< thead> 和实际项目放入一个< tbody> 中,并将标题< th> 标签改为< td>


I am making a calendar using the following HTML code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head></head>
<body>
    <table border="1">
        <tr>
            <td colspan="2">Mon</td>
            <td colspan="2">Tue</td>
            <td colspan="2">Wed</td>
            <td colspan="2">Thu</td>
            <td colspan="2">Fri</td>
        </tr>
        <tr>
            <td colspan="1">Item1</td>
            <td colspan="9">Item2</td>
        </tr>
    </table>
</body>

Each day has a colspan of 2 so that I can show whether an item takes place just in the morning or for a whole day etc.

In the above example I want "Item1" to show in the first cell (Mon morning) and "Item2" to show from Mon afternoon through to Fri.

However, when viewing the output, "Item1" is taking up the whole of Mon and "Item2" is displaying from Tue to Fri.

Is it possible to do what I am trying to do?

Thanks

解决方案

I think the problem is that you'll actually have to have a row with colspan="1" in order for your spans to actually work.

If you're actually representing am/pm in your calendar, why not just add a row under the "Mon Tue ... Fri" row, like so:

 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
  <style>
    td,th { min-width: 50px; }
  </style>
</head>
<body>
  <table border="1">
    <thead>
      <tr>
        <th colspan="2">Mon</th>
        <th colspan="2">Tue</th>
        <th colspan="2">Wed</th>
        <th colspan="2">Thu</th>
        <th colspan="2">Fri</th>
      </tr>
      <tr>
        <th>AM</th>
        <th>PM</th>
        <th>AM</th>
        <th>PM</th>
        <th>AM</th>
        <th>PM</th>
        <th>AM</th>
        <th>PM</th>
        <th>AM</th>
        <th>PM</th>
      </tr>
    </thead>
    <tbody>
      <tr>
        <td colspan="1">Item1</td>
        <td colspan="9">Item2</td>
      </tr>
    </tbody>
  </table>
</body>
</html>

I also put the headers into a <thead> and the actual items into a <tbody>, and made the headers <th> tags instead of <td>.

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

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