5 elementi HTML che potresti non sapere come usare

Familiarità ancora sconosciuta o completamente nuova, succede che perdiamo parti della sintassi HTML che potrebbe rivelarsi una conoscenza importante che possiamo mettere a frutto . Ecco perché se sono le nuove funzionalità di HTML o le sue applicazioni meno conosciute che non sono ancora entrate nel tuo radar, li copriamo abbastanza spesso su questo sito.

Nel post di oggi, esamineremo cinque elementi HTML, alcuni dei quali potrebbero essere usati frequentemente, ma probabilmente non al massimo del suo potenziale .

1.

Il l'elemento ha una funzione simile agli attributi data-* . Può essere utilizzato per fornire dati leggibili dalla macchina per un contenuto user-friendly. L'attributo value di questo elemento contiene le informazioni aggiunte.

I tre volumi del romanzo del Signore degli Anelli sono:  Compagnia dell'Anello ,  Le due torri , e  Il ritorno del re  .
ISBN dei libri menzionati in questa pagina: 

Nel codice HTML precedente, il codice ISBN di ciascun libro viene aggiunto all'attributo value del file elemento che racchiude il titolo del libro. Sul mercato del libro, il codice ISBN viene utilizzato per identificare univocamente un libro.

 const ISBNListBlank = document.querySelector ('# ISBNListBlank') const dataElements = document.querySelectorAll ('data'); const ary = []; dataElements.forEach ((dataElement) => ary.push (dataElement.textContent + ':' + dataElement.value)) ISBNListBlank.textContent = ary.join (', ') 

Per mostrare approssimativamente come estrarre il valori in JavaScript, lo script precedente estrae i codici ISBN dal etichetta e li visualizza, insieme ai titoli dei libri, in un punto designato nella pagina.

Molto probabilmente hai già familiarità con l'elemento, tuttavia non è solo per le caselle di controllo . Può controllare anche altri elementi labellabili, eseguendo le loro azioni proprio come fa l'azione delle caselle di controllo.

È sufficiente utilizzare lo stesso valore per l'attributo id dell'elemento HTML che si desidera controllare e for attributo del tag di appartenenza.

 Cliccando su questo testo clicca sul pulsante qui sotto. METTERE IN GUARDIA 

Facendo clic sul testo di attiverà l'evento click di e mostrerà il messaggio di avviso dato.

3.

Questo elemento è usato principalmente per le lingue dell'Asia orientale, tuttavia questo non è il suo unico caso d'uso. Lo scopo di è semplicemente aggiungere annotazioni o pronuncia per i testi, e puoi farlo anche con contenuti in inglese.

L'elemento racchiude due sotto-elementi principali, vale a dire e . Il tag contiene il testo che vuoi annotare (chiamato il testo base ) e tiene l'annotazione stessa.

Viene chiamata una persona che crea un'attività o un'attività commerciale, assumendosi rischi finanziari nella speranza di profitto  imprenditore  à <ÃÅ'à‰ Â'ntrà ‰  ™ prà ‰  ™ à <Ana ‰  ™ a <a  ; un promotore nel settore dell'intrattenimento.

La pronuncia della parola "imprenditore" viene aggiunta usando il elemento all'interno del paragrafo . La parola stessa è avvolta nel tag e la pronuncia in .

Ecco come appare l'output:

Il

l'elemento per gli elenchi ordinati è un altro elemento con cui potresti avere familiarità. Crea una lista con elementi numerati, a differenza di una lista non ordinata creata con
.

Potresti aver saputo dell'ordine, ma lo sapevi che l'ordine può essere annullato ? Invece di un ordine crescente, la numerazione decrementante può essere eseguita anche da

, usando l'attributo reversed .

scarabeo
Mahjong
Monopolio
Scacchi
Jenga

L'attributo reversed inverte la numerazione, mentre l'attributo type determina il tipo di numerazione . La capitale I denota la numerazione romana del capitale.

Ecco come appare sullo schermo:

5.

L'elemento è pensato per racchiudere un termine definito dal testo circostante . Il testo racchiuso dal tag è disegnato dai browser con il corsivo, il che significa che questo è il termine che viene definito.

È possibile aggiungere la definizione del termine all'interno del valore dell'attributo title, che è utile per definire parole che non sono necessariamente definite dal testo circostante .

L'elemento funziona in modo simile al quale viene visualizzato il significato di un'abbreviazione data nel suo attributo title quando l'utente passa sopra l'elemento.

C'è una dicotomia tra il design e il prototipo.

Questo è lo stile predefinito del browser, tuttavia su un sito di produzione, potresti voler utilizzare uno stile diverso:

Prendendo il cursore sopra la parola definita, la pagina mostrerà la definizione aggiunta nell'attributo del title .


Come usare Dashicons in tema WordPress o Plugin

Insieme al rinnovato WP-Admin, WordPress 3.8 ha portato anche un set di icone nuove di zecca chiamate Dashicons. Dashicons è un'icona di carattere disegnata da Mel Choyce che è stata creata principalmente per accogliere la nuova interfaccia utente di WP-Admin, dall'editor della schermata dei contenuti al menu di amministrazione, come puoi vedere nello screenshot qui sotto.O

(Consigli tecnici e di design)



30 estensioni Chrome per una migliore produttività nel 2017

Esistono numerose app di produttività per i cellulari e molti strumenti di produttività per PC. Ma lo sapevate che ci sono alcune estensioni Chrome davvero straordinarie che possono portare la vostra produttività a un livello superiore e aiutarvi a fare le cose in fretta, mantenendo al contempo la vostra sanità mentale.In

(Consigli tecnici e di design)