CSS 可以内联工作,但不能在样式表中工作
我有这个 CSS:
width: 98px; height: 298px; border: 1px solid; margin: 30px 25px 0px 25px;
这在 style=""
内联样式中工作得很好,但是当我在样式表中使用它时,元素完全消失了!这是一些疯狂的行为……
有人知道这个问题的修复/解决方法吗?
更新
如果我从样式表中完全删除#advert
代码并将CSS内联,但保留id="advert"
它位于 div 上,但它仍然没有显示。然而,如果我删除 id="advert
位,那么 div 显示正常......奇怪。
I have this CSS:
width: 98px; height: 298px; border: 1px solid; margin: 30px 25px 0px 25px;
This works fine in a style=""
inline style, but when I use it in the stylesheet the element disappears completely! This is some crazy behaviour right here...
Does anyone know of a fix/workaround for this problem?
UPDATE
If I remove the #advert
code from the stylesheet completely and put the CSS inline, but leave the id="advert"
where it is on the div, it still doesn't show up. HOWEVER, if I remove the id="advert
bit, then the div displays fine... strange.
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(3)
我已经很久没有问这个问题了,但我似乎记得这是我使用 Adblock plus 引起的 - 它阻止了
因为它的 ID 为
advert
- 一个非常简单的疏忽。从那时起,我一直在关闭 ABP 的情况下进行开发,您应该检查您可能使用的任何插件是否不会以您不想要的方式阻止/修改您的 HTML。
It's been a long time since I asked this question, however I seem to remember this was caused by me using Adblock plus - it was blocking the
<div>
because it had an ID ofadvert
- a very simple oversight.I've always developed with ABP off ever since, and your should check that any plugins you may be using aren't blocking/modifying your HTML in ways you don't want.
我有同样的问题。
我的内联 CSS 是
style="padding-left:20px;"
我想用以下内容替换:
class="padleft"
我的解决方案样式表是
.padleft {padding-left:20px !important;}
这解决了我的问题。
I had same problem.
My inline css was
style="padding-left:20px;"
Which I wanted to replace with:
class="padleft"
My solution stylesheet was
.padleft {padding-left:20px !important;}
This solved my problem.
您的样式表中可能有一个级联,它以某种方式“隐藏”有问题的元素,并且您的内联样式会覆盖它,因此该元素是可见的。但是,当您将规则移至样式表中时,它们不再被覆盖,因为您使用的选择器的优先级低于“隐藏”元素的选择器。
您可以使用 FireBug 或 Firefox 的 Web 开发人员工具栏等工具来检查元素并查看影响某些内容的所有 CSS。我打赌你会在那里看到一些你意想不到的东西!
Its likely you have a cascade in your stylesheet that is 'hiding' the element in question somehow, and your inline styles are overriding that, so the element is visible. However, when you move the rules into the stylesheet they no longer are overriding because the selector you are using is of lower precedence than the one that is 'hiding' the element.
You can use a tool like FireBug or the Web Developer toolbar for firefox to inspect and element and see all the CSS that is affecting something. I bet you'll see something extra there you don't expect!