head 中的内部样式和脚本未应用

Question

我正在使用 Joomla 和 T3 模板。我在 </head> 标签之前添加了以下 "Custom Code"：

<style type="text/stylesheet">
  div.t3-sidebar.t3-sidebar-right{
    background: #F8F8F8 none repeat scroll 0% 0%;
    border: 1px solid rgb(238, 238, 238);
    border-radius: 20px;
  }
  button.btn.btn-primary.off-canvas-toggle{
    font-size: 28px;
  }
</style>
<script type="text/javascript">
  $(document).ready(function(){
    $("button.btn.btn-primary.off-canvas-toggle i.fa.fa-bars").addClass("fa-user").removeClass("fa-bars");
  });
</script>

当我使用我的浏览器开发工具时，我可以在头部看到这些标签，但当我检查元素时，没有应用样式。

编辑：样式现在可以使用了，我愚蠢地使用了错误的类型。感谢所有提出此更改的人。

关于脚本问题：我在控制台中没有收到任何错误。

最终编辑：脚本问题已解决。可能是 jQuery 函数的名称有问题（jQuery 而不是$) 或者 document.ready 函数的括号有问题。

Answer 1

您的 CSS 不工作，因为

<style type="text/stylesheet">

应该是

<style type="text/css">

而你的 javascript 不工作，因为你没有导入 jQuery。

导入的方法有很多种jQuery，这是其中一种：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>

Answer 2

应该是text/css

这里是修改后的代码。

<style type="text/css">
  div.t3-sidebar.t3-sidebar-right{
    background: #F8F8F8 none repeat scroll 0% 0%;
    border: 1px solid rgb(238, 238, 238);
    border-radius: 20px;
  }
  button.btn.btn-primary.off-canvas-toggle{
    font-size: 28px;
  }
</style>
<script type="text/javascript">
  $(document).ready(function(){
    $("button.btn.btn-primary.off-canvas-toggle i.fa.fa-bars").addClass("fa-user").removeClass("fa-bars");
  });
</script>

head 中的内部样式和脚本未应用

Internal style and script in head are not applied

javascript

css

joomla3.0