Question

我正在尝试为Joomla上的精选文章页面实现自定义布局，以便使用我在Photoshop上制作的自定义设计制作精美的博客布局。

这是我想要实现的目标：http://i48.tinypic.com/2ztbx54.png

这是我目前的样子：http://i49.tinypic.com/1ibn5w.png

其余的布局不会有问题，因为它很容易修改，但是，我现在卡住的问题是介绍图像。我希望它在文章标题的左侧，一些信息和介绍文本，如第一张图片所示。

是否可以从介绍文本中提取图像以便将其放置在需要的位置？

帮助将不胜感激，谢谢！

Answer 1

在你的css文件中添加以下代码，让你开始：

.article-info {
    float:right;
}
h2 { 
    text-align: right; 
}
.item.column-1 img {
    margin-top: -50px;
}
.article-info-term { 
    padding-left: 40px; 
}

另外，请删除您添加到图片中的margin: 0px;。

这就是结果：

http://i735.photobucket.com/albums/ww355/lodder16/stack_image.png

希望这有帮助

Answer 2

首先，我的评论只是一个笑话。

现在，对于这个问题：当图片位于item column-1的容器item column-1之上的div中时，您的图像位于div items-row cols-1 row-0中。

所以这个：

<img src="/images/Articles/macbookpro-review-01-top.jpg" width="200" height="200" alt="macbookpro-review-01-top" style="float: left;">

无法进入您当前正在进行的<div class="items-row cols-1 row-0">或<dl class="article-info">。

它需要坐在外部div中。所以应该在<div class="items-row cols-1 row-0">。像这样：

<div class="items-row cols-1 row-0">
  <img src="/images/Articles/macbookpro-review-01-top.jpg" width="200" height="200" alt="macbookpro-review-01-top" style="float: left;">
//...and the rest of your stuff

如何在介绍文本之外提取Joomla介绍图像，以便在标题的左侧显示特色页面中的其他信息？

2 个答案: