在 Typo3 中更改内容元素的 CSS 的最佳方法是什么?
What is the best way to change the CSS of a content element in Typo3?
我正在创建一个列出公司员工的网页。每个员工都应该有自己的盒子,左边是文字,右边是他们的照片。为此,我为每位员工使用了 'Text & Images' 内容元素。
但是,图像对齐选项不允许我使用文本换行将图像放置在文本的右侧(所有选项都是非换行选项)。确保图片最终出现在文本右侧的最佳方法是什么?
This is an example of a picture that is right aligned with wrap.
此外,我还想要每个 'Text & Images' 内容元素的边框样式。我该怎么做?
使用 "Text and Images" 内容元素时,您可以选择以下有关图像和文本位置的选项:
- 上面,中间
- 上,左
- 上右
- 下方,居中
- 左下方
- 右下方
- 在正文中,对
- 在正文中,左
- 文字旁边,右边
- 文字旁边,左边
"In text, right" 和 "In text, left" 都用文字包裹图像,如下例图片所示:
如果您的选项较少,则有一些 TSConfig 限制了选项的数量;可能是这样的
TCEFORM.tt_content.imageorient.removeItems = 17,18
关于 CSS,您可以通过多种方式加入您的;例如,您可以使用 page.includeCSS
as documented here 添加您自己的文件,或者您可以在模板分析器上用您自己的(参见 plugin.tx_frontend._CSS_DEFAULT_STYLE
)覆盖流体样式内容包含的 TypoScript。
要包含默认 CSS,您必须在模板中包含静态 TypoScript Fluid Content Elements CSS (optional) (fluid_styled_content)
,如下图所示:
此外,我会使用检查器来确保 CSS 没有被意外覆盖。
我正在创建一个列出公司员工的网页。每个员工都应该有自己的盒子,左边是文字,右边是他们的照片。为此,我为每位员工使用了 'Text & Images' 内容元素。
但是,图像对齐选项不允许我使用文本换行将图像放置在文本的右侧(所有选项都是非换行选项)。确保图片最终出现在文本右侧的最佳方法是什么?
This is an example of a picture that is right aligned with wrap.
此外,我还想要每个 'Text & Images' 内容元素的边框样式。我该怎么做?
使用 "Text and Images" 内容元素时,您可以选择以下有关图像和文本位置的选项:
- 上面,中间
- 上,左
- 上右
- 下方,居中
- 左下方
- 右下方
- 在正文中,对
- 在正文中,左
- 文字旁边,右边
- 文字旁边,左边
"In text, right" 和 "In text, left" 都用文字包裹图像,如下例图片所示:
如果您的选项较少,则有一些 TSConfig 限制了选项的数量;可能是这样的
TCEFORM.tt_content.imageorient.removeItems = 17,18
关于 CSS,您可以通过多种方式加入您的;例如,您可以使用 page.includeCSS
as documented here 添加您自己的文件,或者您可以在模板分析器上用您自己的(参见 plugin.tx_frontend._CSS_DEFAULT_STYLE
)覆盖流体样式内容包含的 TypoScript。
要包含默认 CSS,您必须在模板中包含静态 TypoScript Fluid Content Elements CSS (optional) (fluid_styled_content)
,如下图所示:
此外,我会使用检查器来确保 CSS 没有被意外覆盖。