我正在尝试修改woocommerce网站，我很少接受HTML/CSS培训。我学到的大部分知识都来自反复试验、一些在线教程、在Chrome中使用开发人员控制台等等。。。。

我正在尝试将图像边框添加到页面标题的顶部，正好在名为tg-container. 我可以使用一个现有的类在它下面放置一个，我不需要查看它的信息。是否可以在主题中内置额外的CSS界面，或者我必须进入样式中。css和html来创建boarder？我知道附加CSS界面的好处是，每当主题更新时，无需直接编辑主题文件。

Bypass Page

Example Page with border - accessible only after bypass page is visited

IMAGE: Example page with Chrome Developer Console open and showing code for area

-------------------- 进一步试验-------------------------

我创建了一个子主题，并试图以这种方式添加它，但我缺少了一些东西（因为我不是编码员），我能够为图像创建区域，但图像没有显示出来。我尝试将其添加到子主题和父主题（编辑style.css 和page.php).

在page.php 子女（和父母）（以下内容之后）

<div class="page-header clearfix">
            <div class="tg-container">

我补充道

<h3 class="title-border"> </h3>

我在style.css 儿童的：

/*Add Wycinanki Borders*/

.title-border {
  background-image: url("https://store.dolina.org/wp-content/uploads/2020/08/wall-murals-floral-polish-folk-art-pattern-in-square-wycinanki.jpg-e1596302126833.jpg");
  background-repeat: repeat-x;
  font-weight: 600;
  color: #3b3b3b;
  font-size: 14px;
  line-height: 30px;
  margin: 5px 0;
}

我在style.css 儿童的：

/*Add Wycinanki Borders*/

.page-header .title-border {
  background-image: url("https://store.dolina.org/wp-content/uploads/2020/08/wall-murals-floral-polish-folk-art-pattern-in-square-wycinanki.jpg-e1596302126833.jpg");
  background-repeat: repeat-x;
  font-weight: 600;
  color: #3b3b3b;
  font-size: 14px;
  line-height: 30px;
  margin: 5px 0;
}

我在style.css 父母：

.page-header .title-border {
        background-image: url("https://store.dolina.org/wp-content/uploads/2020/08/wall-murals-floral-polish-folk-art-pattern-in-square-wycinanki.jpg-e1596302126833.jpg");
        background-repeat: repeat-x;
        font-weight: 600;
       color: #3b3b3b;
    font-size: 14px;
    line-height: 30px;
    margin: 5px 0; }

同样，它为图像创建了空间，但图像没有显示出来。我复制了；条目子标题“；，在那里，我成功地放置了图像，认为它们的样式应该是相同的。

谢谢你的洞察力和帮助我了解我在做什么，哈哈哈。

.page-header .title-border-top{
    background-image: url("https://store.dolina.org/wp-content/uploads/2020/08/wall-murals-floral-polish-folk-art-pattern-in-square-wycinanki.jpg-e1596302126833.jpg");
    background-repeat: repeat-x;
    height: 30px;
            margin: 10px;
}