Div标签不根据指定的位置改变位置

Question

我是一名正在学习 HTML 的学生，在定位 div 标签时遇到了困难。当我尝试更改位置时（我需要它是 "position:fixed;"），它不会移动。我从其他线程中收集到的是 div 标记相对于主体定位自身，但是如果它的位置设置为固定，它不应该固定吗？

注意：这很乱，因为我仍在努力学习这门语言。我包含了整个 HTML 文件，以防其他原因导致错误。文档中还没有涉及 CSS 个文件。

以下是我要开始工作的部分。提前致谢。

a{position:fixed;}

<div style="background:#A7DbD8;positon:absolute;left:50px;height:25px;width:500px;border:3px solid #19B3B0">
  <a href="home.html" style="left:40px">Home</a>
  <a href="portfolio.html" style="left:90px;">Portfolio</a>
  <a href="links.html" style="left:140px;">Links</a>
  <a href="contact.html" style="left:190px;">Contact</a>
</div>

body{font-fmaily:Times New Roman;}
h1,p{text-align:center;}
a{position:fixed;}

<!DOCTYPE html>
<html>
<head>
  <title>Jem Jolly</title>
  <script src="http://code.jquery.com/jquery-latest.js"></script>
  <link href="index.css" rel="stylesheet" type="text/css" />
</head>
<body>

  <div> 
    <img src="Random Banner.png" alt="Random Banner"  style="position:fixed;left:130px;top:43px"/> 
  </div>

  <div style="background:#A7DbD8;positon:absolute;left:50px;height:25px;width:500px;border:3px solid #19B3B0">
    <a href="home.html" style="left:40px">Home</a>
    <a href="portfolio.html" style="left:90px;">Portfolio</a>
    <a href="links.html" style="left:140px;">Links</a>
    <a href="contact.html" style="left:190px;">Contact</a>
  </div>

  <div>
    <div style="background:#A7DbD8;position:fixed;height:300px;width:600px;top:175px;left:20px;border:3px solid #19B3B0">
      <h1 style="font-family:cooper black;">JEM JOLLY</h1>
      <p>JEM JOLLY Founded in 2000, Jem Jolly started as a small, family-owned jewelry store. All of our products were hand-crafted by local artists, metalsmiths, and bead workers. Since our humble beginnings, we have grown into a nationwide company with distributors, retailers, and other wholesalers representing us and our products in 20 states, as well as Canada and the UK. Check out our retailer list <insert link to retailer page once it is created> for locations near you.</p>
      <p>We also take custom orders. Feel free to send us specific instructions for custom orders through our contact form <insert link to contact page once it is created>, if you are interested in a unique item for that special someone!</p>
      <p>Jem Jolly is pleased to be your supplier of finely crafted, high-quality jewelry that is timeless, eye-catching, and unlike anything you've seen before.
    </p>
    </div>
  </div>

  <div>
    <div style="background:A7DbD8;position:fixed;height:240px;width:320px;top:175px;left:640px;border:3px solid #19B3B0">
      <video width="320" height="240" controls>
        <source src="intermediate_web_design_U4L3_vid 10-39-13.mp4" type="video/mp4"></source>
      </video>
    </div>

  </div>

  <div style=width:500px;height:100px; position: relative;">

    <img src="rsz_3logo.png" alt="Random Logo" style="left:20px;top:43px"/>

  </div>

</body>
</html>

Answer 1

您拼错了单词 position

代码

<div style="background:#A7DbD8;positon:absolute;left:50px;height:25px;width:500px;border:3px solid #19B3B0">

修正为

<div style="background:#A7DbD8;position:absolute;left:50px;height:25px;width:500px;border:3px solid #19B3B0">

你在和某种编辑一起工作吗？如果你只使用记事本，你会因为这些小错误而生气。给自己一个像样的编辑器...

此外，您不需要将所有这些菜单项都放在固定位置，父元素固定就足够了。

Div标签不根据指定的位置改变位置

Div Tag Does Not Change Position According to Position Specified

html

document-body