C’è un modo per creare il tuo tag html in HTML5?

Voglio creare qualcosa di simile

  aaa bbb   ccc   

Può essere fatto in HTML5? So che posso farlo con

  

ma è molto meno leggibile 🙁

Puoi utilizzare tag personalizzati nei browser, anche se non saranno HTML5 (vedi Elementi personalizzati HTML5 validi e le specifiche HTML5 ).

Supponiamo che tu voglia utilizzare un elemento tag personalizzato chiamato . Ecco cosa dovresti fare …

PASSO 1

Normalizza i suoi attributi nel tuo CSS Stylesheet (pensa css reset) – Esempio:

  stack{display:block;margin:0;padding:0;border:0; ... } 

PASSO 2

Falla funzionare nelle vecchie versioni di Internet Explorer aggiungendo questo script alla testa (Importante!):

   

Quindi puoi usare liberamente il tuo tag personalizzato.

 Overflow 

Sentiti libero di impostare anche gli attributi …

  hello  

Non sono così sicuro di queste risposte. Come ho appena letto: “LE TAG CUSTOM SONO SEMPRE STATE AMMESSE IN HTML”.

http://www.crockford.com/html/

Il punto qui è che l’HTML era basato su SGML. A differenza di XML con i suoi doctypes e schemi, HTML non diventa non valido se un browser non conosce un tag o due. Pensa a . Questo non è stato nello standard ufficiale. Quindi mentre lo utilizzava rendeva la tua pagina HTML “ufficialmente non approvata”, non rompeva neanche la pagina.

Poi c’è , che era specifico di Netscape, dimenticato in HTML4 e riscoperto e ora specificato in HTML5. Inoltre, ora disponiamo anche di attributi di tag personalizzati, come data-XyZzz = “…” consentito su tutti i tag HTML5.

Quindi, anche se non dovresti inventare una tua insalatina di markup personalizzata, non è assolutamente proibito avere tag personalizzati in HTML. Tuttavia, a meno che tu non voglia inviarlo con un Content-Type + xml o incorporare altri namespace XML, come SVG o MathML. Questo si applica solo all’HTML confinato con SGML.

Come Michael ha suggerito nei commenti, quello che vuoi fare è del tutto ansible, ma la tua nomenclatura è sbagliata. Non stai “aggiungendo tag a HTML 5”, stai creando un nuovo tipo di documento XML con i tuoi tag.

L’ho fatto per alcuni progetti nel mio ultimo lavoro. Alcuni consigli pratici:

  1. Quando dici di voler “aggiungere questi elementi a HTML 5”, presumo che ciò che intendi veramente è che vuoi che le pagine vengano visualizzate correttamente in un browser moderno, senza dover fare molto lavoro sul lato server. Questo può essere ottenuto inserendo una “istruzione di elaborazione del foglio di stile” nella parte superiore del file xml, come . Sostituisci “menu.xsl” con il percorso del foglio di stile XSL che hai creato per convertire i tuoi tag personalizzati in HTML.

  2. Avvertenze: il file deve essere un documento XML ben formato, completo di intestazione XML . XML è più selettivo di HTML su cose come tag non corrispondenti. Inoltre, a differenza di HTML, i tag fanno distinzione tra maiuscole e minuscole. È inoltre necessario assicurarsi che il server Web invii i file con il tipo mime appropriato “application / xml”. Spesso il web server sarà configurato per farlo automaticamente se l’estensione del file è “.xml”, ma controlla.

  3. Big Caveat: Infine, usare la trasformazione XSL automatica dei browser, come ho descritto, è davvero la soluzione migliore solo per il debug e per applicazioni limitate in cui si ha un grande controllo. L’ho usato con successo nella creazione di una semplice intranet presso il mio ultimo datore di lavoro, a cui si accedeva solo da poche decine di persone al massimo. Non tutti i browser supportano XSL e quelli che non hanno implementazioni completamente compatibili. Quindi, se le tue pagine devono essere rilasciate in “wild”, è meglio trasformarle tutte in HTML sul lato server, cosa che può essere eseguita con uno strumento da riga di comando o con un pulsante in molti editor XML.

La creazione di nomi di tag personalizzati in HTML non è ansible / non è valida. Ecco a cosa servono XML, SGML e altri linguaggi di markup generici.

Quello che probabilmente vuoi è

  

Oppure invece di

