Question

我正在尝试在一个班级上学，同时将鼠标悬停在另一个班级上。在这种情况下，将鼠标悬停在数字上时必须显示文字。

我过去已经成功完成了这项工作，所以我似乎无法弄清楚它为什么不起作用。

<html>
    <header>
        <style>
            body {
                font-family: 'roboto';
            }           

            .wrapper {
                margin-top:200px;
                height:180px;
                margin-left:13%;
            }

            .wrapper div {
                float:left;
                width:90px;
                max-width:90px;
                margin:10px;
                transition: 0.2s all linear;
            }

            .wrapper img {
                width:90px;
                margin:10px;
                transition: 0.2s all linear;
            }

            .wrapper img:hover {
                width:100px;
            }

            .namen {
                margin-left:17%;
                font-size:18px;
            }
                .namen div {
                    float:left;
                    padding:0 56px 0 0;
                    display:none;
                }

                .wrapper div:hover ~ .namen div {
                    display:block;
                }


        </style>
        <link href='http://fonts.googleapis.com/css?family=Roboto:400,500' rel='stylesheet' type='text/css'>
    </header>
    <body>
        <section class="wrapper">
            <div>1</div>
            <div>2</div>
            <div>3</div>
            <div>4</div>
            <div>5</div>
            <div>6</div>
            <div>7</div>
            <div>8</div>
        </section>
        <section class="namen">
            <div>Aage</div>
            <div>Willem</div>
            <div>Marco</div>
            <div>Ronald</div>
            <div>Onno</div>
            <div>Timo</div>
            <div style="padding-left:8px;">Mark</div>
            <div style="padding-left:8px;">Youri</div>
        </section>
    </body>
</htmL>

http://jsfiddle.net/8aomrf0k/

打电话给另一堂课是不行的

0 个答案: