使用CSS隐藏表中的列

I want to hide some of the columns in the table below. It is from a wordpress plugin so the ids and classes are predefined. I hope I can solve it with css fx: display:none, but I cant seem to get it to work.

我想隐藏下表中的一些列。它来自wordpress插件，因此id和类是预定义的。我希望我可以用css fx解决它：display：none，但我似乎无法让它工作。

<table cellspacing="0" class="wp-list-table widefat fixed brugere">
    <thead>
        <tr>
            <th class="manage-column column-company_name sortable asc" id="company_name" scope="col" style="">
                <a href="http://xxx.xxx.dk/xxx/?orderby=company_name&amp;order=desc"><span>Virksomhed</span><span class="sorting-indicator"></span></a>
            </th>
            <th class="manage-column column-CVR._Nr." id="CVR._Nr." scope="col" style="">CVR. Nr.</th>
            <th class="manage-column column-arbejdsområde" id="arbejdsområde" scope="col" style="">Arbejdsområde</th>
            <th class="manage-column column-fagområde" id="fagområde" scope="col" style="">Fagområde</th>
            <th class="manage-column column-address_zipcode sortable asc" id="address_zipcode" scope="col" style="">
                <a href="http://xxx.xxx.dk/xxx/?orderby=address_zipcode&amp;order=desc"><span>Postnummer</span><span class="sorting-indicator"></span></a>
            </th>
            <th class="manage-column column-address_city sortable asc" id="address_city" scope="col" style="">
                <a href="http://xxx.xxx.dk/xxx/?orderby=address_city&amp;order=desc"><span>By</span><span class="sorting-indicator"></span></a>
            </th>
            <th class="manage-column column-tlf._nr." id="tlf._nr." scope="col" style="">Tlf. Nr.</th>
            <th class="manage-column column-email sortable asc" id="email" scope="col" style="">
                <a href="http://xxx.xxx.dk/xxx/?orderby=email&amp;order=desc"><span>Email</span><span class="sorting-indicator"></span></a>
            </th>
            <th class="manage-column column-view" id="view" scope="col" style="">Se mere</th>
        </tr>
    </thead>
    <tfoot>
        <tr>
            <th class="manage-column column-company_name sortable asc" scope="col" style="">
                <a href="http://xxx.xxx.dk/xxx/?orderby=company_name&amp;order=desc"><span>Virksomhed</span><span class="sorting-indicator"></span></a>
            </th>
            <th class="manage-column column-CVR._Nr." scope="col" style="">CVR. Nr.</th>
            <th class="manage-column column-arbejdsområde" scope="col" style="">Arbejdsområde</th>
            <th class="manage-column column-fagområde" scope="col" style="">Fagområde</th>
            <th class="manage-column column-address_zipcode sortable asc" scope="col" style="">
                <a href="http://xxx.xxx.dk/xxx/haandvaerkerliste/?orderby=address_zipcode&amp;order=desc"><span>Postnummer</span><span class="sorting-indicator"></span></a>
            </th>
            <th class="manage-column column-address_city sortable asc" scope="col" style="">
                <a href="http://xxx.xxx.dk/xxx/?orderby=address_city&amp;order=desc"><span>By</span><span class="sorting-indicator"></span></a>
            </th>
            <th class="manage-column column-tlf._nr." scope="col" style="">Tlf. Nr.</th>
            <th class="manage-column column-email sortable asc" scope="col" style="">
                <a href="http://xxx.xxx.dk/xxx/?orderby=email&amp;order=desc"><span>Email</span><span class="sorting-indicator"></span></a>
            </th>
            <th class="manage-column column-view" scope="col" style="">Se mere</th>
        </tr>
    </tfoot>
    <tbody class="list:bruger" id="the-list">
        <tr class="alternate">
            <td class="company_name column-company_name">DHV</td>
            <td class="CVR._Nr. column-CVR._Nr.">20891940</td>
            <td class="arbejdsområde column-arbejdsområde">Bornholm, Lolland og Falster, Nordsjælland</td>
            <td class="fagområde column-fagområde">Gardin, Gulve, fremstilling</td>
            <td class="address_zipcode column-address_zipcode">2300</td>
            <td class="address_city column-address_city">Kbh S</td>
            <td class="tlf._nr. column-tlf._nr."></td>
            <td class="email column-email">test@hotmail.com</td>
            <td class="view column-view">
                <a href="http://xxx.xxx.dk/xxxside/?member_id=xx" target="_blank">Klik her</a>
            </td>
        </tr>
    </tbody>
</table>

2 个解决方案

#1

You can use the nth-child selector in CSS to hide the columns you need. But in that case you need to hide that same th as well.

您可以在CSS中使用nth-child选择器来隐藏所需的列。但在这种情况下，你需要隐藏同样的东西。

CSS:

CSS：

table tr th:nth-child(1), table tr td:nth-child(1){
 display:none;// It will hide the first column of the table
}

Also check this for better understanding https://css-tricks.com/how-nth-child-works/

另外，请检查以便更好地了解https://css-tricks.com/how-nth-child-works/

#2

Try to add in a separate .CSS (and call this .CSS in last in your head) and for example try

尝试添加一个单独的.CSS（并在头脑中称之为.CSS），例如尝试

#company_name {
display: none; //If it doesn't work try visibility: hidden;
}

from w3school

来自w3school

#1