e qualcosa come

    e

  • .

    Per farlo sembrare e funzionare bene, basta colbind alcuni CSS e Javascript.

    Voglio solo aggiungere alle risposte precedenti che esiste un significato per utilizzare solo tag di due parole per elementi personalizzati. Non dovrebbero mai essere standardizzati.


    Ad esempio, vuoi usare il tag , perché non ti piace , e non ti piace neanche …

    Bene, tieni presente che non sei l’unico. Forse in futuro, w3c e / o browser specificheranno / implementeranno questo tag.

    A questo punto, i browser probabilmente implementeranno lo stile nativo per questo tag e il design del tuo sito web potrebbe rompersi.

    Quindi sto suggerendo di usare (secondo questo esempio) .


    Di fatto, il tag

    è definito; non così usato, ma definito. Dovrebbe contenere che si comportano come

  • .

    I tag personalizzati possono essere utilizzati in Safari, Chrome, Opera e Firefox, almeno fino al loro utilizzo al posto di “class = …”.

    verde {color: green} in css funziona per

     This is some text. 

    Per incorporare i metadati, puoi provare a utilizzare i microdati HTML , ma è ancora più dettagliato rispetto all’utilizzo dei nomi di class.

     

    My name is Elizabeth.

    My name is Daniel.

    Oltre a scrivere un foglio di stile XSL, come ho descritto in precedenza, esiste un altro approccio, almeno se si è certi che verrà utilizzato Firefox o un altro browser XML completo (ad esempio, NON Internet Explorer). Salta la trasformazione XSL e scrivi un foglio di stile CSS completo che indica al browser come formattare l’XML direttamente. Il vantaggio qui è che non dovresti imparare XSL, che molte persone trovano essere un linguaggio difficile e controintuitivo. Il rovescio della medaglia è che il tuo CSS dovrà specificare lo stile molto completamente, compresi i nodes dei blocchi, cosa sono inline, ecc. Di solito, quando scrivi CSS, puoi supporre che il browser “sappia” che , ad esempio, è un nodo in linea, ma non avrà idea di cosa fare con .

    Infine, sono passati alcuni anni da quando ho provato questo, ma il mio ricordo è che IE (almeno alcune versioni precedenti) si è rifiutato di applicare fogli di stile CSS direttamente ai documenti XML.

    Il punto di HTML è che i tag inclusi nella lingua hanno un significato concordato, che tutti nel mondo possono utilizzare e basare le decisioni su – come lo stile predefinito, o fare collegamenti cliccabili, o inviare un modulo quando si fa clic su un .

    I tag come il tuo sono fantastici per gli umani (perché possiamo imparare l’inglese e quindi sapere, o almeno indovinare, cosa significano i tuoi tag), ma non così bene per le macchine.

    Come diceva Nick, i tag personalizzati non sono supportati da alcuna versione di HTML.

    Ma, non darà alcun errore se si utilizza tale markup nel codice HTML.

    Sembra che tu voglia creare una lista. Puoi utilizzare la lista non ordinata

      per creare gli elementi rool e utilizzare il tag

    • per gli elementi sottostanti.

      Se non è quello che vuoi ottenere, specifica esattamente ciò che desideri. Allora possiamo trovare una risposta.

      È ansible aggiungere un attributo personalizzato tramite dati HTML 5 – Attributi. Ad esempio: Messaggio valido per HTML 5. Vedere http://ejohn.org/blog/html-5-data-attributes/ per ottenere i dettagli.

      I tag polimerici o X ti consentono di creare i tuoi tag html. Si basa sul “shadow DOM” del browser nativo.

      Puoi semplicemente creare uno stile css personalizzato, questo creerà un tag che renderà il colore dello sfondo rosso:

       redback {background-color:red;} 
       This is red 

      In alcune circostanze, potrebbe sembrare che la creazione di nomi di tag personalizzati funzioni correttamente.
      Tuttavia, questa è solo la routine di gestione degli errori del tuo browser al lavoro. E il problema è che diversi browser hanno diverse routine di gestione degli errori!

      Vedi questo esempio.
      La prima riga contiene due elementi inventati, what e ever , e vengono trattati in modo diverso dai vari browser. Il testo appare rosso in IE11 e Edge, ma è nero negli altri browser.
      Per il confronto, la seconda riga è simile, tranne che contiene solo elementi HTML validi e quindi avrà lo stesso aspetto in tutti i browser.

       body {color:black; background:white;} /* reset */ what, ever:nth-of-type(2) {color:red} code, span:nth-of-type(2) {color:red} 
       

      test

      test

      Questa non è un’opzione in nessuna specifica HTML 🙂

      Probabilmente puoi fare ciò che vuoi con gli elementi e le classi

      , dalla domanda non sono sicuro di cosa stai cercando, ma no, creare i tuoi tag non è un’opzione.

      Ho trovato questo articolo sulla creazione di tag HTML personalizzati e la creazione di istanze. Semplifica il processo e lo scomposizione in termini che chiunque può comprendere e utilizzare immediatamente, ma non sono del tutto sicuro che i campioni di codice in esso contenuti siano validi in tutti i browser, in modo da caveat emptor e testare accuratamente. Tuttavia, è un’ottima introduzione all’argomento per iniziare.

      Elementi personalizzati: definizione di nuovi elementi in HTML

              This is how you create custom tags like what he is asking for its very simple just do what i wrote it works yeah no js or convoluted work arounds needed this lets you do exactly what he wrote.   

      puoi usare questo:

           MyExample   this is BLOODRED (not to scare you)