Lezione pratica n.2 HTML 5 – CSS

In questa video lezione proposta si spiega la correlazione fra i nuovi tag semantici dell’HTML 5 e il CSS3. In particolare, si evidenzia la possibilità di sfruttare i tag semantici dell’HTML 5 e di costruire su di essi un design attraverso l’uso di un foglio di stile CSS3. Il foglio di stile css può essere incorporato come già peraltro viso nella lezione pratica n.1 HTML e CSS con il tag <link> che all’interno deve contenere tre attributi e quindi nella sintassi completa è:<link rel=”stylesheet” href=”url file css” type=”text/css”>questo tag inserito prima del tag <head> e comunque dopo il tag <html> consente di collegare un foglio di stile CSS esterno al nostro documento HTML. I tag che sono coinvolti sono <header> e <footer> per l’intestazione il pié di pagina per un blocco logico (in un documento HTML possono essere presenti come già visto più blocchi logici distinti), il tag <nav> per la barra di navigazione per costruire un menu con un elenco puntato, e il tag <main> che rappresenta il blocco principale del documento HTML da non confondere con il tag <body> dell’intera pagina. In particolare molto utilizzato è il selettore display che può assumere come valori più importanti “block”, “inline”, “block-ingline” e “none”. Quando un contenitore logico HTML ha una classe CSS associata dove è presente il selettore display il Browser effettua un rendering del blocco secondo quelle che sono le prescrizioni del selettore display. In particolare se il selettore ha il valore su block allora gli elementi dell’elemento di pagina coinvolti sono disposti in verticale mentre nel caso di valore “inline” in orizzontale. Nel caso in cui il selettore abbia il valore “block-inline” si comporta come un blocco ma i contenuti del blocco fluiscono da sinistra verso destra fino ad occupare lo spazio a loro concesso. Se ad esempio…

Tu devi essere registrato per visualizzare questo articolo.

Esegui la registrazione per accedere a questo contenuto.

inserimento cognome utente