为什么我不能从我的 scss 文件中调用我的 id 变量？

Saraverflow 发表于 Dev

萨拉弗流

这是我在网站上的尝试。这是html代码。

<!DOCTYPE html>
<html lang="en">
    <head>
        <title>firstwebsite</title>
    </head>
    <style>

    </style>
    <link rel="stylesheet" href="firstwebsite.css">

    <div>
        <img src="ManchesterLeaveLogo.png" alt="image cannot be displayed" width="30" height="30">
        <div >
            <h1 id= 'title'>Manchester</h1>
        </div>
    </div>

</html>

这是 SCSS：

<pre>
div{
    color: white;
    font-size: 12px;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: 50;
    background-color: rgb(68, 68, 68);
}
#title{
    top: 500px;
    left: 50px;
    position: absolute;
    z-index: 1;
    visibility: padding;
}
</pre>

我不明白为什么，尽管 id='title' 的部门正在被 scss 文件调用（是的，我确实将 scss 文件设置为 watch），但它不会在我的浏览器（边缘）中应用定位更改，我将不胜感激一些帮助。提前致谢。

为了更清楚，我试图让“曼彻斯特”出现在图像旁边。这就是为什么我试图在 scss 文件中使用 #title 移动带有 id = "title" 的 h1 标题。

乔恩·P

目前还不清楚您到底想要什么，所以我猜测您希望标题从顶部和左侧出现 50 像素，但仍然在 bounding 之内div。标题上的边距是您想要使用的。

div {
  color: white;
  font-size: 12px;
  font-family: Arial, Helvetica, sans-serif;
  font-weight: 50;
  background-color: rgb(68, 68, 68);
}

#title {
  margin-top: 50px;
  margin-left: 50px;
}

<div>
  <img src="https://www.fillmurray.com/30/30/" alt="image cannot be displayed" width="30" height="30">
  <div>
    <h1 id='title'>Manchester</h1>
  </div>
</div>

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。