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

时间:2016-05-25 15:10:29

标签: javascript angularjs html-table angular-datatables

我正在为我的UI使用Javascript,AngularJS和Materialize CSS创建一个Web应用程序。到目前为止,实现CSS一直是一个很好的工具,但我遇到了问题。

我想为我的表使用Angular-Datatables,但我不能,因为它们被Materialise CSS操纵。你甚至不需要写任何特别的东西,你只需要写<table>并且你已经在使用Materialise的表了。

所以我的问题是:如何继续使用Materialise CSS,但是使用默认表格的CSS,我可以使用Angular-Datatables?

感谢。

修改

这是我的HTML代码:

<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>

此代码生成下表:

使用角度数据表,如果您关注他们的网站,则只需将<table>代码更改为<table datatable="">,它看起来像这样:

1 个答案:

答案 0 :(得分:2)

您有三种选择:

1。)确定Materialise添加的违规规则并覆盖它们以匹配您自己的样式表中所需的样式

2.。)使用未缩小版的Materialise并删除有问题的样式

3。)从Materialise源中删除任何表样式并自行编译SASS(https://prepros.io/这应该可以编译你的SASS)