Aggiungere facilmente un bordo con l'opzione del bordo della colonna
Grazie agli strumenti di creazione di siti internet di e mio web, puoi mettere in un riquadro un testo, un paragrafo o anche un'immagine in modo molto semplice. Ti basta usare l'opzione del bordo su una colonna del tuo contenuto.
Modifica una pagina del tuo sito. Clicca poi sulle opzioni della colonna e seleziona l'opzione del bordo:
Potrai personalizzare il colore del bordo o dello sfondo dal manager, in Configurazione > Aspetto.
Aggiungere un bordo a un elemento del sito in HTML/CSS
È possibile creare delle cornici anche con HTML e CSS.
Questo testo è in un riquadro.
Ci sono 2 metodi possibili, usando:
- codice HTML e il foglio di stile CSS del tuo sito
- elementi HTML e CSS in linea
Usando codice HTML e il foglio di stile CSS del tuo sito
Per farlo bisogna passare dall'editor visuale all'editor HTML e aggiungere una classe CSS al paragrafo o al pezzo di testo da incorniciare (in quel caso dentro un tag span). In CSS bisogna definire 3 caratteristiche del bordo: lo spessore, lo stile e il colore. Aggiungi anche un margine interno perché il testo non sia attaccato al bordo.
Ecco il codice usato in HTML:
<span class="encadrer-un-contenu">Questo testo è in un riquadro.</span> Ed ecco gli stili CSS applicati alla classe encadrer-un-contenu:
.encadrer-un-contenu{ border: 1px solid black; padding: 5px; } Le regole CSS vanno applicate in Configurazione > Aspetto restando in modalità semplice, nel modulo in fondo alla pagina dedicato al codice CSS del tema, riservato agli utenti esperti.
Il CSS offre molte possibilità per personalizzare i bordi (arrotondati, tratteggiati, a doppia linea, ecc.).
Usando elementi HTML e CSS in linea
Per incorniciare un testo in HTML, passa dall'editor visuale all'editor HTML e usa il tag <p> (paragrafo). Questo tag definisce un paragrafo di testo e permette di applicare stili al contenuto che racchiude. Per esempio:
<p style="border: 1px solid black; padding: 10px;" >Questo testo sarà incorniciato grazie al tag <p> e agli stili CSS definiti.</p>Questo codice mostrerà un paragrafo di testo con un bordo nero e una spaziatura interna di 10 pixel. Esistono anche altri tag che possono servire a incorniciare un testo, come <div> (divisione), <blockquote> (citazione in blocco) o <pre> (testo preformattato). Ognuno ha un significato proprio e va usato in modo appropriato in base alla struttura e all'aspetto desiderati per il tuo contenuto.
Commenti