Il cheat sheet di HTML Essentials: tag, attributi e altro

Il cheat sheet di HTML Essentials: tag, attributi e altro

La creazione di pagine Web inizia con HTML. Abbellirli e renderli interattivi viene dopo. Ma per iniziare a creare siti Web statici funzionali, è necessaria una conoscenza dell'HTML. (Vuoi una rapida introduzione a questo linguaggio di markup? Leggi le nostre FAQ HTML.)





Come parte dell'apprendimento della lingua, c'è un lungo elenco di elementi che devi aggiungere al tuo vocabolario HTML. E questo compito può sembrare scoraggiante all'inizio, motivo per cui abbiamo creato il seguente cheat sheet. Ti offre un modo semplice per scoprire/capire/richiamare elementi HTML ogni volta che ne hai bisogno.





Il cheat sheet copre tag e attributi per strutturare le pagine Web, formattare il testo, aggiungere moduli, immagini, elenchi, collegamenti e tabelle. Include anche i tag introdotti nei codici HTML5 e HTML per i caratteri speciali di uso comune.





eccezione del servizio di sistema bsod di Windows 10

DOWNLOAD GRATUITO: Questo cheat sheet è disponibile come a PDF scaricabile dal nostro partner di distribuzione, TradePub. Dovrai compilare un breve modulo per accedervi solo per la prima volta. Scarica Il cheat sheet di HTML Essentials .

puoi giocare con i giochi gamecube?

Il cheat sheet di HTML Essentials

......
scorciatoiaAzione
Tag di base
...Il primo e l'ultimo tag di un documento HTML. Tutti gli altri tag si trovano tra questi tag di apertura e chiusura.
...Specifica la raccolta di metadati per il documento.
...Descrive il titolo della pagina e viene visualizzato nella barra del titolo del browser.
...Include tutti i contenuti che verranno visualizzati nella pagina web.
Informazioni sul documento
Menziona l'URL di base e tutti i relativi link al documento.
Per ulteriori informazioni sulla pagina come autore, data di pubblicazione, ecc.
Collegamenti a elementi esterni come fogli di stile.
...Contiene informazioni sullo stile del documento come CSS (Cascading Style Sheets).
...Contiene collegamenti a script esterni.
Formattazione del testo
... O
...
Rende il testo in grassetto.
... Mette in corsivo il testo e lo rende in grassetto.
... Scrive il testo in corsivo ma non lo rende in grassetto.
...Testo barrato.
...Cita un autore di una citazione.
...Etichetta una parte eliminata di un testo.
...Mostra una sezione che è stata inserita nel contenuto.
...
Per visualizzare le quotazioni. Spesso utilizzato con il tag.
...Per preventivi più brevi.
...Per abbreviazioni e forme complete.
...Specifica i dettagli di contatto.
...Per le definizioni.
... Per frammenti di codice.
...Per scrivere i pedici
...Per scrivere apici.
...Per ridurre le dimensioni del testo e contrassegnare le informazioni ridondanti in HTML5.
Struttura del documento
...Diversi livelli di titoli. H1 è il più grande e H6 è il più piccolo.
...
Per dividere il contenuto in blocchi.
...Include elementi in linea, come un'immagine, un'icona, un'emoticon, senza rovinare la formattazione della pagina.

...



Contiene testo normale.

Crea una nuova linea.

Disegna una barra orizzontale per mostrare la fine della sezione.
Elenchi
    ...
Per l'elenco ordinato degli articoli.
    ...
