html - HTML元素在浏览器调整大小时改变位置

Question

为什么在此视频中浏览器上移动的框和图像会调整大小？

这是我的代码：

style="width: 98pt; position: fixed; left: 112pt; bottom: 175pt"

score 3 · Accepted Answer

因为...

它的设计很灵活。

对页面和元素的尺寸使用基于百分比的宽度，而不是像素。

使用 em 作为字体大小，而不是 px 或 pt。

尽量不要使用图像进行导航，或者如果这样做，请使用滑动门方法使它们可扩展。阅读：#1。

阅读液体布局：#2或#3。

如果你想了解更多，我推荐这本书：

enter image description here

score 0 · Accepted Answer

Because they are attached to the bottom of its container (the body tag maybe?)

Use "top:###pt" instead of "bottom: 175pt".

I think it would be better to specify its height instead.

<body>

  <div style="position:fixed; top: 50px; left: 50px; width: 100px; height: 100px;">content</div>

</body>