0

我目前设计和编码了这个布局：

问题示例

  1. 但是，我不确定如何将“查看更多、向我们发送电子邮件和发送消息”按钮/图标放置在页脚的底部，以便它们是内联的，而无需创建单独包含每个的替代 div。

    • 这是为了视觉美学目的，适应或响应正在查看的设备，以及如果用户/网站所有者想要在服务列表中添加更多内容或在推荐区域中放置更多内容，“查看更多，给我们发电子邮件和发送消息”按钮/图标将被按下以适应。

  2. 您将如何实现“致电我们、访问我们和给我们发送电子邮件”区域而不将它们分成 4 个 div/部分（1 个容纳它们的容器、1 个调用我们的 div、1 个访问我们的 div 和 1 个给我们发送电子邮件的 div）。也许是一个伪 :before 内容图标/图像并以某种方式左右浮动？如果这是正确的，我不太有信心。

  3. 我是否也正确排列了“服务、推荐和快速联系”区域......向左浮动、向左浮动和向右浮动？因为将位置设置为左、右并让“推荐”仅居中，仅在容器内居中而不是在两列之间？

我的代码看起来与此类似：http: //jsfiddle.net/mSmLH/

任何帮助将不胜感激。

我申请
position: relative了：我的父母（页脚）
position: inherit;和bottom:0;我的查看更多按钮
position: absolute;以及bottom:0;邮件图标和发送消息按钮，这似乎已经修复了它。我知道这可能需要更多的调整，但感谢您的时间和精力@Surreal Dreams

4

1 回答 1

1

  1. 要对齐各个专利容器底部的项目，首先要确保三个容器 div 的高度相同。您可以手动调整这三个元素的位置，并对and or规则position: relative进行一些调整。toprightleft

  2. 我不会。将这三个部分放在 div 中效果很好，这是最直接的方法。您可以使用表格，但这是错误的布局方法。你以正确的方式做这件事，它正在工作。这是一件好事™。

  3. 我通常会将它们全部向左浮动，但两左一右（或两右一左）是完全合法的，更重要的是，它可以工作。在布局方面，有很多方法可以做事。你找到了一个可行的——这是最重要的设计特征。

于 2012-05-02T13:45:33.707 回答