Question

我正在尝试改变div的位置＆＃34; home_square＆＃34;但是当我这样做时，请留在同一地点，请帮助。

<div class="nav_square" class="home_square"></div>
        <div class="nav_square" class="specials_square"></div>
        <div class="nav_square" class="jobs_square"></div>
        <div class="nav_square" class="league_square"></div>
        <div class="nav_square" class="contact_square"></div>
<!--POSITION SAFE NAV SQUARES-->
        <div class="nav_square" class="safe_nav_squares" class="home_square"></div>
        <div class="nav_square" class="safe_nav_squares" class="specials_square"></div>
        <div class="nav_square" class="safe_nav_squares" class="jobs_square"></div>
        <div class="nav_square" class="safe_nav_squares" class="league_square"></div>
        <div class="nav_square" class="safe_nav_squares" class="contact_square"></div>

CSS：

.nav_square {
    background-color:green;
    width:100px;
    height:2px;
    z-index:22;
}
.home_square {
    position:relative;
    left:20px;
}
.safe_nav_squares {
    background-color:black;
    z-index:-1;
}

安全导航方块就是这样当我添加我的javascript并使导航方块消失时，页面上的其他元素将不会改变位置。

Answer 1

尝试使用此代码....

<div class="nav_square home_square"></div>
            <div class="nav_square specials_square"></div>
            <div class="nav_square jobs_square"></div>
            <div class="nav_square league_square"></div>
            <div class="nav_square contact_square"></div>
    <!--POSITION SAFE NAV SQUARES-->
            <div class="nav_square safe_nav_squares home_square"></div>
            <div class="nav_square safe_nav_squares specials_square"></div>
            <div class="nav_square safe_nav_squares jobs_square"></div>
            <div class="nav_square safe_nav_squares league_square"></div>
            <div class="nav_square safe_nav_squares contact_square"></div>

Answer 2

在HTML中，类必须用空格分隔，所有这些都在同一属性中。执行此操作时，请记住顺序很重要 - 来自以后的类的规则始终覆盖之前的类。

示例：

<div class="foo blah"> I have two classes, foo and blah. When they disagree, blah wins. </div>

这是一个更详细地描述它的教程： http://www.avajava.com/tutorials/lessons/how-do-i-assign-multiple-classes-to-an-element.html

这是一个有用的Stack Overflow问题： How to assign multiple classes to an HTML container?

无论我做什么，Div都不会改变位置

2 个答案: