100字范文,内容丰富有趣,生活中的好帮手!
100字范文 > HTML中如何将表格最外层边框设置成实线 内单元格边框设置成虚线?

HTML中如何将表格最外层边框设置成实线 内单元格边框设置成虚线?

时间:2018-07-09 17:52:36

相关推荐

HTML中如何将表格最外层边框设置成实线 内单元格边框设置成虚线?

如图中所示,最外层边框为实线,内部单元格边框为虚线

以下为HTML部分的一部分代码

<body><form action=""><table>/*设置表格代码*/<th>同城网在线调查<th><tr><td>你从哪里知道同城的</td><td><select name="where" id="1"><option value="">朋友告知</option><option selected="selected">网上搜索</option><option value="">传单</option></select></td></tr><tr><td>你正在使用的同城网服务</td><td><input type="checkbox">免费社区<input type="checkbox">免费留言簿<input type="checkbox">免费投票</td></tr><tr><td>你希望我们提供哪些新服务</td><td><input type="checkbox">聊天室<input type="checkbox">博客<input type="checkbox">游戏系统</td></tr><tr><td>你是同城网的会员吗</td><td><input type="radio">是<input type="radio">不是</td></tr><tr><td>你对同城网的其他意见</td><td><textarea id="01" cols="30" rows="10" style="overflow-y: scroll;"></textarea></td></tr><tr aria-colspan="2"><td></td><td><input type="submit" value="提交"></td></tr></table></form></body></html>

以下为css代码部分

在这里插入代码片table,th{border-spacing: 0em;margin-left: 1px;border: 1px solid #220808;border-collapse: collapse;}/*设置表格最外层边框实线*/th{color: white;background-color: rgba(38, 45, 59, 0.767);}td{border: 1px dashed;}/*设置单元格边框纵向虚线*/tr{vertical-align: top;border: 1px dashed;}/*设置单元格边框横向虚线*/

总结:主要搞清楚表格最外层边框(外框)与表格的单元格边框(内框)是由哪一部分决定的

外框:table

内框:td,tr

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。