Question

在TYPO3中，我在页面上添加了一个项目符号列表“TEXT content / element”。

工作正常，但布局不适用于网站的其余部分。现在，如果我有一个CSS类“cmsms_timeline”可以使子弹点列表更好的布局，我怎么能将该类添加到TYPO3中的UL，所以我不需要转到“HTML”内容并添加类。

我添加了CSS，我只需要知道如何添加它，我需要去“HTML”视图然后添加类og我可以从内容元素使用我的CSS文件中的MY类吗？可以使用csc-default看到它。

<!--  CONTENT ELEMENT, uid:29/text [begin] -->
<div id="c29" class="csc-default">
<!--  Text: [begin] -->
    <ul type="disc">...</ul>
<!--  Text: [end] -->
    </div>

UDPATE

我正在运行TYPO3 v.6.1（流体/ Extbase）。

您好我已尝试在MASTER页面TSConfig中添加此内容。

RTE.default.contentCSS = fileadmin/templates/add/css/style.css
RTE.default.showTagFreeClasses = 1
RTE.default.proc.allowedClasses := addToList(cmsms_timeline)

当我参考样式表并添加cmsms_timeline时，我会突出显示项目符号，我可以选择块样式的项目，但不显示cmsms_timeline。

在WEB下 - ＆gt;信息 - ＆gt;页面TSconfig - ＆gt; RTE。在默认情况下我可以看到我有

[contentCSS] = fileadmin/templates/add/css/style.css 
[showTagFreeClasses] = 1

，所以它从TSConfig获取信息。

我的Style.css文件中包含此代码。

.cmsms_timeline {
  position:relative;
  margin:-11px 0 0 0;
  padding:0 0 37px 29px;
  list-style:none;

}

.cmsms_timeline li {
  position:relative;
  padding-top:24px;
}

.cmsms_timeline li:before,
.cmsms_timeline:before {
  position:absolute;
  top:-2px;
  left:0;
  -webkit-box-sizing:border-box;
  -moz-box-sizing:border-box;
  box-sizing:border-box;
  width:1px;
  height:28px;
  background:rgba(0, 0, 0, .08);
  content:'';
}

.cmsms_timeline:before {
  top:auto;
  bottom:11px;
  left:29px;
}

.cmsms_timeline li a {
  position:relative;
  padding-left:13px;
  -webkit-transition:all .3s ease-in-out;
  -moz-transition:all .3s ease-in-out;
  -ms-transition:all .3s ease-in-out;
  -o-transition:all .3s ease-in-out;
  transition:all .3s ease-in-out;
}

.cmsms_timeline li a:hover {padding-left:19px;}

.cmsms_timeline li a:before {
  position:absolute;
  top:5px;
  left:-2px;
  width:5px;
  height:5px;
  -webkit-border-radius:50%;
  -moz-border-radius:50%;
  border-radius:50%;
  background:rgba(0, 0, 0, .2);
  content:'';
  -webkit-transition:background .3s ease-in-out;
  -moz-transition:background .3s ease-in-out;
  -ms-transition:background .3s ease-in-out;
  -o-transition:background .3s ease-in-out;
  transition:background .3s ease-in-out;
}

我错过了什么。

Answer 1

RTE有两个预定义的列表类：action-items和component-items（action-items-ordered和component-items-ordered表示OL列表）并且最容易采用它们在你的样式表中（只需将cmsms_timeline的声明复制到其中一个）。

要将类设置为整个列表，只需用鼠标选择其所有项目，然后RTE将启用块样式选择。

PS。添加自定义/附加类需要很多努力，可以在谷歌轻松找到：
' typo3 rte自定义块样式 '，但对于快速样式，我认为这不值得付出努力。

Answer 2

标准RTE编辑器（rtehtmlarea）可以通过解析为其设置的CSS文件来填充类列表，因此您需要做的就是在该CSS文件中定义ul.cmsms_timeline。手册说的是什么：

包含应该是样式定义的CSS文件适用于编辑过的内容。此文件中定义的选择器也将在块中使用样式和文本样式选择列表。

配置示例：

RTE.default.contentCSS = fileadmin/template/rte.css

该设置将插入（最好是根目录）页面属性中的 TSconfig 字段。您可以打开 WEB - ＆gt;信息 - ＆gt;页面TSconfig - ＆gt; RTE。以查看所有RTE设置。请注意，每个数据库表可能都有自己的配置（例如RTE.tt_content.），因此请确保不会覆盖特定表的默认设置。

另请注意，每次更改文件后，您都可能需要在浏览器中打开此文件或清除浏览器的缓存。这是为了确保您的浏览器缓存当前版本的文件，从而RTE将使用它。

设置完成后，您只需在“块样式”选择框中选择后，即可在RTE中分配该类...

a） ...突出显示所有列表项。

b） ...点击任意列表项后，点击RTE底部显示的ul中的Path: body » ul » li。

TYPO3在TEXT内容视图中将样式类添加到UL后端

2 个答案: