css怎么让固定定位，可以根据父元素 进行定位

你可以使用 CSS 中的 `position: fixed` 属性来使元素固定定位。要让固定定位元素相对于其父元素进行定位，可以将父元素的 `position` 属性设置为 `relative`。

下面是一个示例：

<style>
  .parent {
    position: relative;
    height: 200px;
    width: 200px;
    border: 1px solid black;
  }

  .child {
    position: fixed;
    top: 50px;
    left: 50px;
    width: 100px;
    height: 100px;
    background-color: red;
  }
</style>

<div class="parent">
  <div class="child"></div>
</div>

在这个示例中，`.parent` 元素被设置为相对定位，而 `.child` 元素被设置为固定定位。`.child` 元素的位置将相对于 `.parent` 元素的位置进行定位。在这种情况下，`.child` 元素将会固定在 `.parent` 元素的左上角，距离顶部和左侧各 50 像素。

请注意，固定定位的元素会相对于浏览器窗口进行定位，而不是相对于父元素的其他内容。如果你希望元素相对于父元素的内容进行定位，可以考虑使用 `position: absolute` 属性。

相关问题

css怎么让固定定位 跟父元素定位呢

要实现固定定位元素相对于其父元素进行定位，你可以使用相对定位的父元素来创建一个包含块，并将固定定位元素与该包含块进行定位。

以下是一个示例的 CSS 代码：

.parent {
  position: relative;
  width: 400px;
  height: 300px;
  border: 1px solid #ccc;
}

.child {
  position: fixed;
  top: 50px;
  left: 50px;
  width: 200px;
  height: 100px;
  background-color: #f0f0f0;
}

在上述代码中，我们首先创建了一个相对定位的父元素 `.parent`，并设置其宽度、高度以及边框样式。

然后，我们创建了一个固定定位的子元素 `.child`，通过设置 `position: fixed`，使其脱离文档流，并相对于视口进行定位。同时，通过设置 `top` 和 `left` 属性来指定其位置。

请注意，固定定位元素 `.child` 不会直接与父元素 `.parent` 进行定位，而是相对于视口进行定位。如果你想要实现相对于父元素进行定位的效果，可以使用绝对定位（`position: absolute`）并设置 `top`、`left` 等属性来达到相应效果。

希望这个示例能帮到你！

css怎么让子元素的固定定位，可以根据父元素 进行定位定位，屏幕滚动的时候一直在左边

要让子元素相对于父元素进行定位，并且在屏幕滚动时保持在左边，你可以使用CSS中的position属性和left属性来实现。

首先，将父元素设置为相对定位，可以使用position: relative;属性。这样子元素的定位将相对于父元素进行。

然后，在子元素中设置position: fixed;属性，这将使子元素相对于浏览器窗口进行定位。

最后，使用left属性来设置子元素相对于父元素左边的距离。对于左边固定定位，可以设置left: 0;。这样子元素将保持在父元素的左边。

以下是一个示例代码：

HTML:

<div class="parent">
  <div class="child">子元素</div>
</div>

CSS:

.parent {
  position: relative;
  height: 2000px; /* 用于测试滚动效果 */
}

.child {
  position: fixed;
  left: 0;
  top: 50%; /* 可以根据需要进行调整，使子元素垂直居中 */
  transform: translateY(-50%); /* 让子元素垂直居中 */
  background-color: #f1f1f1;
  padding: 10px;
}

在上述示例中，父元素被设置为相对定位，并且设置了一个较大的高度用于测试滚动效果。子元素被设置为固定定位，并且通过left属性设置为0，使其保持在父元素的左边。使用top和transform属性可以使子元素垂直居中。

请根据你的实际需求进行调整和修改代码。希望能对你有所帮助！