Question

我已经阅读了关于内联样式的jquery语句，但是花了一些时间（几个小时）才找到答案我仍然难倒。

我可以看到我想要覆盖的内联语句，并且可以在firebug中暂时执行

下面的语句在两个地方内联显示，我试图用custom.css文件覆盖，但它不会改变。

#sp-feature-wrapper {
    background: none repeat scroll 0% 0% #FC0000 !important;
}

我试过看一个不同的模板，看看我是否可以解决这个问题，但到目前为止无济于事。

如果有一个jquery语句我可以用来关闭内联样式（在模板中创建，而不是在任何.css文件中创建）for feature wrapper它会进入custom.css文件还是我需要创建一个不同类型的文件

感谢您的协助。

这是我下面的index.php文件，其中我尝试了各种建议（我已经获得了一些很好的想法，但我缺乏了解，通常会出现错误）

<?php
 /**
 * @package Helix Framework
 * Template Name - Shaper Helix
 * @author JoomShaper http://www.joomshaper.com
 * @copyright Copyright (c) 2010 - 2013 JoomShaper
 * @license http://www.gnu.org/licenses/gpl-2.0.html GNU/GPLv2 or later
*/
//no direct accees
defined ('_JEXEC') or die ('resticted aceess'); 

?><!DOCTYPE html>
<!--[if lt IE 7]>      <html class="no-js lt-ie9 lt-ie8 lt-ie7"  lang="<?php echo      $this->language; ?>"> <![endif]-->
<!--[if IE 7]>         <html class="no-js lt-ie9 lt-ie8"  lang="<?php echo $this->language; ?>"> <![endif]-->
<!--[if IE 8]>         <html class="no-js lt-ie9"  lang="<?php echo $this->language; ?>"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js" lang="<?php echo $this->language; ?>"> <!--  <![endif]-->
<head>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <jdoc:include type="head" />
    <?php
        $this->helix->Header()
        ->setLessVariables(array(
                'preset'=>$this->helix->Preset(),
                'header_color'=> $this->helix->PresetParam('_header'),
                'bg_color'=> $this->helix->PresetParam('_bg'),
                'text_color'=> $this->helix->PresetParam('_text'),
                'link_color'=> $this->helix->PresetParam('_link'),
                //'footer_color'=> $this->helix-     >PresetParam('_footer')
            ))
        ->addLess('master', 'template')
        ->addLess( 'presets',  'presets/'.$this->helix->Preset() );
    ?>
</head>
<body <?php echo $this->helix->bodyClass('bg hfeed clearfix'); ?>>
    <div class="body-innerwrapper">
    <!--[if lt IE 8]>
    <div class="chromeframe alert alert-danger" style="text-align:center">You are using   an <strong>outdated</strong> browser. Please <a target="_blank" href="http://browsehappy.com/">upgrade your browser</a> or <a target="_blank" href="http://www.google.com/chromeframe/?redirect=true">activate Google Chrome Frame</a> to improve your experience.</div>
    <![endif]-->
    <?php
        $this->helix->layout();
        $this->helix->_Footer();
    ?>
    <jdoc:include type="modules" name="debug" />
    </div>
</body>
</html>

Answer 1

使用样式元素定义内联样式。您正在使用id为元素添加样式。

HTML

<div id="sp-feature-wrapper" class="sp-feature-class">Test</div>
<div id="sp-feature-inline" style="background-color:green;">Test2</div>
<a href="#;" id="remove">Remove Style Test</a>

Jquery的

$("#remove").on("click",function(){
    $("#sp-feature-wrapper").removeClass("sp-feature-class");
    $("#sp-feature-inline").css("background-color","red");
});

请检查小提琴。希望这能解决你的问题。 http://jsfiddle.net/29wrX/1/

Answer 2

使用css，您可以覆盖 style属性为

#sp-feature-wrapper[style] {
   background: yellow !important;
}

或者向您的div＆amp;添加新课程 ＆＃39;覆盖＆＃39; 使用

#sp-feature-wrapper.override {
   background: yellow !important;
}

或者使用jQuery作为

$('#sp-feature-wrapper').css('background', '');

我试图删除一个具有！important的内联样式;我无法使用custom.css文件覆盖它

2 个答案: