Quando utilizzare il margine vs imbottitura in CSS
Questo post descrive:
- Quando utilizzare "imbottitura" contro "margine" in CSS?
- Come utilizzare il "margine" in CSS?
- Come utilizzare "imbottitura" in CSS?
Quando utilizzare "imbottitura" contro "margine" in CSS?
CSS "margine" E "imbottitura"Le proprietà vengono utilizzate per progettare l'interfaccia. Sono anche utilizzati per specificare il divario extra o lo spazio tra gli elementi. Tuttavia, queste due proprietà differiscono l'una dall'altra in termini di funzionalità.
Qui spiegheremo alcune distinzioni tra le due proprietà:
| margine | imbottitura |
|---|---|
| Il margine offre spazio al di fuori dell'elemento. | L'imbottitura offre spazio all'interno del contenuto dell'elemento. |
| Possiamo impostare un margine di elemento come "auto"Per impostare automaticamente il margine attorno all'elemento. | L'imbottitura non può essere impostata come auto. L'utente deve specificare i valori per impostare lo spazio all'interno dell'elemento. |
| Il margine non ha influenzato lo stile di un elemento. | Quando applichiamo il colore di sfondo all'elemento, influenzerà lo stile di un elemento. |
| Possiamo impostare valori positivi e negativi come margini. | L'imbottitura supporta solo valori positivi. |
Come utilizzare il "margine" in CSS?
Per utilizzare il "margine"Proprietà, prima, crea un""Container e assegnare la classe. Ad esempio, abbiamo assegnato la classe denominata come "Linuxhint". Quindi, incorporare un po 'di testo in un tag di paragrafo " Linuxhint è uno dei migliori siti Web di tutorial Il risultato del codice sopra indicato è menzionato di seguito: Ora crea un altro ""Container che ha la classe"margin-div"E applicare il"stile"Attributo come"Bordo: 1px Black solido". Dopodiché, aggiungi un po 'di testo in " Linuxhint è uno dei migliori siti Web di tutorial. Produzione Ora, applica la proprietà "margine" su ".Classe di margin-div ": Nel codice sopra, il ".margin-div"È utilizzato per l'accesso all'elemento Div per applicare le proprietà sotto l'elenco: Qui, puoi vedere che abbiamo impostato correttamente "margine"Proprietà sul secondo"div"Elemento: Come utilizzare "imbottitura" in CSS? Per utilizzare la proprietà "imbottitura", sono stati utilizzati gli esempi sopra indicati. Nel secondo "div"Container, usa la classe"imbottitura-div"Per applicare l'imbottitura: Linuxhint è uno dei migliori siti Web di tutorial Linuxhint è uno dei migliori siti Web di tutorial. Produzione Per applicare l'imbottitura e altre proprietà CSS su ".imbottitura-div"Classe, dai un'occhiata al codice fornito: Nel codice sopra menzionato, abbiamo accesso al secondo "div"Elemento usando la classe".imbottitura-div". Abbiamo impostato il "colore di sfondo" e "dimensioni dei caratteri". Inoltre, il "imbottitura"La proprietà viene utilizzata per aggiungere spazio attorno al contenuto dell'elemento da ciascun lato come"50px". Produzione Abbiamo spiegato le differenze e gli usi di "imbottitura" e "margine" in CSS. Conclusione Il CSS "margine"Viene utilizzato per impostare la spaziatura attorno all'elemento, mentre"imbottitura"Viene utilizzato per aggiungere spaziatura attorno al contenuto dell'elemento. Per applicare la proprietà del margine o dell'imbottitura, in primo luogo, creare un "div"Container e specificare la classe. Successivamente, accedi alla classe per nome e applica il “margine" E "imbottitura" proprietà. Questo post ha spiegato l'uso del margine vs imbottitura in CSS.
Background-color: RGB (199, 238, 205);
Font-Size: Medium;
Bordo: 3px RGB (114, 250, 114);
Margine: 100px 100px 100px 100px;
Background-color: RGB (199, 238, 205);
Font-Size: Medium;
imbottitura: 50px 50px 50px 50px;