Luigi Vetrano Corso di Reti di Calcolatori Slides di completamento per i problemi più comuni riscontrati durante il corso

Luigi Vetrano

Corso diCorso diReti di CalcolatoriReti di Calcolatori

Slides di completamento per i problemiSlides di completamento per i problemi

più comuni riscontrati durante il corsopiù comuni riscontrati durante il corso

Luigi Vetrano

Rudimenti di HTMLRudimenti di HTML

BasicBasic

3

La struttura di base di un La struttura di base di un documento HTMLdocumento HTML

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN"><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN">

<HTML><HTML>

<HEAD><HEAD>

<TITLE>Titolo del documento</TITLE><TITLE>Titolo del documento</TITLE>

</HEAD></HEAD>

<BODY><BODY>

<P>Testo di un paragrafo</P><P>Testo di un paragrafo</P>

</BODY></BODY>

</HTML></HTML>

Tag strutturali di base: HTML, HEAD e BODYTag strutturali di base: HTML, HEAD e BODY

4

Un primo esempioUn primo esempio

<HTML><HTML><HEAD><HEAD>

<TITLE><TITLE>Il titolo del documentoIl titolo del documento</TITLE></TITLE></HEAD></HEAD><BODY><BODY>

<h1><h1>Natale 2007Natale 2007</h1></h1><p><p>

Il corpo del documento: contiene tutto cio` che il Il corpo del documento: contiene tutto cio` che il browser visualizzera`browser visualizzera`</p></p>

</BODY></BODY></HTML> </HTML>

1. Scrivere questo in un file di testo2. Salvarlo come testo e con estensione html3. Visualizzarlo con il browser

5

Titoli e paragrafiTitoli e paragrafi

• Titoli di diverso livello (fino a 6)Titoli di diverso livello (fino a 6)<h1>Un titolo di primo livello</h1>

<h2>Un titolo di secondo livello</h2><h3>Un titolo di terzo livello</h3>

<h4>Un titolo di quarto livello</h4>

<h2>Un altro titolo di secondo livello</h2>

• ParagrafiParagrafi– <p>Questo è un primo paragrafo di testo</p>– <p>Questo è un secondo paragrafo di testo un

po’ piu` lungo del primo</p>

6

Enfasi e grassettoEnfasi e grassetto

EnfasiEnfasi

Questo e` molto <em>interessante</em>!Questo e` molto <em>interessante</em>!

Diverso da italico o grassetto che sono Diverso da italico o grassetto che sono annotazioni stilisticheannotazioni stilisticheQuesto e` molto <i>interessante</i>!

Questo e` molto <b>interessante</b>!

7

Le immaginiLe immagini

– <img src=“micio.jpg“/>– <img src="micio.gif" width="278" height="278"

alt="il mio gatto preferito"/>– <img src="micio.gif" width="150" height="278"

alt="il mio gatto preferito"/>– <img src="micio.gif" width="150" height="150"

alt="il mio gatto preferito"/>

• Come si catturano dal Web?Come si catturano dal Web?

8

I collegamenti (link)I collegamenti (link)

• Per i collegamenti si usa il tag <a> con attributo Per i collegamenti si usa il tag <a> con attributo href il cui valore è l’URL della pagina che href il cui valore è l’URL della pagina che vogliamo collegare.vogliamo collegare. <a href="pagina.html">Pagina collegata</a>

• Il testo tra <a> e </a> è il testo del collegamento Il testo tra <a> e </a> è il testo del collegamento che sarà visualizzato in blù e sottolineato dai che sarà visualizzato in blù e sottolineato dai browser. browser.

• Link assoluti e relativi:Link assoluti e relativi:<a href="http://www.w3.org/">W3C</a><a href="/index.html">Home</a><a href="http://di.univaq.it/"><img src=“img/logo.gif"></a>

9

Liste numerate e nonListe numerate e non

<ul><ul><li>il primo elemento della lista</li><li>il secondo elemento</li><li>il terzo elemento</li>

</ul></ul>

<ol><ol><li>il primo elemento della lista</li><li>il secondo elemento</li><li>il terzo elemento</li>

</ol></ol>

10

Come andare a capo e introdurre spaziCome andare a capo e introdurre spazi

• Gli spazi e gli “a capo” nel file non Gli spazi e gli “a capo” nel file non servonoservono– Per andare a capo si usa <br/>– Per introdurre spazi si usa il carattere speciale

(spazio non "interrompibile").

• EsempiEsempi– Mario Rossi<br/>– Dipartimento di Informatica<br/>– Coppito 2<br/>

– La bevanda più usata nel mondo e` la Coca Cola.

11

TabelleTabelle

<table border="1“><table border="1“><tr><th>Anno</th><th>Vendite</th></tr>

<tr><td>2000</td><td>18M</td></tr>

<tr><td>2001</td><td>25M</td></tr>

<tr><td>2002</td><td>36M</td></tr>

</table> </table>

Luigi Vetrano

Sistemi di numerazioneSistemi di numerazione

Binario e EsadecimaleBinario e Esadecimale

13

Sistema decimale

• Sistema utilizzato dall’uomo per fare i calcoli:– un numero può assumere 10 valori compresi tra 0 e 9– a seconda della posizione il numero assume un peso

differente e viene moltiplicato per potenze di 10 crescenti, partendo dalla prima posizione a destra:

• 1.a posiz. il numero viene moltiplicato per 1 (100)



ecc.

– esempio: 357

3x100 + 5x10 + 7x1

14

Sistema binario

• Sistema impiegato dai computer e vari tipi di apparecchiature per fare i calcoli:– il bit può assumere 2 valori: 0 e 1– a seconda della posizione il bit assume un peso differente e

viene moltiplicato per potenze di 2 crescenti, partendo dalla prima posizione a destra:

– 1a posiz. il numero viene moltiplicato per 1 (20)– 2a posiz. il numero viene moltiplicato per 2 (21)– 3a posiz. il numero viene moltiplicato per 4 (22)

ecc.– esempio: 101

1x4 + 0x2 + 1x1 = 4+0+1 = 5

15

Pesi BinariPesi Binari

16

Calcolo di un valoreCalcolo di un valore

32768 + 1024 + 8 + 1 = 33801VALORE :

8 4 0 90x

= 0x8409

17

Il byte

• Rappresenta l’insieme di 8 bit– può contenere valori

compresi tra 0 e 255

18

Sequenza di byte

• Il byte più significativo è il primo a sinistra• Il byte meno significativo è l’ultimo a destra

19

Funzioni logiche di base: NOT

• La funzione NOT inverte il valore del bit d’uscita rispetto a quello d’ingresso, ovvero ne fa il complemento

20

Funzioni logiche di base: AND

• La condizione di avere 1 in uscita è vera soltanto quando tutti gli ingressi sono a 1

21

Funzioni logiche di base: OR

• La condizione di avere 1 in uscita è vera quando un o più ingressi sono a 1

22

Il complemento

• Fare il complemento a di un numero binario significa invertire il valore di tutti i bit

23

Rappresentazione esadecimale

• Permette di rappresentare valori binari elevati senza dover scrivere lunghe sequenze binarie (0100 1101 1110 0111)

• Si raggruppano sequenze di 4 bit e si scrive il valore in esse contenute (4 D E 7)

• Una sequenza di 4 bit può assumere valori compresi tra 0 e 15– per rappresentare il valore di una sequenza di 4

bit con una sola cifra dopo il numero 9 si usano le lettere: A, B, C, D, E, F

• Il computer al suo interno lavora comunque solo con sequenze binarie

24

Rappresentazione esadecimale

25

The bitwise operators of CThe bitwise operators of C

• Il linguaggio C non ha operatori per operazioni Il linguaggio C non ha operatori per operazioni sui bit. sui bit. – AND operation is represented by the binary & operator.– OR operation is represented by the binary | operator. – XOR operation is represetned by the binary ^ operator.– NOT operation is represented by the unary ~ operator.

• The shift operations are performed by C’s << and The shift operations are performed by C’s << and >> binary operators. The << operator performs >> binary operators. The << operator performs left shifts and the >> operator performs right left shifts and the >> operator performs right shifts.shifts.

26

Le operazioni binarie and, or e xorLe operazioni binarie and, or e xor

Quando un’operazione sui bit viene applicata a numeri interi, l’operazione viene svolta sui bit corrispondenti.

xx yyANDAND OROR XORXOR

x&yx&y x|yx|y x^yx^y

00 00 00 00 00

00 11 00 11 11

11 00 00 11 11

11 11 11 11 00

xxComplementoComplemento~x~x

00 1111 00

27

Esempio : 46 & 13Esempio : 46 & 13

• Per prima cosa convertire in binario entrambi i valori:

4610 = 00000000001011102

1310 = 00000000000011012

0000000000101110

& 0000000000001101

0000000000001100 = 1210

28

Bit Operations: EsempioBit Operations: Esempio

xx 00 00 11 00 00 11 00 11 3737

yy 11 11 11 11 00 11 11 00 246246

x&yx&y 00 00 11 00 00 11 00 00 3636

x|yx|y 11 11 11 11 00 11 11 11 247247

x^yx^y 11 11 00 11 00 00 11 11 211211

~x~x 11 11 00 11 11 00 11 00 218218

29

Operatore OR ‘Operatore OR ‘|’

• A volte si vede l’operatore | usato per combinare due schemi di bit.

• esempio– Font.BOLD ha il valore 1, Font.ITALIC ha il

valore 2. – La combinazione Font.BOLD | Font.ITALIC ha

impostati a 1 sia il bit per il grassetto sia quello per il corsivo:

0000000000000001 Font.BOLD| 0000000000000010 Font.ITALIC

0000000000000011 = 310

• Warning: Non confondete gli operatori per i bit & e | con gli operatori && e ||. Questi ultimi operano soltanto su valori di tipo boolean, e non sui bit di numeri.

30

Bit Operators vs Logical OperatorsBit Operators vs Logical Operators

• Logical operations:Logical operations:37 && 246 → 1 (T)37 || 246 → 1 (T)! 37 → 0 (F)

• Bit operations:Bit operations:37 & 246 → 3637 | 246 → 247~ 37 → 218

31

Masking and SettingMasking and Setting

xx bb77 bb66 bb55 bb44 bb33 bb22 bb11 bb00

2828 00 00 00 11 11 11 00 00

x&28x&28 00 00 00 bb44 bb33 bb22 00 00

227227 11 11 11 00 00 00 11 11

x|227x|227 11 11 11 bb44 bb33 bb22 11 11

32

operazioni di scorrimentooperazioni di scorrimento

• Oltre alle operazioni che operano su singoli bit, esistono Oltre alle operazioni che operano su singoli bit, esistono anche tre operazioni di scorrimento che prendono lo anche tre operazioni di scorrimento che prendono lo schema di bit di un numero e lo spostano a sinistra o a schema di bit di un numero e lo spostano a sinistra o a destra di un certo numero di posizioni. destra di un certo numero di posizioni.

• Esistono tre operazioni di scorrimento: scorrimento a Esistono tre operazioni di scorrimento: scorrimento a sinistra (<<), scorrimento aritmetico a destra (>>) e sinistra (<<), scorrimento aritmetico a destra (>>) e scorrimento a destra bit a bit (>>>).scorrimento a destra bit a bit (>>>).

• Lo scorrimento a sinistra sposta tutti i bit verso sinistra, Lo scorrimento a sinistra sposta tutti i bit verso sinistra, inserendo zeri nei bit meno significativi. Lo spostamento a inserendo zeri nei bit meno significativi. Lo spostamento a sinistra di n bit fornisce lo stesso risultato di una sinistra di n bit fornisce lo stesso risultato di una moltiplicazione per 2n. moltiplicazione per 2n.

• Lo scorrimento aritmetico verso destra sposta tutti i bit a Lo scorrimento aritmetico verso destra sposta tutti i bit a destra, propagando il bit di segno: quindi, il risultato è destra, propagando il bit di segno: quindi, il risultato è uguale a quello della divisione intera per 2n, sia per valori uguale a quello della divisione intera per 2n, sia per valori positivi che per valori negativi. positivi che per valori negativi.

• Infine, lo scorrimento a destra bit a bit sposta tutti i bit a Infine, lo scorrimento a destra bit a bit sposta tutti i bit a destra, inserendo zeri nei bit più significativi (osservate la destra, inserendo zeri nei bit più significativi (osservate la prossima slide).prossima slide).

33

ScorrimentoScorrimento

Scorrimento a sx (<<) Scorrimento aritm. a dx (>>)

Scorrimento bit-a-bit a dx (>>>) Nota: Il ‘C’ ha solo

le prime due mentre

Java le ha tutte e tre

34

Set e CheckSet e Check

1 << n• fornisce uno schema di bit in cui il bit n-esimo vale 1

(contando le posizioni a partire dalla posizione 0 del bit meno significativo).

• Per impostare a 1 il bit n-esimo di un numero, eseguite l’operazione

x = x | 1 << n• Per controllare se il bit n-esimo di un numero vale 1,

eseguite la verifica

if ((x & 1 << n) != 0) ...– Notate che le parentesi attorno all’operatore & sono

necessarie, perché ha una precedenza minore degli operatori relazionali.

35

Shift OperationsShift Operations

• Shift operators move bit patterns either left or rightShift operators move bit patterns either left or right– 1 bit left: multiply by 2

– 1 bit right: divide by 2

xx 00 00 11 00 00 11 00 11 3737

x<<1x<<1

x<<2x<<2

x<<3x<<3

x>>1x>>1

x>>2x>>2

x>>3x>>3

36

Shift OperationsShift Operations

• Shift operators move bit patterns either left or rightShift operators move bit patterns either left or right– 1 bit left: multiply by 2

– 1 bit right: divide by 2

xx 00 00 11 00 00 11 00 11 3737

x<<1x<<1 00 11 00 00 11 00 11 00 7474

x<<2x<<2 11 00 00 11 00 11 00 00 148148

x<<3x<<3 00 00 11 00 11 00 00 00 4040

x>>1x>>1 00 00 00 11 00 00 11 00 1818

x>>2x>>2 00 00 00 00 11 00 00 11 99

x>>3x>>3 00 00 00 00 00 11 00 00 44

37

Bit manipulation in CBit manipulation in C

/*/*

** Macro per la manipolazione dei bits in un ‘data type’.** Macro per la manipolazione dei bits in un ‘data type’.

*/*/

#define ToBOOL(x) (!(!(x)))#define ToBOOL(x) (!(!(x)))

#define BitSet(arg,posn) ((arg) | (1L << (posn)))#define BitSet(arg,posn) ((arg) | (1L << (posn)))

#define BitClr(arg,posn) ((arg) & ~(1L << (posn)))#define BitClr(arg,posn) ((arg) & ~(1L << (posn)))

#define BitFlp(arg,posn) ((arg) ^ (1L << (posn)))#define BitFlp(arg,posn) ((arg) ^ (1L << (posn)))

#define BitTst(arg,posn) ToBOOL((arg) & (1L << (posn)))#define BitTst(arg,posn) ToBOOL((arg) & (1L << (posn)))

Nota: Excerpt from ‘C-Snippets’

38

Esempio di codice C che fa uso Esempio di codice C che fa uso operatorioperatori

short int s ; short int s ; // assume that short int is // assume that short int is 16−bit 16−bit

short unsigned u;short unsigned u;

s = −1; s = −1; // s = 0xFFFF (2’s complement) // s = 0xFFFF (2’s complement)

u = 100; u = 100; // u = 0x0064 // u = 0x0064

u = u | 0x0100; u = u | 0x0100; // u = 0x0164 // u = 0x0164

s = s & 0xFFF0; s = s & 0xFFF0; // s = 0xFFF0 // s = 0xFFF0

s = s ^ u;s = s ^ u; // s = 0xFE94 // s = 0xFE94

u = u << 3; u = u << 3; // u = 0x0B20 (logical shift) // u = 0x0B20 (logical shift)

s = s >> 2; s = s >> 2; // s = 0xFFA5 (arithmetic shift)// s = 0xFFA5 (arithmetic shift)

39

Network byte orderNetwork byte order

Il TCP/IP memorizza gli interi in notazione Il TCP/IP memorizza gli interi in notazione big big endianendian ( (network byte ordernetwork byte order) indipendentemente ) indipendentemente dall’architettura degli hosts. dall’architettura degli hosts.

Fortunatamente esistono nel TCP/IP delle librerie C Fortunatamente esistono nel TCP/IP delle librerie C dove ci sono funzioni che gestiscono il problema dove ci sono funzioni che gestiscono il problema dell’endianness: dell’endianness:

– Esempio:• htonl() converte una double word (o long

integer) dal formato host a quello network. • ntohl() esegue la trasformazione opposta.• Analogamente esistono: ntohs e htons per gli

short

40

Come Determinare l’EndiannessCome Determinare l’Endianness

////// // Si suppone che sizeof (short) = 2Si suppone che sizeof (short) = 2////#include<stdio.h>#include<stdio.h>

int main()int main(){{unsigned short word = 0x1234; unsigned short word = 0x1234; unsigned char p = (unsigned char ) word;unsigned char p = (unsigned char ) word;

if ( p == 0x12 )if ( p == 0x12 )printf ("0x%x -- Big Endian Machine\n",p);printf ("0x%x -- Big Endian Machine\n",p);

elseelseprintf ("0x%x -- Little Endian Machine\n",p);printf ("0x%x -- Little Endian Machine\n",p);

return 0;return 0;}}

41

Lunghezza passwordLunghezza password

Lower Case (26 letters)

Uppercase, Lower, Digits (62 chars)

Uppercase, Lower, Digits, Punctuation (65 chars)

Length = 5 characters

19 minutes 1 day 8 days


18 hours 65 days 2 years


9 days 11 years 200 years


241 days 692 years 19,000 years


17 years 42,000 years1.8 million years (STRONG)

Documents

Luigi Vetrano Corso di Reti di Calcolatori Slides di completamento per i problemi più comuni riscontrati durante il corso