blob: bbdee7472ea3c9332ea5a3e9722d23b45b8c0318 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
|
---
title: Ricette per layout in CSS
slug: Web/CSS/Ricette_layout
translation_of: Web/CSS/Layout_cookbook
---
<div>{{CSSRef}}</div>
<p class="summary">Lo scopo del ricettario per layout in CSS è quello di raccogliere schemi per layouts utili per le tue pagine. In aggiunta a ricevere codice per iniziare i propri progetti, queste ricette sottolineano le differenti modalità e decisioni nel design di layouts messe a disposizione per sviluppatori.</p>
<div class="note">
<p><strong>Nota</strong>: Se sei nuovo a sviluppare layouts in CSS consigliamo dare un ochhiata al nostro <a href="/en-US/docs/Learn/CSS/CSS_layout">CSS layout learning module</a>, che darà le basi per fare pieno uso delle seguenti ricette.</p>
</div>
<h2 id="Le_Ricette">Le Ricette</h2>
<table class="standard-table">
<thead>
<tr>
<th scope="col">Ricetta</th>
<th scope="col">Descrizione</th>
<th scope="col">Metodi di layout</th>
</tr>
</thead>
<tbody>
<tr>
<td><a href="/en-US/docs/Web/CSS/Layout_cookbook/Media_objects">Oggetti media</a></td>
<td>Una scatola con due colonne avente un immagine su un lato e del testo descrittivo nell'altro, p.es: un post su facebook o un tweet.</td>
<td><a href="/en-US/docs/Web/CSS/CSS_Grid_Layout">CSS Grid</a>, {{cssxref("float")}} fallback, {{cssxref("fit-content")}} sizing</td>
</tr>
<tr>
<td><a href="/en-US/docs/Web/CSS/Layout_cookbook/Column_layouts">Colonne</a></td>
<td>Quando scegliere un layout a più colonne, un flexbox o una griglia per le colonne</td>
<td><a href="/en-US/docs/Web/CSS/CSS_Grid_Layout">CSS Grid</a>, <a href="/en-US/docs/Web/CSS/CSS_Columns">Multicol</a>, <a href="/en-US/docs/Web/CSS/CSS_Flexible_Box_Layout">Flexbox</a></td>
</tr>
<tr>
<td><a href="/en-US/docs/Web/CSS/Layout_cookbook/Center_an_element">Centrare un elemento</a></td>
<td>Come centrare un oggetto orizzontalmente e verticalmente</td>
<td><a href="/en-US/docs/Web/CSS/CSS_Flexible_Box_Layout">Flexbox</a>, <a href="/en-US/docs/Web/CSS/CSS_Box_Alignment">Box Alignment</a></td>
</tr>
<tr>
<td><a href="/en-US/docs/Web/CSS/Layout_cookbook/Sticky_footers">Note a piè di pagina appiccicose</a></td>
<td>Creare una nota a piè di pagina che sta alla fine del container o del punto di vista attuale quando il contenuto è più corto. </td>
<td><a href="/en-US/docs/Web/CSS/CSS_Grid_Layout">CSS Grid</a>, <a href="/en-US/docs/Web/CSS/CSS_Flexible_Box_Layout">Flexbox</a></td>
</tr>
<tr>
<td><a href="/en-US/docs/Web/CSS/Layout_cookbook/Split_Navigation">Navigazione divisa</a></td>
<td>Uno schema nel quale alcuni link sono visualmente separati da altri.</td>
<td><a href="/en-US/docs/Web/CSS/CSS_Flexible_Box_Layout">Flexbox</a>, {{cssxref("margin")}}</td>
</tr>
<tr>
<td><a href="/en-US/docs/Web/CSS/Layout_cookbook/Breadcrumb_Navigation">Navigazione a briciole</a></td>
<td>Creare una lista di links che perrmette il visitatore di navigare inditro nella gerarchia della pagina.</td>
<td><a href="/en-US/docs/Web/CSS/CSS_Flexible_Box_Layout">Flexbox</a></td>
</tr>
</tbody>
</table>
<h2 id="Contribuire_al_ricettario">Contribuire al ricettario</h2>
<p>Come con tutto il MDM ci piacerebbe se contribuisci ricette nello stesso formato a quelle mostrate sopra. <a href="/en-US/docs/user:chrisdavidmills/Layout_Cookbook_Home/Contribute_a_recipe">Guarda questa pagina</a> per trovare un template e delle linee guida per scrivere il tuo esempio.</p>
|
