9

我对 CSS 非常陌生，我现在要做的只是为小型企业设计一个非常简单/基本的启动页面或登录页面。

这是该网站的网址： 我的网站

现在，如果您使用任何浏览器，比如说 google chrome，然后您缩小或缩小 (ctrl -/+)，您会注意到网站布局开始“分裂”，因为我所有的 div 都开始四处移动。我显然不想要这个，只是希望网站在人们放大或缩小时保持不变，就像所有好的网站一样哈哈。

我知道这一定与定位有关，但我无法将其视为我们的生活或我自己。昨晚我花了几个小时浏览类似的问题，但我能弄明白。

我发布代码不是为了占用更多空间，我假设因为我给了你 URL，你就可以从那里检索代码。

我还有一些小问题：

1）如果您在 chrome 上打开我的网站，或者您会注意到在页面底部的“条款和条件”之后，网站结束，就像它应该的那样。但是，如果您继续使用 Firefox，您会注意到在“条款和条件”之后，可以说背景会持续一段时间。为什么会这样，我该如何解决？

2) 你会注意到在不同的浏览器上元素的定位略有不同。最明显的是，如果您查看 chrome/firefox 和 internet explorer 9，您会注意到“条款和条件”略高于 chrome 或 ff，因此略微触及主要内容区域。有没有办法来解决这个问题？

3) 什么是使 div 居中的有效方法？例如，我想在主要内容区域中将“注册”按钮完全居中。我几乎一直在关注它并使用相对定位来居中。什么是更准确的居中方法？

谢谢，如果这些问题看起来有点多余，我很抱歉。如果您需要任何澄清，我会像鹰一样监视这个问题。

干杯

4

3 回答 3

13

  1. 当您放大或缩小时，您会遇到由于四舍五入和文本渲染的问题。确保布局可以承受一点拉伸而不会损坏是个好主意。

  2. 相对定位受到#1 中提到的问题的影响，因此不可靠。

  3. 研究使用某些东西来删除各种浏览器将应用的属性。您可以使用重置来为您提供更可行的东西，或者尝试标准化这些值以使它们在浏览器之间更加均匀。

  4. 对于（水平）居中，您有一些选择：

    • 如果您有一个带有“text-align:center”的容器，它将使所有内联块或内联的子元素居中。
    • 如果要使块元素居中，可以使用“margin：0 auto”将其水平居中并删除垂直边距。
    • 如果要将绝对定位的元素居中，可以使用“left: 50%, margin-left: -( width of element /2)”。

除了尝试摆脱相对定位之外，我建议您不要显式设置 body 元素的高度。通常，您希望元素管理自己的大小，这样它们就会更加健壮。

如果您现在使用“位置：相对”，因为这是您知道如何使用的，我建议您尝试使用“浮动：左”（或右），或更改显示类型（显示：内联块）。这可能会帮助您朝着正确的方向开始。

于 2012-07-15T19:16:44.250 回答
1

不确定您的第 1 点和第 2 点，但至于第 3 点，我使用的是以下有div我想要居中然后使用width : some-percentage; margin-left : 100-(some_percentage)*0.5 ;的，其中某个百分比是我想要使用的宽度。

于 2013-01-04T14:23:44.620 回答
-2

在解决放大和缩小问题之前有一些建议。

  1. 不要<div>用于环绕文本。
  2. 使用<h1>标签作为标题
  3. 将 CSS 存储在单独的 css 文件中。
  4. 您定义了很棒的页眉部分，但也为容器和页脚执行此操作。
  5. 注释！对于那些试图帮助你的人来说，这会让工作变得更容易。
于 2012-07-14T23:23:13.560 回答