如何忽略来自WordPress插件样式表的特定CSS代码? [英] How to ignore the specific CSS codes coming from the WordPress plugin stylesheet?

问题描述

我正在一个基于自定义主题的WordPress网站上工作，在该网站中，我想忽略来自 wordpress插件样式表的某些特定CSS代码.

I am working on a WordPress website built on custom theme in which I want to ignore some specific CSS codes coming from wordpress plugin style sheet.

这是 link 以获得该wordpress插件样式表.

Here is the link for that wordpress plugin style sheet.

我想忽略的上述Wordpress插件样式表中的CSS代码是:

The CSS codes from the above Wordpress plugin style sheet which I want to ignore is:

@media screen and (max-width: 575.98px) .gv-table-view tr:first-of-type {
    border-top: 1px solid #ccc;
}

@media screen and (max-width: 575.98px) .gv-table-view tr {
    display: block;
    position: relative;
    padding: 1.2em 0;
    overflow-x: auto;
}

 .gv-table-view th, .gv-table-view td {
        padding: .3em;
    } 

@media screen and (max-width: 575.98px) .gv-table-view tr td {
    display: table-row;
}

@media screen and (max-width: 575.98px) .gv-table-view tr td:before {
    content: attr(data-label);
    font-weight: bold;
    display: table-cell;
    padding: 0.2em 0.6em 0.2em 0;
    text-align: right;
    width: 40%;
}

问题陈述:

我想忽略以下网站移动版本中的上述CSS代码/"rel =" noreferrer>网址，它来自wordpress插件样式表.我想知道我需要在我的wordpress网站中到达哪个位置才能实现这一目标?

I want to ignore the above CSS codes in the mobile version of the following website url which is coming from wordpress plugin style-sheet. I am wondering where I need to go in my wordpress website in order to achieve that ?

如果我在移动视图中使用上述网址，则可以看到问题说明上方提到的CSS代码.

If I take the above url in the mobile view, we can see the CSS codes mentioned above the problem statement.

推荐答案

您可以通过两种方式实现这一目标.

You can achieve this in 2 ways.

解决方案1:在您的情况下，所有好的插件都会为其各自的CSS及其gravityview_style_default_table定义CSS句柄.只需在主题的"functions.php"中添加以下给定的功能即可删除特定的CSS.请注意，这将删除整个CSS，而不是仅删除媒体查询".然后，您可以将所需的CSS类添加到主题的样式表中.

Solution 1: All good plugins will define CSS handle for each of their CSS and its gravityview_style_default_table in your case. Just add the function given below in your theme's 'functions.php' to remove the particular CSS. Please note that this will remove the entire CSS and not the 'media queries' alone. You can then add the required CSS classes to your theme's stylesheet.

function remove_gravityview_table_style() {
    //check if mobile device
    $useragent=$_SERVER['HTTP_USER_AGENT'];
    if(preg_match('/(android|bb\d+|meego).+mobile|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|iris|kindle|lge |maemo|midp|mmp|netfront|opera m(ob|in)i|palm( os)?|phone|p(ixi|re)\/|plucker|pocket|psp|series(4|6)0|symbian|treo|up\.(browser|link)|vodafone|wap|windows (ce|phone)|xda|xiino/i',$useragent)||preg_match('/1207|6310|6590|3gso|4thp|50[1-6]i|770s|802s|a wa|abac|ac(er|oo|s\-)|ai(ko|rn)|al(av|ca|co)|amoi|an(ex|ny|yw)|aptu|ar(ch|go)|as(te|us)|attw|au(di|\-m|r |s )|avan|be(ck|ll|nq)|bi(lb|rd)|bl(ac|az)|br(e|v)w|bumb|bw\-(n|u)|c55\/|capi|ccwa|cdm\-|cell|chtm|cldc|cmd\-|co(mp|nd)|craw|da(it|ll|ng)|dbte|dc\-s|devi|dica|dmob|do(c|p)o|ds(12|\-d)|el(49|ai)|em(l2|ul)|er(ic|k0)|esl8|ez([4-7]0|os|wa|ze)|fetc|fly(\-|_)|g1 u|g560|gene|gf\-5|g\-mo|go(\.w|od)|gr(ad|un)|haie|hcit|hd\-(m|p|t)|hei\-|hi(pt|ta)|hp( i|ip)|hs\-c|ht(c(\-| |_|a|g|p|s|t)|tp)|hu(aw|tc)|i\-(20|go|ma)|i230|iac( |\-|\/)|ibro|idea|ig01|ikom|im1k|inno|ipaq|iris|ja(t|v)a|jbro|jemu|jigs|kddi|keji|kgt( |\/)|klon|kpt |kwc\-|kyo(c|k)|le(no|xi)|lg( g|\/(k|l|u)|50|54|\-[a-w])|libw|lynx|m1\-w|m3ga|m50\/|ma(te|ui|xo)|mc(01|21|ca)|m\-cr|me(rc|ri)|mi(o8|oa|ts)|mmef|mo(01|02|bi|de|do|t(\-| |o|v)|zz)|mt(50|p1|v )|mwbp|mywa|n10[0-2]|n20[2-3]|n30(0|2)|n50(0|2|5)|n7(0(0|1)|10)|ne((c|m)\-|on|tf|wf|wg|wt)|nok(6|i)|nzph|o2im|op(ti|wv)|oran|owg1|p800|pan(a|d|t)|pdxg|pg(13|\-([1-8]|c))|phil|pire|pl(ay|uc)|pn\-2|po(ck|rt|se)|prox|psio|pt\-g|qa\-a|qc(07|12|21|32|60|\-[2-7]|i\-)|qtek|r380|r600|raks|rim9|ro(ve|zo)|s55\/|sa(ge|ma|mm|ms|ny|va)|sc(01|h\-|oo|p\-)|sdk\/|se(c(\-|0|1)|47|mc|nd|ri)|sgh\-|shar|sie(\-|m)|sk\-0|sl(45|id)|sm(al|ar|b3|it|t5)|so(ft|ny)|sp(01|h\-|v\-|v )|sy(01|mb)|t2(18|50)|t6(00|10|18)|ta(gt|lk)|tcl\-|tdg\-|tel(i|m)|tim\-|t\-mo|to(pl|sh)|ts(70|m\-|m3|m5)|tx\-9|up(\.b|g1|si)|utst|v400|v750|veri|vi(rg|te)|vk(40|5[0-3]|\-v)|vm40|voda|vulc|vx(52|53|60|61|70|80|81|83|85|98)|w3c(\-| )|webc|whit|wi(g |nc|nw)|wmlb|wonu|x700|yas\-|your|zeto|zte\-/i',substr($useragent,0,4))) {
        //remove css
        wp_dequeue_style('gravityview_style_default_table');
        wp_deregister_style('gravityview_style_default_table');
    }
}
add_action('wp_print_styles', 'remove_gravityview_table_style');

解决方案2:您可以通过将主题中的特定CSS文件复制到[theme]/gravityview/css/table-view.css并进行必要的更改(即删除媒体查询")来覆盖它.

Solution 2: You can override the particular CSS file in your theme by copying it to [theme]/gravityview/css/table-view.css and make necessary changes (i.e. remove 'media queries').

这篇关于如何忽略来自WordPress插件样式表的特定CSS代码?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！