Casa / Lavora su Internet / Puoi usare il tag i. Come creare un bel font in html: dimensioni, colori, tag dei font html. Bloccare. La struttura della pagina più semplice

Puoi usare il tag i. Come creare un bel font in html: dimensioni, colori, tag dei font html. Bloccare. La struttura della pagina più semplice

Descrizione

Imposta lo spessore del carattere in corsivo. È accettabile utilizzare questo tag insieme ad altri tag che definiscono lo stile del testo.

Sintassi

Testo

Cartellino di chiusura

Necessario.

Attributi

Analogo CSS

Esempio. Utilizzo dei tag

Tagga io

Lorem ipsum dolor sit amet

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. Ut wisis enim ad minim veniam, quis nostrud exerci tution ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.

Nota

Nonostante l'uso del tag non è deprecato in HTML, l'applicazione degli stili fornisce un maggiore controllo sullo stile del testo.

Specifica?

Specifica

Ogni specifica passa attraverso diverse fasi di approvazione.

  • Raccomandazione (raccomandazione): la specifica è approvata dal W3C e raccomandata come standard.
  • Raccomandazione del candidato ( Possibile raccomandazione) - il gruppo responsabile dello standard è soddisfatto del raggiungimento dei suoi obiettivi, ma per implementare lo standard è necessario il supporto della comunità di sviluppo.
  • Raccomandazione proposta ( Raccomandazione suggerita) - in questa fase, il documento viene sottoposto all'Advisory Board del W3C per l'approvazione finale.
  • Bozza di lavoro - Una bozza più matura dopo la discussione e gli emendamenti per la revisione da parte della comunità.
  • Bozza dell'editore ( Progetto editoriale) è una bozza dello standard dopo che sono state apportate modifiche dagli editori del progetto.
  • brutta copia ( Bozza di capitolato d'oneri) è la prima bozza della norma.

A parte c'è lo standard vivente HTML (Living): non aderisce alla tradizionale numerazione delle versioni, poiché è in costante sviluppo e viene aggiornato regolarmente.

Browser: Desktop Mobile ?

Internet ExplorerCromomusica liricasafariFirefox
2 1 2 1 1
AndroideFirefox CellulareOperaMobileCellulare Safari
1 1 6 1

Ciao cari lettori del blog! Questo articolo parlerà tag di formattazione del testo. Esempi importanti stanno rendendo il testo in grassetto o in corsivo. Considereremo anche l'influenza di alcuni tag sull'ottimizzazione interna del sito e le regole per scriverli. Puoi leggerlo nell'articolo qui sotto. 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: block e inline. Quando si utilizza il primo, è possibile modificare il contenuto di una parte del testo (righe, singoli frammenti o parole) e il secondo è . I tag di formattazione che tratteremo in questo articolo sono prevalentemente in linea.

Regole e ordine di scrittura dei tag

Sai già cosa sono i tag di apertura e chiusura. In caso contrario, leggi l'articolo all'inizio di questo materiale. In breve, esistono due tipi di tag: singoli (ad esempio, trasferimento a nuova linea
) e contenitore (accoppiato). Quindi, tutti i tag di formattazione del testo lo sono accoppiato. Ciò significa che ogni elemento ha un tag di apertura e chiusura e l'evidenziazione deve essere posizionata tra di loro. Per esempio, corretta selezione la frase sarà simile a questa: Selezione

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 è non dimenticare di chiuderli. In caso contrario, tutto il testo della pagina sarà in grassetto (nell'esempio con il tag ). Ma ci sono casi in cui è necessario selezionare contemporaneamente un determinato frammento sia in grassetto che in corsivo. Ma non esiste un tag che esegue questa azione. C'è solo una via d'uscita da questa situazione: usa due tag contemporaneamente. Non importa in quale ordine li usi. Pertanto, scrivendo il testo con tag come questo:

Selezione

o così:

Selezione

Ottieni ancora Selezione 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ò elaborare i tag in modo diverso (), a seconda delle impostazioni. Ora passiamo ai tag di formattazione stessi.

Rendere il testo in grassetto e in corsivo - tag , , e

I tag di formattazione del testo più popolari: evidenziandolo grassetto e in corsivo. Solitamente vengono utilizzati per dare importanza a qualsiasi frammento. Il primo caso serve a selezionare un frammento contenente informazioni utili o parole chiave. Il corsivo ha lo stesso scopo 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.

Iniziamo con rendere il testo in grassetto. Ci sono due tag usati per questa azione - e . Differenze di aspetto esteriore no. Sebbene, dato che ogni browser può interpretare ogni elemento in modo diverso, dovresti essere in grado di vedere alcune differenze. Ecco come appare il testo nei tag e nella forma già elaborata 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 di selezione considerati in grassetto e corsivo in realtà non differiscono, 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. E il fatto è che i tag e influenzare . Se circondi le parole chiave con questi tag, ciò avrà un effetto positivo sulla promozione del sito.La cosa principale è non esagerare: il testo dovrebbe avere un massimo del 5% di testo in grassetto nel tag e la stessa quantità di corsivo nel tag .

Se vuoi solo evidenziare un punto 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 meno effetto di e .

Evidenziare i tag barra di testo - , e

Ora diamo un'occhiata ad alcuni tag che utilizzano un tratto nella decorazione del testo. Il più famoso per te editori di testoetichetta o sottolineatura. Questo tag non influisce sulla classifica (per quanto ne so), ma aiuterà a evidenziare del testo e a concentrarsi su di esso. Ho fornito un esempio dell'utilizzo di questo tag un po' più in alto.

Altri due tag simili - e . Entrambi svolgono la funzione di testo barrato. Puoi usare questo tag in qualsiasi situazione: se stai aggiornando un documento (o meglio parte di esso), puoi cancellare il vecchio e aggiungerne uno nuovo; se hai intenzione di scrivere qualcosa che devia dall'argomento del materiale; qualcosa che non soddisfa gli standard morali ed etici.

Le differenze tra questi due tag sono solo nel loro scrivere, per cui è preferibile utilizzare il primo, perché in primo luogo, è più conveniente scrivere e, in secondo luogo, ci sarà meno codice HTML sulla tua pagina e i motori di ricerca lo adorano.

Etichetta e attributi: impostazioni dei caratteri del testo

Consideriamo ora un tag che non viene utilizzato senza attributi. Con esso, puoi impostare i parametri per una specifica parte di testo. In generale, ora è preferibile utilizzare (fogli di stile a cascata), perché utilizzandoli, puoi ridurre notevolmente l'intero codice HTML della pagina. Quindi, considera lo stesso tag . Per lui c'è tutto tre attributi:

  • viso- il carattere stesso. Ad esempio, Arial, Courier o Verdana. Puoi elencarne alcuni, perché. non tutti gli utenti dispongono di un ampio set di font, e scrivendone diversi nell'attributo face, il browser potrà scegliere quale utilizzare, ovvero quale è presente nel sistema;
  • tagliaè un attributo che specifica 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 colore HTML sia in quelli verbali. I primi assomigliano a #FFFFFF (dove F è qualsiasi numero o lettera dalla A alla F), mentre i secondi sono scritti in parole povere(ad esempio, rosso - rosso).

Ecco come appare il testo nel tag utilizzando ogni attributo:

Questo testo è 6px


Questo testo è rosso

Questo testo è in carattere Arial

Questo testo è rosso e ha una dimensione di 5px.

Ed ecco cosa vedrai dopo aver elaborato il codice scritto:

Elementi di design del testo a blocchi - Intestazioni

-

, paragrafo

Infine, esamineremo gli elementi a blocchi, utilizzati in quasi tutti i documenti. Questi sono tag di intestazione e paragrafo. Consideriamo il primo. Le intestazioni sono disponibili in 6 tipi e ciascuna 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:

Il numero dopo la parola del titolo corrisponde al numero nel tag . I titoli hanno un enorme impatto sull'ottimizzazione della pagina, quindi inseriscili nei tag parole chiave. Ci sono parecchie caratteristiche di questo caso, di cui parlerò negli articoli successivi.

Ora parliamo del tag di selezione del paragrafo

La funzione di questo tag è di separare il testo tra altri testi simili con una riga vuota. Se guardi il codice sorgente di qualsiasi documento, puoi vedere quanto segue:

I rettangoli verdi contengono un paragrafo, i rettangoli rossi un altro. Ed ecco come appare questo codice dopo l'elaborazione da parte del browser (la freccia indica una riga vuota):

Di conseguenza, otteniamo una separazione abbastanza evidente di un paragrafo dall'altro, il che è vantaggioso: la lettura diventa più conveniente.

Questa è la fine dell'articolo su tag di formattazione del documento. Ce ne sono molti di più di quelli che ho descritto in questo articolo. È solo che alcuni hanno bisogno di essere raccontati parecchio, per cui a loro saranno dedicati articoli separati con una recensione completa.!

Il carattere corsivo è uno dei modi più popolari per evidenziare una parte di testo e dargli un certo significato. È ideale per citazioni, note a piè di pagina, titoli e nomi propri. Ci sono due tag speciali in HTML per la visualizzazione del corsivo. Nei CSS, il corsivo è controllato dalla proprietà font-style.

Carattere corsivo o corsivo?

La visualizzazione dello stesso carattere in corsivo può variare.

L'immagine mostra tre blocchi di testo nello stesso font Playfair Display. Il primo è in stile romano normale, mentre il secondo e il terzo sono in corsivo. Sono aperti nello stesso browser Google Chrome ma sembrano completamente diversi.

Il fatto è che alcuni font hanno i propri set di caratteri in corsivo. Se il browser non ha accesso a questo set, ma incontra del testo che dovrebbe essere visualizzato in corsivo, tenterà di inclinarlo da solo.

Nel secondo blocco - proprio una tale versione elaborata dal browser, e nel terzo - la versione originale in corsivo del carattere Playfair Display, che ha uno stile unico, più simile a uno scritto a mano. Il browser, d'altra parte, inclina semplicemente ogni carattere del testo di una certa angolazione, imitando il corsivo.

Quando capisci come rendere il corsivo in CSS o HTML, è importante ricordare che nel caso di caratteri specifici, devi assicurarti che il browser abbia accesso ai loro set di corsivo. In alcuni casi, il risultato degli algoritmi di inclinazione del browser potrebbe non essere soddisfacente.

HTML corsivo

Ci sono due tag speciali per il testo in corsivo in HTML: i (dalla parola corsivo) ed em. Lo stile di un frammento di testo racchiuso in uno qualsiasi di questi descrittori sarà lo stesso.

La differenza sta nell'allocazione logica. Il tag em indica il significato speciale del frammento. Questo è importante per i robot di ricerca e gli screen reader, che evidenzieranno il testo specificato utilizzando l'intonazione.

proprietà font-style

Nei CSS, il corsivo è controllato dall'istruzione font-style. Può assumere uno dei tre valori di base:

  • normale - carattere normale;
  • corsivo - stile corsivo;
  • obliquo - stile obliquo.

Attualmente, la maggior parte dei browser moderni tratta i valori obliqui e corsivi allo stesso modo, ma originariamente si presumeva che il primo fosse il risultato di speciali algoritmi del browser che inclinano ogni carattere verso destra.

Se il carattere che stai cercando non viene trovato dal browser, il corsivo avrà esattamente lo stesso aspetto di obliquo.

A differenza del tag em, non attribuisce particolare importanza al frammento evidenziato, ma corrisponde piuttosto al descrittore i.

Esempi

Le citazioni sono spesso evidenziate in corsivo. Proviamo a farlo sembrare carino.

Quote ( font-style: corsivo; border-left: 5px solid purple; padding-left: 20px; )

Oltre al bordo decorativo a destra e al riempimento, il blocco delle virgolette ha una regola di stile del carattere con un valore di corsivo.

Imposta CSS in corsivo.