WTiny 2015-10-05 08:08 采纳率: 50%
浏览 9069
已采纳

html表格的宽度和高度如何不受内容影响

题目要求我的结果我的结果

我的代码

<head>
<title>行走在路上旅游</title>
</head>
<body>
  <table align="center" width="65%" height="760" bgcolor="F0F7FF">
  <tr>
  <td colspan="3" align="center"><img src="E:\web\实验一\MyFirstWebsite\images\images\7stars.jpg" width="100%" height="180"></td>
  </tr>
  <tr>
  <td background="E:\web\实验一\MyFirstWebsite\images\images\dbj.jpg" align="center" colspan="3" height="20"><a href="#">首页</a>丨<a href="#">旅行社介绍</a>
  丨<a href="#">管理员入口</a>丨<a href="#">路线预订</a>丨<a href="#">
  我要留言</a>丨<a href="#">查看留言</a></td>
  </tr>
  <tr>
  <td rowspan="6">
  <table height="760">
  <tr>
  <td background="E:\web\实验一\MyFirstWebsite\images\images\dbj.jpg" align="center" height="20" width="300"><font>青岛周边旅游</font></td>
  </tr>
  <tr>
  <td align="riight" height="200"><a href="#">樱珠采摘游 青岛旅行社 神游华夏樱珠采摘一晚二日游</a><br/><br/><a href="#">青岛去泰山旅游 泰山旅游路线 泰山二日游</a><br/><br/>
  <a href="#">青岛周边旅游 竹泉村、大峡谷、蒙山大巴二日游</a><br/><br/><a href="#">蓬莱、长岛二日游(纯玩)</a><br/><br/>
  <a href="#">南山大佛、牟氏庄园、淘金小镇豪华大巴二日游</a></td>
  </tr>
  <tr>
  <td background="E:\web\实验一\MyFirstWebsite\images\images\dbj.jpg" align="center" height="20"><font>出行参考</font></td>
  </tr>
  <tr>
  <td align="center" height="300"><ul><li><a href="#">1</a></li><li><a href="#">2</a></li><li><a href="#">3</a></li></ul></td>
  </tr>
  <tr>
  <td background="E:\web\实验一\MyFirstWebsite\images\images\dbj.jpg" align="center" height="20"><font>友情广告</font></td>
  </tr>
  <tr>
  <td align="center" height="200"><embed 大大声点src="E:\web\实验一\MyFirstWebsite\media\media\topFlash.swf" width="" height="200"></td>
  </tr>
  </table>
  </td>
  <td rowspan="6">
  <table height="650">
  <tr>
  <td height="20"><marquee>大家好,欢迎访问行走在路上旅游</marquee></td>
  </tr>
  <tr>
  <td align="center" height="20" background="E:\web\实验一\MyFirstWebsite\images\images\dbj.jpg" align="center">公告栏</td>
  </tr>
  <tr>
  <td align="lrft" height="240"><marquee direction="up"><a href="#">公告一</a><br/><br/><a href="#">公告一</a><br/><br/><a href="#">公告一</a><br/><br/><a href="#">
  公告一</a><br/><br/><a href="#">公告一</a><br/><br/><a href="#">公告一</a><br/><br/><a href="#">公告一</a><br/><br/><a href="#">公告一</a><br/><br/><a href="#">
  公告一</a><br/><br/><a href="#">公告一</a><br/><br/></marquee></td>
  </tr>
  <tr>
  <td align="center" height="20" background="E:\web\实验一\MyFirstWebsite\images\images\dbj.jpg">旅游会员注册</td>
  </tr>
  <tr>
  <td align="center"><img src="E:\web\实验一\MyFirstWebsite\images\images\register.PNG" align="center"></td>
  </tr>
  <tr>
  <td height="300"><img src="E:\web\实验一\MyFirstWebsite\images\images\zhuye.jpg" height="300"></td>
  </tr>
  </table>
  </td>
  <td rowspan="10">
  <table height="650">
  <tr>
  <td height="110"><img src="E:\web\实验一\MyFirstWebsite\images\images\jzg.jpg"></td>
  </tr>
  <tr>
  <td height="20" align="center"><a href="#">九寨沟冬之韵</a></td>
  </tr>
  <tr>
  <td height="110"><img src="E:\web\实验一\MyFirstWebsite\images\images\jswq.jpg"></td>
  </tr>
  <tr>
  <td height="20" align="center"><a href="#">金山温泉乐园</a></td>
  </tr>
  <tr>
  <td height="110"><img src="E:\web\实验一\MyFirstWebsite\images\images\zhyn.jpg"></td>
  </tr>
  <tr>
  <td height="20" align="center"><a href="#">渤海玉女像</a></td>
  </tr>
  <tr>
  <td height="110"><img arc="E:\web\实验一\MyFirstWebsite\images\images\lmgc.jpg"></td>
  </tr>
  <tr>
  <td height="20" align="center"><a href="#">罗马广场</a></td>
  </tr>
  <tr>
  <td height="110"><img arc="E:\web\实验一\MyFirstWebsite\images\images\sbd.jpg"></td>
  </tr>
  <tr>
  <td height="20" align="center"><a href="#">塞班岛</a></td>
  </tr>
  </table>
  </td>
  </tr>
  </table>
  </body>
  </html>