Per un elenco di articoli non ordinato.
  • ...
  • Per singoli elementi in un elenco.
    ...
    Elenco di elementi con definizioni.
    ...
    La definizione di un singolo termine in linea con il contenuto del corpo.
    ...
    La descrizione del termine definito.
    Link
    ... Tag di ancoraggio per i collegamenti ipertestuali.
    ... Tag per il collegamento a indirizzi e-mail.
    ... Etichetta di ancoraggio per elencare i numeri di contatto.
    ... Tag di ancoraggio per il collegamento a un'altra parte della stessa pagina.
    ... Passa a una sezione div della pagina web. (Variazione del tag sopra)
    immagini

    Per visualizzare i file di immagine.
    Attributi per il etichetta
    src=urlCollegamento al percorso di origine dell'immagine.
    alt = testoIl testo visualizzato quando si passa il mouse sull'immagine.
    altezza=Altezza dell'immagine in pixel o percentuali.
    larghezza=Larghezza dell'immagine in pixel o in percentuale.
    allinea=Allineamento relativo dell'immagine sulla pagina.
    bordo=Spessore del bordo dell'immagine.
    ...Link a una mappa cliccabile.
    ...
    Nome dell'immagine della mappa.
    L'area dell'immagine di una mappa immagine.
    Attributi per il tag
    forma= 'Forma dell'area dell'immagine.
    coordinate=Coordinate dell'area dell'immagine della mappa.
    Forme
    ...Il tag padre per un modulo HTML.
    Attributi per il tag
    azione=urlL'URL a cui vengono inviati i dati del modulo.
    metodo=Specifica il protocollo di invio del modulo (POST o GET).
    enctype=Lo schema di codifica dei dati per gli invii POST.
    completamento automaticoSpecifica se il completamento automatico del modulo è attivato o disattivato.
    non convalidareSpecifica se il modulo deve essere convalidato prima dell'invio.
    accetta-charsetsSpecifica la codifica dei caratteri per l'invio di moduli.
    obbiettivoMostra dove verrà visualizzata la risposta all'invio del modulo.
    ...Raggruppa elementi correlati nel modulo/
    ...Specifica cosa l'utente deve inserire in ogni campo del modulo.
    ...Una didascalia per l'elemento fieldset.
    Specifica il tipo di input da ricevere dall'utente.
    Attributi per il tag
    tipo=Determina il tipo di input (testo, date, password).
    nome=Specifica il nome del campo di input.
    valore=Specifica il valore nel campo di input.
    taglia=Imposta il numero di caratteri per il campo di input.
    lunghezza massima=Imposta il limite dei caratteri di input consentiti.
    necessarioRende obbligatorio un campo di immissione.
    larghezza=Imposta la larghezza del campo di input in pixel.
    altezza=Imposta l'altezza del campo di input in pixel.
    segnaposto=Descrive il valore del campo previsto.
    modello=Specifica un'espressione regolare, che può essere utilizzata per cercare modelli nel testo dell'utente.
    min =Il valore minimo consentito per un elemento di input.
    max=Il valore massimo consentito per un elemento di input.
    DisabilitatoDisabilita l'elemento di input.
    ...Per acquisire stringhe di dati più lunghe dall'utente.
    ...Specifica un elenco di opzioni tra cui l'utente può scegliere.
    Attributi per il tag
    nome=Specifica il nome per un elenco a discesa.
    taglia=Numero di opzioni fornite all'utente.
    multiploImposta se l'utente può scegliere più opzioni dall'elenco.
    necessarioSpecifica se la scelta di una o più opzioni è necessaria per l'invio del modulo.
    messa a fuoco automaticaSpecifica che un elenco a discesa viene automaticamente evidenziato dopo il caricamento di una pagina.
    ...Definisce gli elementi in un elenco a discesa.
    valore=
    Visualizza il testo per qualsiasi opzione data.
    selezionatoImposta l'opzione predefinita visualizzata.
    ...Tag per la creazione di un pulsante per l'invio del modulo.
    Oggetti e iFrame
    ...Descrive il tipo di file incorporato.
    Attributi per il tag
    altezza=L'altezza dell'oggetto.
    larghezza=La larghezza dell'oggetto.
    tipo=Il tipo di supporto contenuto nell'oggetto.
    Un frame in linea per incorporare informazioni esterne.
    nome=Il nome dell'iFrame.
    src=L'URL di origine per il contenuto all'interno del frame.
    srcdoc=Il contenuto HTML all'interno del frame.
    altezza=L'altezza dell'iFrame.
    larghezza=La larghezza dell'iFrame.
    Aggiunge parametri extra per personalizzare l'iFrame.
    ...Incorpora un'applicazione esterna o un plug-in.
    Attributi per il tag
    altezza=Imposta l'altezza dell'incorporamento.
    larghezza=Imposta la larghezza dell'incorporamento.
    tipo=Il tipo o il formato dell'incorporamento.
    src=Il percorso di origine del file incorporato.
    Tabelle
    ...
    Definisce tutto il contenuto di una tabella.
    ...
    Una descrizione della tabella.
    ...Intestazioni per ogni colonna della tabella.
    Definisce i dati del corpo per la tabella.
    ...Descrive il contenuto del piè di pagina della tabella.
    Contenuto per una singola riga.
    ...I dati in una singola voce di intestazione.
    ...Contenuto all'interno di una singola cella di tabella.
    ...
    Raggruppa le colonne per la formattazione.
    Una singola colonna di informazioni.
    Nuovi tag HTML5
    ...Specifica l'intestazione della pagina web.
    ...Specifica il piè di pagina della pagina web.
    ...Contrassegna il contenuto principale della pagina web.
    ...Specifica un articolo.
    ...Specifica il contenuto della barra laterale di una pagina.
    ...Specifica una particolare sezione nella pagina web.
    ...Per descrivere ulteriori informazioni.
    ...Usato come intestazione per il tag sopra. È sempre visibile all'utente.
    ...Crea una finestra di dialogo.
    ...Utilizzato per includere grafici e figure.

    ...

    Descrive un elemento.
    ...Evidenzia una parte specifica del testo.
    ...Insieme di collegamenti di navigazione su una pagina web.
    ...Un particolare elemento di un elenco o di un menu.
    ...Misura i dati all'interno di un determinato intervallo.
    ...Posiziona una barra di avanzamento e tiene traccia dei progressi.
    ...Visualizza il testo che non supporta le annotazioni Ruby.
    ...Visualizza i dettagli dei caratteri tipografici dell'Asia orientale.
    ...Un'annotazione Ruby per la tipografia dell'Asia orientale.
    ...Identifica ora e data.
    Un'interruzione di riga all'interno del contenuto.
    ¹Oggetti carattere HTML5
    " O
    & quot;
    Virgolette
    < O
    & lt;
    Segno minore di (<)
    > O
    >
    Segno di maggiore di (>)
      ; O
    ;
    Spazio infrangibile
    © ; O
    &copia ;
    Simbolo del copyright
    ™ ; O
    & ucirc;
    Simbolo del marchio
    @ O
    & Uuml;
    al simbolo (@)
    & O
    &
    Simbolo commerciale (&)
    • ; O
    & ouml;
    Piccolo proiettile
    ¹Ignora lo spazio prima del punto e virgola durante la digitazione del carattere HTML.

    Costruisci un sito web per un'esperienza pratica

    Una volta capito le basi del codice HTML e avere una conoscenza pratica di CSS e JavaScript, prova a creare un sito web . Inoltre, assicurati di salvare il nostro cheat sheet delle proprietà CSS3 e Cheat sheet JavaScript per uso futuro!





    Condividere Condividere Tweet E-mail Come accedere alla livella a bolla integrata di Google su Android

    Se hai mai avuto bisogno di assicurarti che qualcosa sia livellato in un pizzico, ora puoi ottenere una livella a bolla sul tuo telefono in pochi secondi.

    trova la musica in un video di youtube
    Leggi Avanti Argomenti correlati
    • Produttività
    • Programmazione
    • HTML
    • Foglio informativo
    Circa l'autore Akshata Shanbhag(404 articoli pubblicati)

    Akshata si è formato in test manuali, animazione e design UX prima di concentrarsi sulla tecnologia e sulla scrittura. Questo ha riunito due delle sue attività preferite: dare un senso ai sistemi e semplificare il gergo. A MakeUseOf, Akshata scrive di come ottenere il meglio dai tuoi dispositivi Apple.





    Altro da Akshata Shanbhag

    Iscriviti alla nostra Newsletter

    Iscriviti alla nostra newsletter per consigli tecnici, recensioni, ebook gratuiti e offerte esclusive!

    Clicca qui per iscriverti