登录 | 注册 | FAQ
Anonymous

关于表格显示。请大师们过来指导下

+ 发表回复

3 篇帖子 分页: 1 / 1


关于表格显示。请大师们过来指导下

tatus » 周三 2月 05, 2014 12:30 am

为何我做出的表格是这种显示?每个文字都被独立的框框给框起来了。而非两个单元格中间公用一条线?

附件

  1. 2014-02-05_082738.png (644 Bytes) 被下载 3013 次

头像

tatus

  • 帖子: 1
  • 注册: 周三 2月 05, 2014 12:17 am

Re: 关于表格显示。请大师们过来指导下

XainPro » 周三 2月 05, 2014 7:42 pm

代码: 全选
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>

<body>
<table width="200" border="1" cellspacing="0" cellpadding="1">
  <tr>
    <td colspan="2" align="center">1</td>
  </tr>
  <tr>
    <td align="center">2</td>
    <td align="center">3</td>
  </tr>
</table>
</body>
</html>

头像

XainPro

  • 帖子: 3933
  • 注册: 周五 2月 17, 2012 8:10 pm

Re: 关于表格显示。请大师们过来指导下

fionawu » 周六 2月 15, 2014 9:27 pm

您可能還是需要以 css 改善表格外觀, HTML 預設的 table attribute 很少, 且您把 border 設為 1, 其下的 tr, td 皆會有 外框.
我將原姓名列改為以 caption 顯示
caption 定義為表格標題。必須緊隨table 標籤之後, 只能對每個表格定義一個標題。通常這個標題會被居中於表格之上.
HTML如下:
代码: 全选
  <table width="200" border="0" cellspacing="1" cellpadding="0" >
      <caption>姓名</caption>
  <tr>
   <td align="center" bgcolor="#FFFFFF">分數</td>
    <td align="center" bgcolor="#FFFFFF">分數</td>
  </tr>
  <tr>
  <td align="center" bgcolor="#FFFFFF">100</td>
   <td align="center" bgcolor="#FFFFFF">80</td>
  </tr>
</table>


css 設定如下 :
代码: 全选
table {
   line-height: 1.6;
   padding: 0px;
}
table caption {
   display: table-caption;
   text-align: center;
   background-color: #FFFFFF;
   margin-top: 1px;
   margin-right: 1px;
   margin-bottom: 0;
   margin-left: 1px;
}

附件

  1. table.jpg (27.83 KiB) 被下载 3213 次

头像

fionawu

  • 帖子: 3
  • 注册: 周一 12月 09, 2013 1:28 am
--
Fiona Wu.


+ 发表回复

分页: 1 / 1