5

Vorrei combinare il bootstrap di Twitter con materiale angolare. Ho trovato il materiale di bootstrap design https://github.com/FezVrasta/bootstrap-material-designCombinazione di materiale angolare con bootstrap twitter senza conflitti

materiale angolare utilizza le seguenti dichiarazioni;

<script src="../bower_components/angular/angular.min.js"></script> 
<script src="../bower_components/angular-animate/angular-animate.min.js"></script> 
<script src="../bower_components/angular-aria/angular-aria.min.js"></script> 
<script src="../bower_components/angular-material/angular-material.min.js"></script> 

Per materiale bootstrap, le dichiarazioni nella documentazione sono come questa;

<!-- Material Design fonts --> 
    <link rel="stylesheet" type="text/css" href="//fonts.googleapis.com/css?family=Roboto:300,400,500,700"> 
    <link rel="stylesheet" type="text/css" href="//fonts.googleapis.com/icon?family=Material+Icons"> 

    <!-- Bootstrap --> 
    <link rel="stylesheet" type="text/css" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css"> 

    <!-- Bootstrap Material Design --> 
    <link rel="stylesheet" type="text/css" href="dist/css/bootstrap-material-design.css"> 
    <link rel="stylesheet" type="text/css" href="dist/css/ripples.min.css"> 

Ci saranno conflitti se includo tutti i collegamenti? Sono abbastanza confuso su come combinare materiale angolare e bootstrap.

+1

Quando si utilizza l'angolare e il bootstrap, si consiglia di utilizzare angular-bootstrap https://angular-ui.github.io/bootstrap/. Per quanto riguarda il design del materiale e il bootstrap, preferiamo il design del materiale. Ma bootstrap ha alcune direttive che non sono disponibili nel materiale. Pertanto, ovunque non sia possibile utilizzare la progettazione del materiale, utilizzare il bootstrap e viceversa. Non vi è alcun problema di conflitto almeno per quanto ne so. –

risposta

4

È preferibile non combinare Bootstrap e Angular Material perché il sistema di griglia del bootstrap (a partire dalla versione 3 ~) si basa sulla tabella di visualizzazione CSS e il materiale angolare utilizza il display flex. Pertanto, come suggerito in questo answer, è probabile che si verifichino conflitti CSS e la dimensione della tua applicazione aumenterà.

Se è necessario un supporto browser migliore e si sta utilizzando Bootstrap, ho scritto Angular Bootstrap Material che è una versione AngularJS di Bootstrap material design theme. Elimina la dipendenza da jQuery e JavaScript di bootstrap e supporta la convalida del modulo utilizzando ng-messages.

È possibile installare da pergola via bower install abm.

Problemi correlati