Orchardcms 简单地将文本环绕图像

这是一个简单的例子，有人知道在Orchard CMS中添加内容时如何使文本整齐地围绕在图像周围吗

在我看来，这是网页内容的基础，但这是Orchard似乎无法处理的唯一“开箱即用”的东西

我肯定有一个解决办法，也许是一个样式标签或什么的，但我宁愿不实现一个软糖，以防我错过了一些简单的东西在这里

当前，如果我通过先将“i”光束光标放在文本中间的最左边的字符位置0来添加图像，则由编辑器生成下面的HTML。请注意，粗体显示的图像没有设置格式，因此看起来很糟糕

---

欢迎发表任何评论

您可以做几件事

首先，当您打开媒体选择器时，会出现一个名为

Allignment

的下拉菜单。如果选择，例如

Left

，文本将从图像的右侧换行。如果选择

Right

，图像将向右移动，文本将从图像的左侧换行

然而，从设计的角度来看，在图像周围包装文本的首选方式是使用CSS样式

这是从图像右侧包装文本所需的样式示例：

img {
    float: left;
    padding: 5px;
}

img {
    float: right;
    padding: 5px;
}

这是从图像左侧包装的示例：

img {
    float: left;
    padding: 5px;
}

img {
    float: right;
    padding: 5px;
}

请注意，此样式将有效地应用于站点中的所有图像，并且我在图像周围添加了一些间距。如果希望它只应用于特定的图像，则需要更改CSS选择器以适应您正在尝试的操作

要从Orchard管理中真正看到这一点，您必须将此样式添加到

/Modules/TinyMce/Scripts/themes/advanced/skins/default/content.css

，并从浏览器中清除缓存

要在主题中看到这一点，您必须将此样式添加到主题的CSS中