简体   繁体   English

在外部CSS中设置html表格样式无效

[英]styling html table in external css doesn't work

I have a jsp file that holds html elements, it has a table in it with a specific id. 我有一个保存html元素的jsp文件,其中有一个带有特定ID的表。 When I add the border: 1px; 当我添加边框时:1px; styling internally then it works, but when I want to use a css file that specifies styling, then it doesn't, there's no border at all as a result. 在内部进行样式设置就可以了,但是当我要使用指定样式的css文件时,就没有了,因此根本没有边框。

the relevant part of the jsp file: jsp文件的相关部分:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Airline Database</title>
<link rel="stylesheet" type="text/css" href="styles/PassengerStyle.css"/>
</head>
<body>
    <table id="main" width="1300px">
             ...
    </table>
</body>
</html>

the PassengerStyle.css file: PassengerStyle.css文件:

#main {
     border: 1px solid black;
}

the css file is in the styles folder that is in the same folder as the jsp file. css文件位于styles文件夹中,该文件夹与jsp文件位于同一文件夹中。

What did I miss? 我错过了什么?

It probably can't find the stylesheet, ie the url is wrong. 它可能找不到样式表,即URL错误。 Have you tried navigating to where the code in 'view source' thinks the file is located? 您是否尝试过导航到“查看源代码”中的代码认为文件所在的位置? That's probably different then where it is. 那可能与现在的情况有所不同。

You can also try adding body { background-color: red; 您也可以尝试添加正文{background-color:red; } to see if any styles from that stylesheet apply. },以查看该样式表中是否有任何样式适用。

You can use Firebug or Chrome developer tools to see if your CSS is being overridden by different rule, and you can use the network tab of those tools to see if there were any errors loading the external stylesheet. 您可以使用Firebug或Chrome开发者工具查看CSS是否被其他规则覆盖,并且可以使用这些工具的网络标签查看加载外部样式表时是否存在任何错误。

Adding !important to your css style can help in debugging, although I don't recommend it for production use. 在您的css样式中添加!important可以帮助调试,尽管我不建议将其用于生产。

Also try clearing your cache to see if a previous version of the stylesheet is being used. 另外,请尝试清除缓存,以查看是否使用了以前版本的样式表。

I would try to see if any other styles from the stylesheet apply (or do a test), if they do, then I would wonder is the table dynamically generated? 我会尝试查看样式表中是否有其他样式适用(或进行测试),如果适用,那么我想知道表是动态生成的吗? If other styles do work, I would try giving the table to be styled a class in the tag versus using the id reference in the style sheet and see if that works. 如果其他样式有效,我将尝试在标签中为要样式化的表提供一个类,而不是使用样式表中的id引用,看看是否可行。 If nothing applies, probably a broken style sheet link. 如果没有任何作用,则可能是样式表链接已损坏。

I would also recommend putting the 'width=1300px' in the css style sheet along with the other css styles. 我还建议将'width = 1300px'以及其他CSS样式放到CSS样式表中。

Try this: 尝试这个:

#main {
     border: 1px solid black !important;
}

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM