1. Corso Data Journalist gen-mar 2017
TECNOLOGIE WEB BASE
Presentazione, CSS e selettori
2. Presentazione di un elemento html
< /TAG >
C O N T E N U T O
tag iniziale
< TAG attributo = valore , attributo = valore .….. >
tag finale
ATTRIBUTO SPECIALE: style = ’’ regole di stile ‘’
attributo : valore ; attributo : valore ; …..
3. Attributi di tag
<h1 align=”left”>
align text-align
attributo di tag possibili valori
left/middle/right
esempio
attributo di regola di stile possibili valori
left/center/right
esempio
<h1 style=”text-align : left”>
<font size=4>
size font-size
attributo di tag possibili valori
integer
esempio
attributo di regola di stile possibili valori
...px/...em
esempio
<h1 style=”font-size : 20px”>
Attributi di regole
di stile
4. Collegamento tra elemento e regole di stile
<!DOCTYPE html>
<html>
<head/>
<meta charset="utf-8">
<title>Grafico Line</title>
</head>
<body>
<h1 style=’’font-size:20px”>Titolo </h1>
<div> Contenuto </div>
</body>
</html>
STYLE in TAG STYLE in HEAD
<!DOCTYPE html>
<html>
<head/>
<meta charset="utf-8">
<title>Grafico Line</title>
<style> h1 {font-size:20px} </style>
</head>
<body>
<h1>Titolo </h1>
<div> Contenuto </div>
</body>
</html>
5. .valore di
attributo class
Regole css
selettore { attributo : valore;
……………..
attributo : valore; }
tag dell’elemento
#valore di
attributo id
selettori multipli ( , )
selettori discendenti (spazio)
selettori dettagliati (uniti)
selettori figli diretti (>)
selettori adiacenti (+)
selettori fratelli (~)
h1, h2
h1 p
h1#id1
div > h1
h1 +h2
h3~h2