Sono confuso con angular material design e material css. Perché entrambi hanno layout e griglie diversi? Qual è l'equivalente per il contenitore bootstrap in angular material design?sistema di griglia per materiale angolare
Devo usare angular material design per il mio progetto confrontando con bootstrap?
Il motivo principale per andare con Angular Material è perché si basa sulla specifica Flexible Box Layout, che è uno standard W3C Flexible Box.
Il tag più vicino per il contenitore bootstrap potrebbe essere: <div layout="row" layout-wrap></div>
Materialise è un moderno framework responsiveCSS basato su Material Design di Google.
E
Bootstrap è il più popolare HTML, CSS e JavaScript framework per lo sviluppo di reattivi, mobili-primi siti web.
Quindi, se vuoi un nuovo design moderno, penso che dovresti andare con il material design. Ha anche un'animazione molto bella.
Qual è l'equivalente per il contenitore bootstrap nella progettazione di materiali angolari. Posso usare materializzare css con direttive angolari. Funzionerà come previsto. –
Penso che dovresti usare questo: https://material.angularjs.org. – Yogesh
sì, l'ho attraversato e mi sono confuso. Sto cercando la risposta di ciò che è l'equivalente per il contenitore nel bootstrap in modo che gli oggetti siano disposti perfettamente al centro –
angolare Materiale design non ha un esatto equivalente a un contenitore di Bootstrap perché Material Design (AMD) è più flessibile. Un contenitore ha 8 sezioni. AMD ha gli attributi di layout e flex. La flessibilità di AMD può aumentare del 5% (20 sezioni in BS) o 33 e 66 (2 sezioni) o di combinazioni del 5%, 33% e 66%, che possono andare a più del 100% (la maggior parte di qualsiasi numero di sezioni) nel qual caso vengono create automaticamente più linee. La migliore pagina singola con esempi che ho trovato finora è https://material.angularjs.org/#/layout/grid Fai clic sulla casella Origine sopra ogni esempio per ottenere ulteriori informazioni sulla sintassi HTML di AMD per layout e flex.
Hai un'ulteriore flessibilità tramite Allineamento figlio, che controlla la spaziatura tra ogni div in orizzontale e verticale. Fare clic sui pulsanti di opzione su quella pagina per vedere come i div sono centrati, sparsi o spinti a un'estremità o sollevati verso l'alto, ecc.
La sintassi HTML visualizzata funzionerà su una pagina di dimensioni fisse. Se si desidera che l'equivalente di media-query modifichi le dimensioni per dispositivi diversi, è necessario eseguire ulteriori operazioni di codifica per rendere i controller angolari. Guarda gli esempi DEMOS per i vari componenti per avere un'idea.
Griglia di materiale angolare> Griglia di bootstrap, in particolare per applicazioni angolari. La griglia Bootstrap utilizza float, che è obsoleto rispetto al modello di box flessibile. float ha sostituito gli orrendi layout di tabella, ma ora il modello di box flessibile sta iniziando a spingere da parte float (per i layout di griglia). Tieni presente che è necessario aggiungere determinati suffissi nel CSS per i browser meno recenti. Vedere this CSS Tricks article per un esempio di come implementare flex per i browser meno recenti. Le applicazioni di griglia di bootstrap richiedono anche di creare una quantità infinita di div, che sembra terribile e dovrebbe essere evitata in qualsiasi applicazione che usi HTML5. Tecnicamente, potresti scrivere le tue direttive Angular in sostituzione di alcuni div e raggrupparli in base a cosa o come vengono visualizzati, ma perché non usare solo materiale angolare quando lo hanno già fatto?
Stavo cercando una risposta per la stessa domanda. Vedo alcuni ottimi commenti qui. Poche aggiunte a dicembre 2016: Bootstrap ha ora il supporto Flexbox. Controllare questo link anche controllare questo link per fare in modo che bootstrap usi Flexbox di default semplicemente cambiando un flag o scarichi bootstrap-flex.css.Per quanto riguarda il supporto di rete nel materiale, utilizzare una demo di griglia here, c'è un motore di layout flessibile del materiale che sembra ottimo (non l'ho ancora provato). È molto vicino alla griglia di bootstrap. Controlla questo link.
Alaksandar, sei ancora confuso, o hai abbastanza informazioni per scegliere una risposta. Se hai informazioni utili, ringrazia qualcuno con una selezione. –