关于 html中css控制表格格式 和 colspan 的问题
代码如下<!DOCTYPEhtml><html><head><metahttp-equiv="Content-Type"content="text/html;charse...
代码如下
<!DOCTYPE html><html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><style type="text/css">table { width:320px; border:0px solid #f0f; border-collapse:collapse; }.long { width:40px; border:5px solid #f0f; }.short { width:40px; border:0px; }</style></head><body>
<table border="1"><tr> <td class="short">1</td> <td class="short">1</td> <td class="short">1</td> <td class="long" colspan="2">100</td> <td class="short"> 1</td> <td class="short">1 </td> <td class="short"> 1</td></tr><tr> <td class="short">1 </td> <td class="short"> 1</td> <td class="long" colspan="2">400</td> <td class="long" colspan="2">600</td> <td class="short">1 </td> <td class="short">1 </td></tr><tr> <td class="short"> 1</td> <td class="long" colspan="2">400</td> <td class="long" colspan="2">600</td> <td class="long" colspan="2">600</td> <td class="short"> 1</td></tr><tr> <td class="long" colspan="2">400</td> <td class="long" colspan="2">600</td> <td class="long" colspan="2">600</td> <td class="long" colspan="2">400</td></tr></table></body></html>
预览效果
问题是：为什么那些紫色的表格不一样宽，我想做成一样宽的效果 该怎么修改 展开
<!DOCTYPE html><html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><style type="text/css">table { width:320px; border:0px solid #f0f; border-collapse:collapse; }.long { width:40px; border:5px solid #f0f; }.short { width:40px; border:0px; }</style></head><body>
<table border="1"><tr> <td class="short">1</td> <td class="short">1</td> <td class="short">1</td> <td class="long" colspan="2">100</td> <td class="short"> 1</td> <td class="short">1 </td> <td class="short"> 1</td></tr><tr> <td class="short">1 </td> <td class="short"> 1</td> <td class="long" colspan="2">400</td> <td class="long" colspan="2">600</td> <td class="short">1 </td> <td class="short">1 </td></tr><tr> <td class="short"> 1</td> <td class="long" colspan="2">400</td> <td class="long" colspan="2">600</td> <td class="long" colspan="2">600</td> <td class="short"> 1</td></tr><tr> <td class="long" colspan="2">400</td> <td class="long" colspan="2">600</td> <td class="long" colspan="2">600</td> <td class="long" colspan="2">400</td></tr></table></body></html>
预览效果
问题是：为什么那些紫色的表格不一样宽，我想做成一样宽的效果 该怎么修改 展开
1个回答
展开全部
每一行就是一个人tr对么 里面有几个单元格 就是几个td 第一行应该是7个单元格 但你想用一个单元格占满 那么请在第一个tr里只写一个td 然后td里 写 colspan=7 文本居中 style=“text-align：center” 第二行2哥单元格 写2哥td然后 每个td里写 colspan=3 下面的以此类推
追问
我不是想要用一个单元格占满第一行 而是想把第一行7个单元格中间的那个单元格显示边框，其他的不显示 其实原来我是想弄成图片这个样子，每个单元格一样宽。
然后我原本是想把显示出的单元格都调成 colspan=2 其他白色部分是不带边框和内容的单元格以达到图片的效果 但不知道为什么用了上面的代码，单元格显示不一样宽
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
