Joomla 文章背景 CSS

Question

我希望每篇文章默认显示一个背景（颜色）。我想在 css 文件中执行此操作，但我不知道将语句放在哪里。顺便说一句，我在任何 css 文件中都找不到文章标签的定义。

以下代码显示了 2 篇文章：

<div class="items-row cols-3 row-0 row">
    <div class="item column-1 col-md-4">
        <!-- Article -->
        <article>
            <header class="article-header clearfix">
                <h2 class="article-title" itemprop="name">
                    <a
                        href="/joomlatest/index.php/78-uncategorised/welcome"
                        itemprop="url" title="Welcome">
                        Welcome</a>
                </h2>
            </header>
            <!-- Aside -->
            <!-- //Aside -->
            <section class="article-intro clearfix">
                <p>Hi</p>
            </section>
            <!-- footer -->
            <!-- //footer -->
        </article>
        <!-- //Article -->
    </div>
    <div class="item column-2 col-md-4">
        <!-- Article -->
        <article>
            <header class="article-header clearfix">
                <h2 class="article-title" itemprop="name">
                    <a
                        href="/joomlatest/index.php/dates/testdate"
                        itemprop="url"
                        title="Testdate">
                        Testdate</a>
                </h2>
            </header>
            <!-- Aside -->
            <!-- //Aside -->
            <section class="article-intro clearfix">
                <p>some Text</p>
                <p>
                    <img src="/joomlatest/images/9697505.jpg" alt="9697505" />
                </p>
            </section>
            <!-- footer -->
            <!-- //footer -->
        </article>
        <!-- //Article -->
    </div>
</div>

有什么想法我应该操纵哪个样式表或哪个标签，或者有没有其他方法可以做到这一点？

Answer 1

CSS 放在哪里取决于网站。如果您是开发人员，您可以将 CSS 文件添加到扩展等；如果是用户，您使用的模板最有可能放置您的 CSS，这将取决于您使用的特定模板。您可以在管理员中 select 覆盖一些模板，对于其他模板，您需要找到模板（在 /templates/yourtemplate 中）并选择要编辑的 CSS 文件；通常，它位于名为 css 的文件夹中，而主 css 文件可能名为 template.css。一些商业模板具有自定义 css 文件，因此您可以避免在更新模板时覆盖自定义 css。

如何应用背景颜色，取决于您的joomla 版本以及文章的具体显示方式。在您的实例中，应用到 div.item 可能会起作用，但项目也可能显示在 class 项目页面中，或者模板可能会覆盖各种文章显示选项之一的库存 joomla 布局。因此，您可能想要检查页面并找出使用了哪些 classes，并确保检查各种不同的页面以查看项目显示的不同方式（例如类别 - 博客、单篇文章、特色文章，或您用来以其他方式显示内容的任何特定模块或组件。

Answer 2

我刚刚找到了一个解决方案，我不必更改模板的 css 文件（感谢 Charlie 的 ). The template I'm using (Purity III T3 template）有一个名为 "Custom Code" 的菜单后端。这里我在字段 After <head> 添加了代码。

<style>
article {
    background-color: rgba(255,255,255,0.4);
    border-style: solid;
    border-color: rgba(51,153,51,0.5);
    border-width: 20px;
    padding: 20px
}
</style>

可能不是最好的解决方案，但对我有用。

Joomla 文章背景 CSS

Joomla article background CSS

html

css

joomla