有没有办法将样式表的优先级设置为高于!important?

时间:2015-11-05 12:19:00

标签: css wordpress

我知道我不应该真的问这个问题,但是在我投票被遗忘之前听到我的声音......我试图在一个非常糟糕的情况下做到最好:

我的客户已经购买了一个WordPress主题并聘请我定制它的一些部分。购买的主题是一个儿童主题,是一个编码恐怖...... 主题的样式表试图覆盖woocommerce插件中的一些样式,而woocommerce样式表则在主题的样式表之后加载。为此,它使用了大量!important声明。如果不破坏主题更新功能,我无法解决任何问题。

所以这是我的计划:我想在最后添加另一个样式表,它会覆盖之前完成的所有混乱。但是简单地将它放在那里就不会覆盖样式表中的所有!important声明。所以我想知道是否有一种方法可以将我的样式表优先于之前的所有混乱。

任何提升!important声明之上的优先级的方式也不胜感激!

4 个答案:

答案 0 :(得分:4)

你可以:

  1. 确保您的声明同等specific,但稍后会在样式表中显示:
  2. 
    
    div p strong {color:red!important}
    div p strong {color:blue!important}
    
    <section>
      <div>
        <p>lorem <strong>ipsum</strong></p>
      </div>
    </section>
    &#13;
    &#13;
    &#13;

    1. 使您的声明更多具体:
    2. &#13;
      &#13;
      section div p strong {color:blue!important}
      div p strong {color:red!important}
      &#13;
      <section>
        <div>
          <p>lorem <strong>ipsum</strong></p>
        </div>
      </section>
      &#13;
      &#13;
      &#13;

      请参阅:https://css-tricks.com/specifics-on-css-specificity/了解一些有用的提示。

答案 1 :(得分:2)

通常使用子主题,您可以直接编辑它。但是如果你担心获得子主题的更新,你也可以取消注册糟糕的样式表并从插件中排队你自己的版本。

<?php
/*
Plugin Name: Fix Theme Stylesheets
Plugin URI:  http://stackoverflow.com/q/33544364/383847
Description: Save me from these poorly coded marketplace themes
Version:     0.1-alpha
Author:      helgatheviking
Author URI:  http://kathyisawesome.com
 */


function so_33544364_custom_scripts() {
    $theme = get_template();

    if( ! is_admin() && 'your-themes-folder-name' == $theme ){
        // get rid of the child theme's crappy stylesheet
        wp_deregister_style( 'child-style' );
        // optionaly load the parent theme directly instead of importing. can be better for minifying plugins
        wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );
        // load your improved stylsheet! style.css in the same folder as this plugin file
        wp_enqueue_style( 'your-style', plugins_url( 'style.css', __FILE__ ) );
    }
}

add_action( 'wp_enqueue_scripts', 'so_33544364_custom_scripts' );

答案 2 :(得分:0)

在99%的案例中,{p> !important是一种懒惰的方式来获得应该达到的更具体的东西;特异性和定位都是关键元素,例如:

p.foo { text-align: right; } 

可以用这种方式覆盖:

body p.foo { text-align: left; }

特异性非常重要,这是正确的方法,在这里你可以如何计算它: link

答案 3 :(得分:-1)

你会尝试使用父div..eg: -

.parent_div Child_div ul li{
  margin: 0px;
}

这是没有使用的方法!important.parent div最重要的是preroty而不是!important