Question

我有一个带有css选择器的html文件，名为 holder2 ，位置固定，我不明白为什么它不能改变它的左边属性，它只是让我改变它的顶级属性。如果我更改左属性值，则div不会改变位置。

#translucent {
  background-color: orange;
  opacity: 0.5;
}

.holder2 {
  width: 100%;
  height: 100%;
  position: fixed;
  z-index: 2;
  border: 3px solid red;
  top: 70px;
  left: 180x;
}

.holder {
  width: 100%;
  height: 100%;
  position: fixed;
  z-index: 2;
  border: 3px solid red;
  top: 70px;
  left: 190px;
}

.frame {
  width: 128px;
  height: 128px;
}

.bar {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 40px;
  border: 3px solid green;
}

<!DOCTYPE html>
<html>

<head>

</head>

<body>
  <h1>The opacity Property</h1>
  <div class="holder2">
    <img style="" src="http://gallery.raccoonfink.com/d/7003-2/alien-head-128x128.png">
    <iframe class="frame" id="translucent"></iframe>
    <div class="bar" id="2">

    </div>
  </div>

  <div class="holder">
    <iframe class="frame" id="translucent"></iframe>
    <div class="bar" id="1"></div>
  </div>

</body>

</html>

Answer 1

简单的拼写错误。

替换

left:180x;

与

left:180px;

Answer 2

只需在180x课程中将左侧180px更改为holder2即可。小拼写错误。

＆＃13;

#translucent {
  background-color: orange;
  opacity: 0.5;
}

.holder2 {
  width: 100%;
  height: 100%;
  position: fixed;
  z-index: 2;
  border: 3px solid red;
  top: 70px;
  left: 180x;
}

.holder {
  width: 100%;
  height: 100%;
  position: fixed;
  z-index: 2;
  border: 3px solid red;
  top: 70px;
  left: 190px;
}

.frame {
  width: 128px;
  height: 128px;
}

.bar {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 40px;
  border: 3px solid green;
}

＆＃13;

<!DOCTYPE html>
<html>

<head>

</head>

<body>
  <h1>The opacity Property</h1>
  <div class="holder2">
    <img style="" src="http://gallery.raccoonfink.com/d/7003-2/alien-head-128x128.png">
    <iframe class="frame" id="translucent"></iframe>
    <div class="bar" id="2">

    </div>
  </div>

  <div class="holder">
    <iframe class="frame" id="translucent"></iframe>
    <div class="bar" id="1"></div>
  </div>

</body>

</html>

＆＃13;

为什么带有固定位置的选择器的div不能改变它的左侧属性

2 个答案: