2

在使用 Zen 子主题的 Drupal 6 上，除了 Internet Explorer 7 之外，我们的自定义样式表在任何地方都很漂亮和完美。这似乎是一个:hover错误，我们将鼠标悬停在其中的任何链接都会导致主要内容区域跳过左侧边栏（是保证金崩溃或保证金重置？）。

尝试在所有元素和父元素上设置 min-height: 1% :hover，但最终决定指定一个定义为零悬停元素的“ie7specific.css”。Internet Explorer 7 用户的运气不好。

但是，在myspecialsub_theme.info文件中myspecialsub_theme.css会自动发送到 Internet Explorer，从而创建:hover元素。我们需要指定 Internet Explorer 7 获取其特定的 CSS，而所有其他浏览器获取常规的。

conditional-stylesheets[if gt IE 7][all][] = myspecialsub_theme.css
conditional-stylesheets[if IE 7][all][] = ie7specific.css
conditional-stylesheets[if lt IE 7][all][] = myspecialsub_theme.css
conditional-stylesheets[if !IE][all][] = myspecialsub_theme.css

它适用于 Internet Explorer 版本，但 Firefox 没有获取样式表。为什么 !IE 不起作用，我应该改用什么？

或者对于所描述的问题是否有不同的解决方案？

更新：我的评论没有很好地显示在下面，这是我最终找到的解决方案：

感谢wikipedia.org/wiki/Conditional_comment的解决方案。

在subtheme.info：

; stylesheets[all][] = specific_subtheme.css
conditional-stylesheets[if gt IE 7][all][] = specific_subtheme.css
conditional-stylesheets[if IE 7][all][] = ie7specific.css
conditional-stylesheets[if lt IE 7][all][] = specific_subtheme.css

在page.tpl.php：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="<?php print $language->language; ?>" lang="<?php print $language->language; ?>" dir="<?php print $language->dir; ?>">
<head>
    <title><?php print $head_title; ?></title>
    <meta http-equiv="X-UA-Compatible" content="IE=8" />
    <?php print $head; ?>
    <?php print $styles; ?>
    <![if !IE]>
        <link href="/sites/all/themes/specific_subtheme/specific_subtheme.css" rel="stylesheet">
    <![endif]>
    <?php print $scripts; ?>
</head>

疯了吧？

最后更新：最好的是，我终于:hover在 Zen 子主题中发现了 bug 的来源。div main 需要 azoom:1;并且这些条件样式表都不是必需的。但是如果你不能解决原来的问题，那就去吧。

4

4 回答 4

2

更新：刚刚意识到我可以回答自己的问题。不寻求声誉积分，但想为其他调查此问题的人澄清正确的解决方案。

感谢 wikipedia.org/wiki/Conditional_comment 的解决方案

在 subtheme.info 中：

; stylesheets[all][] = specific_subtheme.css
conditional-stylesheets[if gt IE 7][all][] = specific_subtheme.css
conditional-stylesheets[if IE 7][all][] = ie7specific.css
conditional-stylesheets[if lt IE 7][all][] = specific_subtheme.css

在 page.tpl.php 中：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="<?php print $language->language; ?>" lang="<?php print $language->language; ?>" dir="<?php print $language->dir; ?>">
<head>
<title><?php print $head_title; ?></title>
<meta http-equiv="X-UA-Compatible" content="IE=8" />
<?php print $head; ?>
<?php print $styles; ?>
<![if !IE]>
<link href="/sites/all/themes/specific_subtheme/specific_subtheme.css" rel="stylesheet">
<![endif]>
<?php print $scripts; ?>
</head>

疯了吧？

顺便说一句，最终修复了 IE7 中的悬停选择器/折叠边距错误，使用 drupal zen 主题，在 IE 粘贴中

javascript:alert(content.currentStyle.hasLayout)

进入位置栏并按回车键，会告诉我 id=content 元素是否有布局（真或假）。我一直用其他 id 名称替换内容，例如 main-inner、primary，直到我发现 main div 是错误的。添加缩放属性：1；到那个 ie7specific.css 解决了所有的问题。

上帝保佑微软。

于 2009-11-19T21:15:59.510 回答
0

正如本所说，您应该尝试用 覆盖:hover选择ie7specific.css器.selector:hover{property:none}。确保匹配每个选择器并将每个属性设置为其常规值。如果它仍然不起作用，我认为更轻松的解决方法是将这些:hover或其他非 Internet Explorer 细节写入单独的文件中，并在检测到浏览器后通过 JavaScript 加载它们。试试http://docs.jquery.com/Utilities/jQuery.support。

于 2009-11-10T17:59:40.783 回答
0

您的条件语句需要这样打印：

    <link rel="stylesheet" href="/sites/all/themes/style.css" 
type="text/css" media="screen, projection">
    <!--[if IE 7]>
    <link rel="stylesheet" href="/sites/all/themes/ie7.css" 
type="text/css" media="screen, projection">
    <![endif]-->

请记住将 IE 标签放在您的普通 CSS 之后，以便您可以覆盖 IE 问题。

另外，我不会将您的主样式表包装在条件语句中：

<!--[if !IE]><!-->
<h1>You are NOT using Internet Explorer</h1>
<!--<![endif]-->

只需首先修复 IE7 即可完成。

干杯!

于 2009-07-22T05:02:29.867 回答
0

!IE 不会像我理解的那样工作，因为只有 IE 支持条件样式表。

我处理这个问题的方法是在主样式表中定义其他浏览器的东西，并根据需要在 IE 条件中覆盖。

你可以这样做：

 stylesheets[all][] = myspecialsub_theme.css
 conditional-stylesheets[if IE 7][all][] = ie7specific.css

当然，特定于 IE 的东西需要做额外的工作来覆盖任何本来不会被导入的东西，但这就是你使用 IE 得到的东西。

于 2009-07-18T01:32:12.057 回答