Qualcuno può piacere chiarire me su come il nuovo modello di layout Flexbox è meglio delle attuali tabelle modo? (Display : tabella e tutti quelli inclusi nella mia custodia)?flexbox vs tabelle, perché abbiamo bisogno di flexbox?
Non è supportato affatto in IE10 che non è molto buono per il prossimo futuro e non vedo alcun vantaggio sul layout della tabella. Ma ancora, Internet sta iniziando ad essere pieno di "adoratori" di questo nuovo metodo di layout CSS, e tutti gli esempi che vedo possono essere facilmente fatti con normali css senza problemi.
Aggiornamento 25.12.15:
ho utilizzato flexboxes molto da quando sono stati introdotti i browser moderni e aveva smesso di usare display:table e così via, perché flexboxes sono più potenti e facili da usare.
Non ho mai sentito parlare della modella prima, ma a una rapida occhiata, questo sembra fantastico - sembra finalmente fornire un modo semanticamente pulito per fare tutto il materiale di layout che era possibile solo con le tabelle (allineare gli elementi in un griglia in alto/centro/in basso, con un gruppo di elementi estesi dinamicamente) ma senza '
'dispay: table' non è affatto folle secondo me ed è molto elegante. descrive un elemento come una tabella e quindi puoi controllare i suoi figli come preferisci, e la parte semantica è sempre tua, flexbox non è HTML, è solo css. – vsync
'display: table' è ancora connesso al concetto di tabelle, che probabilmente non è semanticamente corretto quando si costruisce un layout. Flexbox sembra finalmente rompere con quello, e aggiungendo ulteriori modi per controllare il layout. Stavo aspettando qualcosa di simile (ma ovviamente non è ancora pronto per il mercato di massa se usato da solo ... e non ha senso usarlo in combinazione con 'display: table', dato che è supportato da tutti i browser) –
risposta
Ci sono tre distinzioni posso pensare tra l'utilizzo FlexBox e con valori di visualizzazione tabella o galleggia layout di una pagina:
order.flex-groweflex-shrink.Il problema (come hai sottolineato) è che il supporto è ancora piuttosto brutto; Infatti, Firefox sta ancora implementando una versione precedente del modulo flexbox, quindi devi tenere conto di piccole discrepanze nella sintassi e nel comportamento, a seconda del browser che stai utilizzando. È stato detto abbastanza, tuttavia, che lo è il il futuro per i layout, specialmente per le applicazioni web complesse che spuntano più spesso. Vale la pena imparare se stai bene con un investimento inevitabilmente saggio, al costo di non essere realmente utilizzabile in questo momento.
anche io suggerisco di dare un'occhiata a this smashing magazine article per una semplice introduzione al FlexBox (è scritto poco tempo fa)
fonte
2013-08-24 14:40:15 Transparent
http://learnlayout.com/flexbox.html Ora Firefox è abbastanza carino. Anche senza prefisso. – vsync
In poche parole, è qualcosa che sarà utile in pochi anni. Come molte tecniche avanzate di CSS, HTML5, ecc., Alcune persone le adotteranno con dolorosi fallimenti e shim/shiv per i prossimi due anni.
Quando i browser lo supportano in futuro, avremo una festa e tutto l'odio per i "vecchi" browser che non li supportano :).
fonte
2013-08-24 13:35:03 yochannah
ma posso probabilmente fare tutto ciò che si può pensare con il CSS corrente, non vedo come la Flexbox cambi qualcosa – vsync
@vsync: Probabilmente è possibile ottenere la maggior parte dei risultati senza flexbox, ma in alcuni casi solo se si regola anche il tuo DOM. –
@ DanielA.R.Werner. Sì, l'ho scritto anni fa quando la flexbox era lontana dall'essere stabile e "chiusa". da allora l'ho usato ampiamente – vsync
Il modello Flexbox è più potente di tabella di visualizzazione. Flexbox supporta i layout per le lingue da destra a sinistra, ad esempio. E sì, la flexbox è un po 'complessa e questa è una barriera di accesso. I layout float e clearfix sono un hack (intelligente), in qualche modo nello stesso modo in cui i layout di tabella sono un hack, il flexbox è pensato per il layout.
Il supporto del browser sta migliorando di recente, alcuni dicono che dovremmo use it now.Bootstrap 3 tuttavia non fa uso di flexbox, ma posso immaginare che la prossima versione lo farà.
fonte
2013-10-20 14:04:28
è un "hack" se lo vedi in questo modo, non vedo 'display: table' come un hack, ma come un modo per organizzare le informazioni sulla pagina. e i float possono essere complessi come qualsiasi altra cosa, dipende dall'implementazione. E personalmente, non credo che questo Bootstrap sia stato realizzato da persone di grande talento, solo perché Keanu Reeves è famoso non lo rende un buon attore. Pensaci .. – vsync
scusa, con i layout di tabella mi riferivo a questa tecnica di layout di vecchia scuola usando i 'reali'
ho well tables ARE per tavoli, non per layout :) – vsync
Problemi correlati