Html 去除表格边框
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/6290081/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
removing table border
提问by micahhoover
I cannot get rid of this table border.
我无法摆脱这个表格边框。
The initial HTML/CSS is from the ASP.NET MVC default.
初始 HTML/CSS 来自 ASP.NET MVC 默认。
I removed a lot of code and added a table on top.
我删除了很多代码并在顶部添加了一个表格。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>@ViewBag.Title</title>
<link href="@Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" />
<script src="@Url.Content("~/Scripts/jquery-1.5.1.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/modernizr-1.7.min.js")" type="text/javascript"></script>
</head>
<body>
<div class="page">
<table border=0 width=1000 style="border-collapse:collapse;" cellspacing="0" cellpadding="0">
<tr>
<td rowspan=2>
<img src="/Content/Images/elk_banner.jpg" />
</td>
<td>
<div id="logindisplay">
@Html.Partial("_LogOnPartial")
</div>
</td>
</tr>
</table>
<section id="main">
@RenderBody()
</section>
<footer>
</footer>
</div>
</body>
</html>
I've tried commenting out ALL the CSS, but I can't get rid of it.
我试过注释掉所有的 CSS,但我无法摆脱它。
My only guess is that one of the cryptic .js files is interferring with it. Or one of these exotic HTML containers is doing it.
我唯一的猜测是其中一个神秘的 .js 文件正在干扰它。或者这些异国情调的 HTML 容器之一正在这样做。
Any guesses? I've googled around, but to no avail. I suppose it's something small I'm overlooking.
有什么猜测吗?我已经谷歌搜索,但无济于事。我想这是我忽略的小东西。
采纳答案by George Katsanos
Use Firebug to inspect the table in question, and see where does it inherit the border from. (check the right column). Try setting on-the-fly inline style border:none; to see if you get rid of it. Could also be the browsers default stylesheets. In this case, use a CSS reset. http://developer.yahoo.com/yui/reset/
使用 Firebug 检查有问题的表格,看看它从哪里继承边框。(检查右栏)。尝试设置动态内联样式边框:无;看看你是否摆脱了它。也可能是浏览器的默认样式表。在这种情况下,请使用 CSS 重置。http://developer.yahoo.com/yui/reset/
回答by Marty
Try giving your table an ID and then using !important
to set border
to none
in CSS. If JavaScript is tampering with your table then that should get around it.
尝试为您的表提供一个 ID,然后在 CSS 中使用!important
to 设置border
为none
。如果 JavaScript 正在篡改您的表格,那么应该可以绕过它。
<table id="mytable"
...
table#mytable,
table#mytable td
{
border: none !important;
}
回答by Chathuranga Jayanath
Please try to add this into inside the table tag.
请尝试将其添加到 table 标签内。
border="0" cellspacing="0" cellpadding="0"
border="0" cellpacing="0" cellpadding="0"
<table border="0" cellspacing="0" cellpadding="0">
...
</table>
回答by David Leegwater
This will do it with border-collapse
这将与 border-collapse
table{
border-collapse:collapse;
}
回答by robasta
To remove from all tables, (add this to the head or external style sheet)
要从所有表中删除,(将此添加到头部或外部样式表)
<style type="text/css">
table td{
border:none;
}
</style>
回答by Guyfrala
Most of the time your background color is different from the background of your table. Since there are spaces between the cells, those spaces will create the illusion of lines with the color of the background behind the table.
大多数情况下,您的背景颜色与表格的背景不同。由于单元格之间有空间,这些空间会产生线条的错觉,与桌子后面的背景颜色相同。
The solution is to get rid of those spaces.
解决方案是摆脱这些空间。
Inside the table tag write:
在 table 标签内写:
cellspacing="0"
回答by Fussell
Use table style Border-collapse at the table level
在表格级别使用表格样式边框折叠
回答by blaisck
From your case, you need to set the border to none on <table>
and <td>
tags.
根据您的情况,您需要将边框设置为 none on<table>
和<td>
tags。
<table width=1000 style="border:none; border-collapse:collapse; cellspacing:0; cellpadding:0" >
<tr>
<td style="border:none" rowspan=2>
<img src="/Content/Images/elk_banner.jpg" />
</td>
<td style="border:none">
<div id="logindisplay">
@Html.Partial("_LogOnPartial")
</div>
</td>
</tr>
</table>
回答by pr0tipZ
border-spacing: 0;
should work as well
border-spacing: 0;
也应该工作
回答by Poramate Srisawat
.yourClass>tbody>tr>td{border: 1px solid #ffffff !important;}