编辑来自不同类的类

时间:2014-04-22 11:04:22

标签: html css

我想要做的是当鼠标悬停在橙色的任何元素上时,更改以绿色标记的元素的旋转。我知道你可以拥有像

这样的东西
ul li.classname

我尝试过这样的事情,但不要认为我完全理解访问不同元素的不同层次。

enter image description here

代码本身:

    <!-- Begin Links To Different Pages -->
        <nav id="navigation" style="margin-top:-15px;margin-left:-50px">
            <ul style="list-style:none" class="test">
                <a href="index.html"><img id="home-button" src="images/Home_Button.png"></a>

                <!-- Sweets Link -->
                 <li class="sweets-tabVis"><a href="ProductsPage.html"><img id="sweets-button" src="images/Sweets_Button.png"></a></li>
                 <ul style="list-style:none" class="sweets-tabInVis">

                    <li class="test"><a href="ProductsPage.html"><img  src="images/AllSweets_Button-Dropdown.png"></a></li>       

                    <!-- Begin Type Tab -->
                    <li class="type" style="margin-top:-6px;"><a href="http://www.google.co.uk"><img  src="images/Type_Button-Dropdown.png"></a></li>          
                        <!-- Begin Sublink Type Navigation -->
                            <li class="sweets-sublink" style="margin-top:-62px;">                       
                                <a href="ProductsPage.html" ><img  src="images/Boiled_Button-Dropdown.png"></a>
                                <a href="ProductsPage.html" ><img style="margin-top:-7px;" src="images/Chewy_Button-Dropdown.png"></a>
                        <!-- End Sublink Type Navigation -->
                            </li>                       
                    <li style="margin-top:-7px;"><a href="ProductsPage.html"><img  src="images/Flavours_Button-Dropdown.png"></a></li>       
                    <!-- End Type Tab -->
                 </ul>  


                <a href="ContactUs.html"><img id="contact-button" style="margin-left:250px;" src="images/Contact_Button.png"></a>
                <!-- Begin Links To Different Pages -->
                <section>
                    <img id="search-bar" src="images/Search_bar.png">
                    <input id="search-box" style="position:absolute;margin-top:-70px;margin-left:920px;height:20px;font-family:Hobo Std;font-size:14px;width:150px" value="Search..." type="text">   </input>
                </section>
            </ul>
        </nav>
        <!-- End Navigation -->

感谢您的帮助!

1 个答案:

答案 0 :(得分:0)

在css中,无法选择包含您正在使用的类的类。

也许如果你尝试上面的课程(test)?

.test > .sweets-tabVis {your style}