Question

在我的主页上http://www.rosstheexplorer.com/“新南威尔士”，“维多利亚”，“北领地”，“南澳大利亚”，“昆士兰”，“澳大利亚旅游指南”，“其他澳大利亚”博客应该全部以粗体为中心。这就是它已经很长一段时间了，今天我注意到这已不再是这样了。我以为我在页面上犯了一个错误但后来发现问题已经在整个网站上发生了。

以下代码用于工作。

<div class="BlackIcon">New South Wales</div>
<div class="BlackIcon">Victoria</div>

注意：您可能需要单击蓝色文本才能看到屏幕截图。

The text 'New South Wales' is still associated with the CSS class 'BlackIcon' but now it is not inheriting the properties from the CSS class.

/*To be used on its own, it has 100% width so you no longer need a guide css as well*/
@media screen and (max-width: 9999999px) {
    .BlackIcon {
        color: Black;
        background-color: White;
        border-radius: 20px;
        margin-top: 15px;
        margin-bottom: 5px;
        padding: 10px;
        font-size: 2em;
        text-align: center;
        display: inline-block;
        border: 0 solid black;
        width: 100%;
        font-weight: 500;
    }
}

任何人都可以解释导致此问题的原因吗？

Answer 1

问题是您的自定义样式表有语法错误。

尝试将整个样式粘贴到选择的语法检查器中（例如http://csslint.net）

注意红色三角形;这些是解析错误，并且通常会导致浏览器忽略其余的样式。

样式表中有两个迷路}个字符。如果你只是删除这两行，你应该没事。它们可以在.BlackIcon规则之上找到几行，这可以解释为什么规则不起作用。

Answer 2

如果你想这样

你不能使用

＆＃13;

@media screen and (max-width: 9999999px) {}

＆＃13;

或者您必须使用最小宽度

＆＃13;

@media only screen and ( min-width: 992px) and (max-width:99999999px) {
   .BlackIcon {
	color: Black;
	background-color: White;
	border-radius: 20px;
	margin-top: 15px;
	margin-bottom: 5px;
	padding: 10px;
	font-size: 2em;
	text-align: center;
	display: inline-block;
	border: 0 solid black;
	width: 100%;
	font-weight: 500;
}
}

＆＃13;

将CSS类应用于文本

2 个答案: