Uno dei modi più semplici per evidenziare una parola o una frase nel testo è utilizzare caratteri diversi. Quindi puoi sottolineare una parola o una frase, l'utilizzo di pagine in grassetto ti consente di evidenziare facilmente le parole utilizzando stili diversi: corsivo, sottolineato, grassetto.
Il grassetto come modo per evidenziare la cosa principale
Le parole più sorprendenti e accattivanti appaiono evidenziate in grassetto. Tali parole e frasi catturano immediatamente l'attenzione. Quindi, per imparare a selezionare rapidamente i posti necessari nel testo, dovresti ricordare lo speciale codice HTML. Il grassetto viene impostato utilizzando un tag associato.
Prima di una parola o frase, una frase che dovrebbe essere evidenziata, viene posizionato un tag di apertura ... Dopo l'ultima lettera del testo da selezionare, c'è un tag di chiusura... Qualsiasi cosa tra questi due tag è in grassetto quando viene visualizzata in un browser.
Altre opzioni di selezione
Quindi, abbiamo scoperto che puoi selezionare il testo usando uno stile diverso. Abbiamo stabilito che il modo più semplice e allo stesso tempo efficace è utilizzare l'HTML in grassetto. Ora parliamo di altre opzioni di selezione.
Quindi, puoi evidenziare il testo in corsivo usando il tag associato , sottolinealo con ... Questi sono i modi più semplici per selezionare il testo.
Esistono anche tag meno conosciuti e utilizzati che possono essere utilizzati per evidenziare parole e frasi nel testo. Quindi, per cancellare il testo, è sufficiente usare ... Un tag abbinato aiuterà a rendere il testo monospazio. ... Se hai bisogno di creare apice usa , parte inferiore - .
In questo caso, come prima, il testo che ti serve deve trovarsi tra i tag di apertura e chiusura. Come puoi vedere, non c'è nulla di difficile, l'importante è ricordare questi codici o scriverli.
Utilizzo di più caratteri
Se vuoi rendere il testo più espressivo, puoi usare qualcosa di più del semplice grassetto. Il markup HTML ti consente di evidenziare contemporaneamente una parola utilizzando più facce. Quindi, puoi rendere una parola in grassetto, barrata e in corsivo allo stesso tempo.
Allo stesso tempo, è necessario ricordare una cosa: tutti i tag devono essere chiusi in sequenza. Ad esempio, la voce corretta potrebbe essere:
- il testo selezionato.
Se chiudi i tag in un ordine diverso, il testo non verrà evidenziato correttamente. Un esempio di inserimento errato:
- il testo selezionato.
In questo caso, il browser si confonderà e non capirà esattamente cosa vuoi da esso.
A proposito, qui si può notare che le tre varianti dello stile - grassetto, sottolineato e corsivo - sono facili da ricordare se conosci i tasti di scelta rapida in Word. Lì, lo stile viene impostato utilizzando gli stessi tasti delle lettere mentre si tiene premuto Ctrl.
Come puoi vedere, puoi usare più del corsivo o del grassetto. Il markup HTML ti consente di evidenziare le parole con la stessa facilità di Word normale.
conclusioni
Per evidenziare il testo, sono ampiamente utilizzati non solo una varietà di colori e sfumature, diverse dimensioni e tipo di carattere, ma anche il suo stile. Inoltre, è con l'aiuto di un contorno diverso che l'uno o l'altro frammento del testo può essere facilmente e facilmente distinguibile.
Per cambiare lo stile del carattere, dovresti usare qualsiasi tag che conosci. Il carattere in grassetto di una pagina HTML è il più sorprendente e visibile, e quindi viene utilizzato più spesso per dare enfasi.
In HTML, il testo in grassetto può essere eseguito in diversi modi. Questi includono:
- Etichetta B;
- Etichetta forte;
- Proprietà CSS carattere-peso.
Parliamo di ciascuna delle opzioni per selezionare il testo in ordine.
Testo in grassetto: tag
Etichetta B L'HTML viene applicato in questo modo:
Costruttore di siti web "Nubex"
Per tag ci deve essere una chiusura, e gli attributi universali sono a sua disposizione (come classe, id, titolo eccetera.)
Nonostante la validità del tag B e non è deprecato dalla specifica HTML, più rilevante da usare è il tag forte, vediamo perché.
Testo in grassetto: tag
Secondo le specifiche HTML, il tag B serve per evidenziare il testo in grassetto. Al contrario, il tag forte HTML è per evidenziare importante cornici, parole chiave di questa pagina.
Questo tag svolge un ruolo significativo nel posizionamento delle pagine nei risultati di ricerca, quindi è ampiamente utilizzato nella promozione del sito Web e nell'ottimizzazione SEO. I motori di ricerca tengono conto del testo racchiuso tra tag e contrassegnalo come importante.
Tag usato forte allo stesso modo:
Costruttore di siti web "Nubex"
Potresti notare che usando i tag esternamente e non è affatto diverso (dal momento che tutti i browser moderni li interpretano quasi allo stesso modo), ma esistono differenze semantiche nel codice per i motori di ricerca. Pertanto, la maggior parte dei SEO consiglia di utilizzare il tag forte.
Testo in grassetto con CSS
Abbiamo già notato l'importanza del tag forte nell'ottimizzazione per i motori di ricerca, ma cosa fare se è necessario rendere in grassetto una grande quantità di testo (ma il testo non ha bisogno di essere contrassegnato come importante per i motori di ricerca), o se è necessario controllare il grado di "audacia" di il carattere? In tali casi, viene utilizzata la proprietà CSS. carattere-peso... Si applica come segue:
I nostri siti sono, infatti, passo enorme nello sviluppo web.
Lo facciamo per davvero qualità siti.
Fidati di noi e noi lo faremo Non ti deluderemo.
I valori più audace e accendino puoi impostare il grado di grassezza maggiore (o minore) di quello del genitore. Un valore numerico (100-900) può impostare il grado di contenuto di grassi.
Ci sono tre modi per rendere il testo in grassetto su una pagina HTML, ma non affrettarti a usarne uno che ti piace subito, poiché tale evidenziazione può avere significati diversi e influenzare l'ottimizzazione del sito per il motore di ricerca.
Grassetto con tag forte
Questo metodo è adatto se vuoi evidenziare una parte importante del testo in grassetto. Il tag HTML è un tag di formattazione logico e la sua essenza: "sottolinea" l'importanza della selezione.
Ci sono altri tag di formattazione booleani in HTML. Ad esempio, un tag rende il testo in corsivo e indica l'enfasi sulla frase evidenziata.
Altri tipi di selezione del testo sono descritti nell'articolo:.
Testo normale evidenziato pezzo di testo importante... Testo normale.
Testo in grassetto utilizzando il tag b
Testo normale testo grassetto... Testo normale.
CSS in grassetto
Il testo in grassetto può essere creato non solo con speciali tag HTML. È possibile ottenere l'output in grassetto su qualsiasi tag impostando la proprietà font-weight su di esso: bold; (non funziona per tutti i caratteri).
Tale selezione sarà di natura stilistica, senza aggiungere peso logico al testo selezionato.
Inoltre, puoi selezionare un tag specifico o un gruppo di elementi contemporaneamente specificando gli stili tramite una classe CSS.
Proprietà CSS all'interno dell'attributo style:
Testo grassetto.
Testo grassetto.
Il testo è in caratteri regolari.
Testo grassetto.
Cosa fare se non riesci a rendere il testo in grassetto
Se non riesci a rendere il testo in grassetto, molto probabilmente il tuo sito ha sovrascritto gli stili degli elementi CSS. In questo caso, dovrai regolare questi stili. Nella maggior parte dei casi, questo può essere fatto tramite il file del foglio di stile CSS principale. Se non lo capisci, contatta il webmaster. Molto probabilmente, la risoluzione di questo problema non richiederà più di 5 minuti di lavoro (anche se, ovviamente, potrebbero esserci delle eccezioni).
Ciao cari lettori del blog! Questo articolo si concentrerà su tag di formattazione del testo... Il testo in grassetto o in corsivo è un ottimo esempio. Considereremo anche l'influenza di alcuni tag sull'ottimizzazione interna del sito e le regole per la loro scrittura. Puoi leggerlo nell'articolo dato. A proposito, puoi trovare elementi di design del testo simili in molti editor di testo, ad esempio in Word.
I tag sono divisi in 2 tipi: tag di blocco e tag in linea. Quando si utilizza il primo, è possibile modificare il contenuto di una parte del testo (righe, singoli frammenti o parole), mentre i secondi lo sono. I tag di formattazione che esamineremo in questo articolo sono prevalentemente minuscoli.
Regole e ordine di scrittura dei tag
Sai già cosa sono i tag di inizio e fine. In caso contrario, leggi l'articolo all'inizio di questo materiale. In breve, ci sono due tipi di tag: tag singoli (ad esempio, il ritorno a capo su una nuova riga) e contenitore (accoppiato). Quindi, tutti i tag di formattazione del testo sono accoppiato... Ciò significa che ogni elemento ha un tag di inizio e di fine e la selezione deve essere posizionata tra di essi. Ad esempio, la selezione corretta di una frase sarebbe simile a questa: Frammento selezionato
Quando il browser elabora questo frammento, vedrai il seguente testo: Frammento selezionato. A proposito, tutti i tag non vengono visualizzati nel feed RSS ().
La cosa principale quando si scrivono i tag è tenerli chiusi. In caso contrario, tutto il testo sulla pagina sarà in grassetto (nell'esempio con il tag ). Ma ci sono momenti in cui è necessario evidenziare un determinato frammento in grassetto e corsivo allo stesso tempo. Ma non c'è nessun tag che esegua questa azione. C'è solo una via d'uscita da questa situazione: utilizzare due tag contemporaneamente. Non importa in che ordine li usi. Pertanto, scrivendo il testo con tag come questo:
Frammento selezionato
o così:
Frammento selezionato
Avrai ancora Frammento selezionato in corsivo e grassetto allo stesso tempo. Tuttavia, è preferibile utilizzare la prima opzione, perché inizialmente era l'unica e corretta. Inoltre, non dimenticare che ogni browser può gestire i tag in modo diverso (), a seconda delle impostazioni. Passiamo ora ai tag di formattazione stessi.
Testo in grassetto e corsivo - Tag , , e
Tag di formattazione del testo più popolari - Enfatizzarlo grassetto e in corsivo... Di solito sono usati per dare importanza a un pezzo. Il primo caso serve per evidenziare un frammento contenente informazioni utili o parole chiave. Il corsivo viene utilizzato per gli stessi scopi del testo in grassetto, ma l'informazione è meno importante perché il corsivo è meno visibile sullo sfondo del corpo del testo rispetto al testo in grassetto.Considera prima testo grassetto... Ci sono due tag usati per questa azione: e ... Non c'è differenza nell'aspetto. Tuttavia, dato che qualsiasi browser può interpretare ogni elemento in modo diverso, potresti essere in grado di vedere eventuali differenze. Ecco come appare il testo nei tag e nel modulo già elaborato dal browser:
Testo in tag forti
Testo nei tag b
Ed ecco come appaiono queste due righe nel codice sorgente della pagina:
Testo in tag forti Testo nei tag b
Possiamo osservare la stessa situazione nel caso di tag in corsivo e ... Prova a trovare le differenze tra i due esempi:
Testo nei tag em
Testo nei tag I
Ed ecco il codice sorgente:
Testo nei tag em Testo nei tag I
Quindi, i tag considerati in grassetto e in corsivo non differiscono in realtà, ma perché allora abbiamo bisogno, ad esempio, del tag se c'è ? Dopotutto, quest'ultimo contiene un solo carattere (senza contare le parentesi) e, quindi, è più facile da scrivere. Il fatto è che i tag e intaccare. Se racchiudi le parole chiave con questi tag, avrà un effetto benefico sulla promozione del sito Web. La cosa principale è non esagerare: il testo massimo dovrebbe essere il 5% di testo in grassetto nel tag. , e la stessa quantità di corsivo nel tag .
Se vuoi solo evidenziare qualche momento nel testo, usa il tag o ... In generale, penso che anche i motori di ricerca considerino più importante il testo in questi tag, ma su ottimizzazione interna hanno ancora un impatto minore di e .
Slash tag di testo - , e
Ora diamo un'occhiata ad alcuni tag che utilizzano un tratto nello stile del testo. L'editor di testo più famoso che conosci è etichetta
o sottolineare. Questo tag non influisce sulla classifica (per quanto ne so), ma aiuterà a evidenziare del testo ea concentrarsi su di esso. Ho fornito un esempio dell'utilizzo di questo tag appena sopra. Ci sono altri due tag che hanno uno scopo simile: e ... Entrambi hanno la funzione di testo barrato. Puoi usare questo tag in qualsiasi situazione: se aggiorni un documento (o meglio una parte di esso), puoi cancellare quello vecchio e aggiungerne uno nuovo; se hai intenzione di scrivere qualcosa che si discosta dall'argomento del materiale; qualcosa che non corrisponde a standard morali ed etici.
Le differenze tra questi due tag sono solo nel loro scrivere, per cui è preferibile utilizzare il primo, poiché in primo luogo, è più comodo scrivere e, in secondo luogo, ci sarà meno codice HTML sulla tua pagina e i motori di ricerca lo adorano.
Etichetta e attributi - parametri del carattere del testo
Ora, considera un tag che non viene utilizzato senza attributi. Con esso, puoi impostare i parametri per una parte di testo specifica. In generale, ora è preferibile utilizzare (fogli di stile a cascata) perché possono accorciare notevolmente l'intero codice HTML della pagina. Quindi, diamo un'occhiata allo stesso tag . Per lui c'è tutto tre attributi:
- faccia- il carattere stesso. Ad esempio, Arial, Courier o Verdana. Puoi elencarne alcuni, tk. non tutti gli utenti dispongono di un ampio set di font, e scrivendone alcuni nell'attributo face il browser potrà scegliere quale utilizzare, ovvero quale è presente nel sistema;
- dimensione- un attributo che indica la dimensione del testo. Può essere espresso sia in unità arbitrarie che in pixel;
- colore- colore del testo. Questo attributo può essere utilizzato sia nei codici HTML dei colori che nelle parole. I primi sono della forma #FFFFFF (dove F è qualsiasi numero o lettera da A a F), e i secondi sono scritti in parole semplici (ad esempio, il rosso è rosso).
Ecco come appare il testo nel tag utilizzando ciascun attributo:
Questo testo ha una dimensione di 6px
Questo testo è rosso Questo testo è in carattere Arial Questo testo è rosso e ha una dimensione di 5 pixelEd ecco cosa vedrai dopo aver elaborato il codice scritto:
Elementi di design del testo a blocchi - intestazioni -, paragrafo
, paragrafo
Infine, esamineremo gli elementi di blocco utilizzati in quasi tutti i documenti. Questi sono i tag di intestazione e paragrafo. Consideriamo il primo. Ci sono 6 tipi di titoli e ognuno ha il proprio tag. Ogni specie ha solo il proprio numero di serie ed è registrata tramite tag
, ,..., ... Ecco come appaiono tutte le intestazioni una volta elaborate:
... Ecco come appaiono tutte le intestazioni una volta elaborate:
Il numero dopo il titolo della parola corrisponde al numero nel tag
Ora parliamo del tag di evidenziazione del paragrafo.
La funzione di questo tag è di separare il testo da un altro testo simile con una riga vuota. Se guardi il codice sorgente di un documento, puoi vedere quanto segue:
Le caselle verdi hanno un paragrafo, le caselle rosse ne hanno un altro. Ed ecco come appare questo codice dopo essere stato elaborato dal browser (la freccia indica una riga vuota):
Di conseguenza, otteniamo una separazione piuttosto evidente di un paragrafo dall'altro, il che è vantaggioso: la lettura diventa più conveniente.
Quindi l'articolo su tag di formattazione del documento... Ce ne sono molti di più di quelli che ho descritto in questo materiale. È solo che devi dire molto su alcuni di loro, a seguito dei quali saranno dedicati articoli separati con una recensione completa.!
In html, la dimensione del carattere gioca un ruolo importante. Consente di attirare l'attenzione dell'utente su importanti informazioni pubblicate sulla pagina del sito. Sebbene non solo la dimensione delle lettere sia importante, ma anche il loro colore, spessore e persino la famiglia.
Tag e attributi durante la scansione con caratteri html
Il linguaggio ipertestuale ha un ampio set di strumenti per lavorare con i caratteri. Dopotutto, è la formattazione del testo il compito principale di html.
Il motivo della creazione del linguaggio HTML è stato il problema della visualizzazione delle regole di formattazione del testo nei browser.
Considera i tag che vengono utilizzati per lavorare con i caratteri in html e i loro attributi. Il principale è il tag ... Utilizzando i valori dei suoi attributi, puoi impostare diverse caratteristiche del carattere:
- color - imposta il colore del testo;
- size - dimensione del carattere in unità convenzionali.
Sono supportati i valori degli attributi positivi da 1 a 7.
- face - utilizzato per impostare la famiglia di caratteri del testo da utilizzare all'interno del tag ... Sono supportati più valori contemporaneamente, separati da virgole.
Viene formattato solo il testo tra le parti del tag dei caratteri accoppiati. Il resto del testo viene visualizzato con il carattere standard predefinito.
Anche in html ci sono un certo numero di tag accoppiati che specificano solo una regola di formattazione. Questi includono:
- - imposta il carattere in grassetto in html. Etichetta l'azione è simile alla precedente;
- - la dimensione è maggiore di quella predefinita;
- - dimensione del carattere più piccola;
- - testo in corsivo. tag simile ;
- - testo sottolineato;
- barrato;- - visualizzare il testo solo in minuscolo;
- - in maiuscolo.
Testo normale
Miniatura
Miniatura
Più del solito
Meno del solito
Corsivo
Corsivo
Sottolineato
barrato
Funzionalità degli attributi di stile
Oltre ai tag descritti, ci sono molti altri modi per cambiare il carattere in html. Uno di questi è l'uso dell'attributo di stile generico. Utilizzando i valori delle sue proprietà, puoi impostare lo stile di visualizzazione del carattere:
1) font-family - la proprietà imposta la famiglia di font. È possibile l'enumerazione di più valori.
La modifica del carattere in html al valore successivo avverrà se la famiglia precedente non è installata sul sistema operativo dell'utente.
Sintassi di scrittura:
famiglia di caratteri: nome del carattere [, nome del carattere [, ...]]
2) font-size - la dimensione è impostata da 1 a 7. Questo è uno dei modi principali per aumentare il carattere in html.
Sintassi di scrittura:
font-size: dimensione assoluta | dimensione relativa | valore | interesse | ereditare
La dimensione del carattere può anche essere impostata:
- In pixel;
- In valore assoluto ( xx-piccolo, x-piccolo, piccolo, medio, grande);
- In percentuale;
- In punti (pt).
Dimensione carattere: 7
Dimensione carattere: 24px
Dimensione carattere: x-large
Dimensione carattere: 200%
Dimensione carattere: 24pt
3) font-style - imposta lo stile di scrittura del font. Sintassi:
stile del carattere: normale | corsivo | obliquo | ereditare
Valori:
- normale - ortografia normale;
- corsivo - corsivo
- obliquo - carattere inclinato a destra;
- inherit - eredita l'ortografia dell'elemento genitore.
Un esempio di come cambiare il carattere in html usando questa proprietà:
stile del carattere: eredita
stile del carattere: corsivo
stile del carattere: normale
stile del carattere: obliquo
4) font-variant - converte tutte le lettere maiuscole in maiuscole. Sintassi:
font-variant: normale | maiuscoletto | ereditare
Un esempio di come cambiare il carattere in html con questa proprietà:
font-variant: eredita
font-variant: normale
font-variant: maiuscoletto
5) font-weight - permette di impostare lo spessore della scrittura del testo (saturazione). Sintassi:
font-weight: grassetto | grassetto | più chiaro | normale | 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900
Valori:
- grassetto - imposta il carattere grassetto html;
- più audace - più grasso rispetto al normale;
- più leggero - meno saturo rispetto al normale;
- normale - ortografia normale;
- 100-900 - imposta lo spessore del carattere in equivalente numerico.
font-weight: grassetto
font-weight: più audace
peso del carattere: più leggero
peso del carattere: normale
peso del carattere: 900
peso del carattere: 100
La proprietà del carattere e il colore del carattere html
Font è un'altra proprietà del contenitore. Internamente, ha combinato i valori di diverse proprietà progettate per cambiare i caratteri. La sintassi del carattere è:
font: font-size font-family | ereditare
Inoltre, il valore può essere impostato sui caratteri utilizzati dal sistema nelle iscrizioni sui vari controlli:
- didascalia - per i pulsanti;
- icona - per le icone;
- menù - menù;
- message-box - per finestre di dialogo;
- piccola didascalia - per piccoli controlli
- barra di stato - carattere della barra di stato.
carattere: icona
carattere: didascalia
carattere: menu
font: message-box
sottotitolo
carattere: barra di stato
font: corsivo 50px grassetto "Times New Roman", Times, serif
Per impostare il colore del carattere in html, puoi utilizzare la proprietà color. Ti consente di impostare il colore, utilizzando una parola chiave o in formato rgb. E anche sotto forma di codice esadecimale.