CSS相邻兄弟选择器

CSS相邻兄弟选择器

本文介绍了CSS相邻兄弟选择器 - IE8问题的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在使用UL / LI结构创建菜单系统。

I am creating a menu system using a UL/LI structure. I'm trying to use sibling selectors for hover/show-sub-menus.

我正在使用这个选项;

I'm using this;

#MainMenu li.Sel ul li.HasSub a:hover+ul {
     display: block;
}

UL结构将是这样的;

The UL structure would be something like this;

<ul id='MainMenu'>
    <li class='Sel'>
    <a href='#'>Click Me</a>
        <ul>
            <li class='HasSub'>
                <a href='#'>Hover Over Me</a>
                <ul>
                    <li>Link</li>
                    <li>Link</li>
                </ul>
            </li>
        </ul>
    </li>
</ul>

假设当将鼠标悬停在Hover Over Me上时,应显示同级ul。它在Firefox中工作的很好,但在IE8中根本不行。我确定我以前见过过在IE8中使用的'+'同级选择器,我在哪里出错?

Supposedly, when hovering over "Hover Over Me", the sibling ul should be displayed. It works great in Firefox, but not at all in IE8. I'm sure I've seen the '+' sibling selector used in IE8 before, where am I going wrong?

推荐答案

你需要确保IE是以标准模式运行的 - 使用如下的doctype:

You need to make sure IE is running in standards mode - put in a doctype like this:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">

从:

当在文档树中紧跟在同级元素E之后,E + F形式的选择器匹配元素F,忽略非元素节点(例如文本节点和注释)。元素E和F必须共享相同的父元素,E必须紧接在F之前。要匹配父元素的第一个子元素,请使用:first-child伪类。

A selector of the form "E+F" matches element F when it immediately follows sibling element E in the document tree, ignoring non-element nodes (such as text nodes and comments). Element E and F must share the same parent and E must immediately precede F. To match the first child of the parent, use the :first-child pseudo-class.

注意需要Windows Internet Explorer 7或更高版本。

注意 只有符合标准的模式(严格!DOCTYPE)才能启用组合器。 / strong>

Note Requires Windows Internet Explorer 7 or later.
Note Combinators are enabled only in standards-compliant mode (strict !DOCTYPE).

这篇关于CSS相邻兄弟选择器 - IE8问题的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

08-31 02:22