creare codice divertendosi
La proprietà order permette di decidere l’ordine di allineamento degli elementi, cioè l’ordine in cui viene mostrato un box contenitore rispetto agli altri definiti nello stesso contenitore padre. Order possibili valori Si specifica dunque un valore numerico che indica l’ordine di apparizione, cioè l’elemento che deve essere visualizzato per primo. Se ci sono dunque 3 […]
La proprietà align self consente di specificare per un singolo box l’allineamento sull’asse perpendicolare, cioè sull’asse y. In definitiva questa proprietà sostituisce l’allineamento impostato dalla proprietà align-items impostato nel contenitore genitore, se presente. Align self valori possibili Questa proprietà consente dunque di impostare i seguenti valori: flex-start, flex-end, center, baseline, auto e stretch. Align self […]
La proprietà flex dei CSS consente di compattare le regole precedentemente studiate: flex-grow, flex-shrink e flex-basis in un unico comando. Flex CSS esempio Spieghiamo dunque meglio questa proprietà con un semplice esempio. In questo esempio abbiamo inserito una certo numero di di box e abbiamo assegnato a due di essi le proprietà flex. In particolare […]
La proprietà flex basis consente di impostare le dimensioni in lunghezza di un box. Nel caso in cui è impostato flex-direction:row, oppure se non è specificato nulla, la lunghezza si riferisce alla larghezza (width), altrimenti se flex-direction:column allora la lunghezza si riferisce all’altezza (height). flex basis valori possibili Quindi si possono indicare, come valori possibili, […]
La proprietà flex shrink consente di impostare il fattore di riduzione, cioè rende semplicemente più piccolo un box contenitore rispetto ad un altro o ad altri presenti nel contenitore padre. Flex shrink valori possibili Così come per la proprietà precedente flex grow, anche in questo caso si possono indicare dei valori numerici che determinano il […]
La proprietà flex grow consente di impostare il fattore di ingrandimento , cioè rende semplicemente più grande un box contenitore rispetto ad un altro nel contenitore padre. Flex grow valori possibili Questa proprietà ammette un valore numerico che dunque determina l’ingrandimento del box che segue questa regola. Se tutti gli elementi hanno ad esempio la […]
La proprietà align content serve, come già detto, per allineare i contenitori multi-riga. In particolare ha la funzione di allineare i box flessibili sull’asse perpendicolare del contenitore, cioè l’asse y. Questa proprietà, come le altre viste nelle precedenti lezioni, deve essere utilizzata assieme alla proprietà display:flex, che come già detto serve a rendere il contenitore […]
La proprietà z-index nei CSS specifica la posizione dell’elemento, il quale può essere posizionato avanti o dietro ad un altro elemento. Questa proprietà è molto utilizzata nello sviluppo dei vari layout, soprattutto quanto occorre scrivere su di una immagine oppure posizionare un elemento contenitore davanti o dietro ad un altro. z-index CSS valori possibili: valori […]
La proprietà position CSS specifica il metodo utilizzato per il posizionamento di un elemento. Rappresenta una delle proprietà dei CSS più utilizzate per gestire il posizionamento degli elementi di una pagina web. Position CSS valori possibili I valori possibili che si possono indicare nella proprietà position sono: static: con questo valore gli elementi sono posizionati […]
La proprietà overflow dei CSS controlla i contenuti che eccedono un’area e permettono di adattarsi all’elemento contenitore. Overflow CSS valori possibili I valori possibili per overflow sono: scroll – Impostando questo valore si aggiunge una barra di scorrimento. Se il contenuto non eccede l’elemento contenitore comunque si visualizza il box per le caselle di scorrimento. […]