纯新手,没学CSS。求问怎么才能让表格高度和宽度不随着内容改变,而是使内容会根据表格大小自动换行。

  • 写回答

8条回答 默认 最新

  • 青焰阁主 2015-10-06 03:25
    关注

    主要是两个属性的设置,会影响到你所说的问题。一个是padding,一个是margin。

    padding 属性设置元素的内边距。
    padding 属性定义元素边框与元素内容之间的空间。
    该属性可采取 4 个值:
    如果规定一个值,比如 div {padding: 50px} - 所有四个边的 padding 都是 50 px。
    如果规定两个值,比如 div {padding: 50px 10px} - 上下内边距是 50 px,左右内边距是 10 px。
    如果规定三个值,比如 div {padding: 50px 10px 20px} - 上内边距是 50 px,左右内边距是 10 px,下内边距是 20 px。
    如果规定四个值,比如 div {padding: 50px 10px 20px 30px} - 上内边距是 50 px,右内边距是 10 px,下内边距是 20 px,左内边距是 30 px。

    margin 属性设置元素的外边距。
    该属性可使用 1 到 4 个值:
    如果规定一个值,比如 div {margin: 50px} - 所有的外边距都是 50 px
    如果规定两个值,比如 div {margin: 50px 10px} - 上下外边距是 50px,左右外边距是 10 px。
    如果规定三个值,比如 div {margin: 50px 10px 20px}- 上外边距是 50 px,而左右外边距是 10 px,下外边距是 20 px。
    如果规定四个值,比如 div {margin: 50px 10px 20px 30px} - 上外边距是 50 px,右外边距是 10 px,下外边距是 20 px,左外边距是 30 px。

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(7条)

报告相同问题?

悬赏问题

  • ¥15 为什么使用javacv转封装rtsp为rtmp时出现如下问题:[h264 @ 000000004faf7500]no frame?
  • ¥15 乘性高斯噪声在深度学习网络中的应用
  • ¥15 运筹学排序问题中的在线排序
  • ¥15 关于docker部署flink集成hadoop的yarn,请教个问题 flink启动yarn-session.sh连不上hadoop,这个整了好几天一直不行,求帮忙看一下怎么解决
  • ¥30 求一段fortran代码用IVF编译运行的结果
  • ¥15 深度学习根据CNN网络模型,搭建BP模型并训练MNIST数据集
  • ¥15 C++ 头文件/宏冲突问题解决
  • ¥15 用comsol模拟大气湍流通过底部加热(温度不同)的腔体
  • ¥50 安卓adb backup备份子用户应用数据失败
  • ¥20 有人能用聚类分析帮我分析一下文本内容嘛