php - 这个无法访问的区域是否可以仅使用 CSS 进行链接？

Question

我必须管理一个有以下情况的网站:

我们在网站上有一个横幅系统，但横幅只能在小范围内点击。我想让它们都可以点击，但有一些限制。

我没有访问 php 文件的权限，我可以在一定级别后管理 HTML。目前我只能管理图像上标记的小区域。 Example of the area

我写的每一个代码都只放在这个标记区域。没有办法让整个横幅都可以点击，因为 GUI 上没有那种选项。我认为我可以使用该区域上方的 CSS 类作为目标，但不能编辑 HTML。

是否有一个选项可以让所有这些区域都可以点击而不会弄乱一切？

这是一个横幅的完整 HTML 代码:

<li class="flex-active-slide" style="width: 1583px; float: left; display: block;">
  <div class="image-flexslider-content-left clearfix">
    <div class="views-field views-field-field-slider-image">
      <div class="field-content"><img typeof="foaf:Image" src="/example-image.png" alt="" draggable="false" style="margin-left: -84.25px; height: 510px;"></div>
    </div>
  </div>
  <div class="white">
    <div class="logo-big mobile-logo">
      <h1 class="logo">
        <a href="/" title="Lorem"></a>
      </h1>
    </div>
  </div>
  <div class="wrapper-container white">
    <div class="logo-big">
      <h1 class="logo">
        <a href="/" title="Lorem"></a>
      </h1>
    </div>
    <div class="slide-cover flexslider-content-left">
      <div class="views-field views-field-title"> <span class="field-content"></span> </div>
      <div class="views-field views-field-body">
        <div class="field-content">
          <a href="/something/more/">
            <div class="double-container">
              <p class="double-blue-head larger-head" style="font-size: 2.4rem !important; font-weight: bold;">Line of text 1</p>
            </div>
            <div class="double-container">
              <p class="double-blue-head larger-head" style="font-size: 2.4rem !important; font-weight: bold;">Line of text 2</p>
            </div>
          </a>
          <div class="double-container blue-responsive double-blue-head larger-head myt-margin" style="padding: 10px 12px  15px 20px; margin-top: 40px;">
            <a href="/something/more/"> <img src="/images/example.png" style="width:100% !Important; max-width:435px !Important; margin-top: 10px; height:auto !important;" draggable="false"></a>
          </div>

        </div>
      </div>
      <div class="views-field views-field-contextual-links"> <span class="field-content"></span> </div>
    </div>
  </div>
</li>

Answer 1

您可以将标签移到整个 div class="field-content"之外

<div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-html lang-html prettyprint-override"><code><a href="/something/more/">
     <div class="field-content">
        
            <div class="double-container">
              <p class="double-blue-head larger-head" style="font-size: 2.4rem !important; font-weight: bold;">Line of text 1</p>
            </div>
            <div class="double-container">
              <p class="double-blue-head larger-head" style="font-size: 2.4rem !important; font-weight: bold;">Line of text 2</p>
            </div>
          <div class="double-container blue-responsive double-blue-head larger-head myt-margin" style="padding: 10px 12px  15px 20px; margin-top: 40px;">
            <a href="/something/more/"> <img src="/images/example.png" style="width:100% !Important; max-width:435px !Important; margin-top: 10px; height:auto !important;" draggable="false"></a>
          </div>

        </div>
</a></code></pre>
</div>
</div>