去掉嵌入边框的外边框线

去掉嵌入边框的外边框线

嵌入的表格,怎么跟表格融为一体,就是怎么样把多余的外边框线去掉达到效果呢

正在回答 回答被采纳积分+1

登陆购买课程后可参与讨论,去登陆

3回答
提问者 慕瓜1068998 2017-06-23 13:17:41

http://img1.sycdn.imooc.com/climg//594ca4230001d84902730112.jpg不好意思可能之前表述不清,这么说吧  比如这个图,我想把插入的上海和周边那个单元格,加入十字线,这个怎么实现呢


  • 注意看上面的回答哦~
    2017-06-23 16:11:10
卡布琦诺 2017-06-23 13:06:29

http://img1.sycdn.imooc.com/climg//594ca738000117cb04190084.jpg

亲,是想要实现这样的效果吧?建议参考下面的代码:

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
    <table width='20%' align="center" border='1' bgcolor="pink" cellspacing='0' cellpadding='0'>
        <tr align="center">
        	<td>上海</td>
        	<td></td>
        	<td>北京</td>
        </tr>
        <tr align="center">
        	<td>中心</td>
        	<td>周边</td>
        	<td rowspan="2">200</td>
        </tr>
        <tr align="center">
        	<td>50</td>
        	<td>60</td>
        </tr>
    </table>
</body>
</html>

http://img1.sycdn.imooc.com/climg//594ca8070001c5eb03980081.jpg

或者是想要实现这样的效果可以参考一下代码:

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
    <table width='20%' align="center" border='1' bgcolor="pink" cellspacing='0' cellpadding='0'>
        <tr align="center">
        	<td colspan="2">上海</td>
        	<td>北京</td>
        </tr>
        <tr align="center">
        	<td>中心</td>
        	<td>周边</td>
        	<td rowspan="2">200</td>
        </tr>
        <tr align="center">
        	<td>50</td>
        	<td>60</td>
        </tr>
    </table>
</body>
</html>

希望可以帮到你!

  • 提问者 慕瓜1068998 #1
    谢谢你,就是想实现这样的效果,但是这种的合并的方式我是会的,我就是想知道在表格嵌套中,怎么去实现这种效果,望解疑!
    2017-06-23 16:38:52
  • 卡布琦诺 回复 提问者 慕瓜1068998 #2
    亲,在你贴过来的图有实现代码么?只有你将你的代码贴过来,大家才会更准确的定位问题并帮你解答哦!另外纯表格嵌套是不能够实现你所说的效果哒,表格的嵌套是需要搭配合并单元格的属性一起来使用的哦!
    2017-06-23 17:19:12
小山东 2017-06-23 12:03:03

在td标签中嵌入表格时,table的内边框属性设为all

<td>
	<table width='100%' align='left' border='0' frame='' rules='all' cellspacing='0' cellpadding='0'>
    			    <tr align="left">
    				<th>星期一</th>
    				<th>星期二</th>
    				<th>星期四</th>
    				<th>星期五</th>
        			</tr>
        			<tr align="center">
        				<th>星期一</th>
        				<th>星期二</th>
        				<th>星期四</th>
        				<th>星期五</th>
        			</tr>
         </table>
<td>


问题已解决,确定采纳
还有疑问,暂不采纳

恭喜解决一个难题,获得1积分~

来为老师/同学的回答评分吧

0 星
前端小白入门系列课程
  • 参与学习           人
  • 提交作业       11218    份
  • 解答问题       36713    个

从一个不会编程的小白到一个老司机是需要过程的,首先得入门,学习基础知识,然后才能进阶,最后再到精通,本专题是你走进前端世界的不二选择!

了解课程
请稍等 ...
意见反馈 帮助中心 APP下载
官方微信

在线咨询

领取优惠

免费试听

领取大纲

扫描二维码,添加
你的专属老师