如何用浏览器默认CSS覆盖Materialise CSS？

Question

I'm making a web application using Javascript, AngularJS and Materialize CSS for my UI. Materialize CSS has been a great tool so far but I have a problem.

I want to use Angular-Datatables for my tables but I can't because they're being manipulated by Materialize CSS. You don't even have to write anything special, you just write <table> and you're already using Materialize's table.

So my question is: how do I keep using Materialize CSS for everything else, but use the default tables' CSS so I can use Angular-Datatables?

Thanks.

EDIT:

Here's my HTML code:

<table>
    <thead>
        <tr>
            <th style="width:15%"><b>ID</b></th>
            <th style="width:40%"><b>Title</b></th>
            <th style="width:15%"><b>Start Date</b></th>
            <th style="width:20%"><b>End Date</b></th>
            <th style="width:10%"><b>Type</b></th>
        </tr>
    </thead>
    <tbody>
        <tr ng-repeat="task in tasks track by $index">
            <td>{{task.id}}</td>
            <td>{{task.title}}</td>
            <td>{{task.start_day}} {{task.start_time}}</td>
            <td>{{task.end_day}} {{task.end_time}}</td>
            <td>{{task.type}}</td>
        </tr>
    </tbody>
</table>

This code produces the following table:

With angular-datatables, and if you follow their site you just need to change the <table> tag to <table datatable=""> , it looks like this:

Answer 1

You have three choices:

1.) Identify the offending rules added by Materialize and overwrite them to match the styling you require in your own style sheet

2.) Use the un-minified version of Materialize and remove the offending styles

3.) Remove any table styling from Materialize source and compile the SASS yourself ( https://prepros.io/ this should work to compile your SASS)