Html 如何保持：单击按钮后保持活动css样式

单击按钮后，我希望它保持活动样式，而不是返回正常样式。这可以用CSS来完成吗？我正在使用DIVI主题（WordPress）的blurb按钮。请帮帮我

代码：

#blurb-hover.et_pb_blurb .et_pb_blurb_content 
.et_pb_main_blurb_image .et-pb-icon:hover {
       color: red !important; }

#blurb-hover.et_pb_blurb .et_pb_blurb_content 
.et_pb_main_blurb_image .et-pb-icon:selected {
  background-color: #ff4b46;
  color: #fff; }

#blurb-hover.et_pb_blurb .et_pb_blurb_content 
.et_pb_main_blurb_image .et-pb-icon:active {
    color: white !important;
   background-color: red; 
    width: 140px;
    height: 100px; }

CSS

：active

表示交互状态（因此在按下按钮时会应用按钮），

：focus

可能是更好的选择。但是，一旦另一个元素获得焦点，样式就会丢失

使用CSS的最后一种可能的替代方法是使用

：target

，假设正在单击的项目正在页面内设置路由（例如锚），但是如果您使用路由（例如角度），这可能会中断，但是这里的情况似乎不是这样

.active：激活{
颜色：红色；
}
.焦点：焦点{
颜色：红色；
}
：目标{
颜色：红色；
}

激活
集中

在中，它说主题附带了“ePanel”的访问权限，其中还包含“集成”部分

您应该能够添加以下代码：

<script>
 $( ".et-pb-icon" ).click(function() {
 $( this ).toggleClass( "active" );
 });
</script>

$（“.et pb图标”）。单击（函数（）{
$（此）.toggleClass（“活动”）；
});

进入“集成”选项卡下写有“将代码添加到博客标题”的框中，这将使jQuery正常工作

---

然后，你应该能够根据你的需要来设计你的课程

我明白了。简单、有效无需jQUERY

我们将使用一个隐藏的复选框。
此示例包括一个“打开单击-关闭单击‘悬停/活动’状态”

--

要使内容本身可单击，请执行以下操作：

HTML

<input type="checkbox" id="activate-div">
  <label for="activate-div">
   <div class="my-div">
      //MY DIV CONTENT
   </div>
  </label>

<input type="checkbox" id="activate-div">
   <div class="my-div">
      //MY DIV CONTENT
   </div>

<label for="activate-div">
   //MY BUTTON STUFF
</label>

要更改按钮内容，请执行以下操作：

HTML

<input type="checkbox" id="activate-div">
  <label for="activate-div">
   <div class="my-div">
      //MY DIV CONTENT
   </div>
  </label>

<input type="checkbox" id="activate-div">
   <div class="my-div">
      //MY DIV CONTENT
   </div>

<label for="activate-div">
   //MY BUTTON STUFF
</label>

---

希望能有帮助

这信息太少了。这个按钮是做什么的？它是否会将您重定向到新页面？你的HTML是什么样子的？你想要的结果是什么？Jquery我正试图把这段功能代码放到wordpress中。。但当我点击我的网页上的图标/图像时，它不会保持选中状态。怎么了？代码：我写的代码还在使用，这很酷！原文：我可以在图像上使用CSS代码而不是链接/按钮吗？

：target

只能与导航器路径一起使用，因此页面的URL需要相应地更改，因此将图像包装在

a

，

焦点

需要一个tabbable元素，因此在图像上设置

tabindex='0'