diff --git a/TPSI/tamaddon_sam/CSS/tamaddon_esercizio_css_45.css b/TPSI/tamaddon_sam/CSS/tamaddon_esercizio_css_45.css new file mode 100644 index 00000000..4891ce52 --- /dev/null +++ b/TPSI/tamaddon_sam/CSS/tamaddon_esercizio_css_45.css @@ -0,0 +1,33 @@ +body { + font-family: "Segoe UI", sans-serif; +} + +.contenitore { + position: absolute; + left: 50%; + top: 50%; + transform: translate(-50%, -50%); + display: flex; + width: 70%; + padding: 12px; + border: 2px solid #444; + border-radius: 6px; + flex-direction: row; + align-items: stretch; + gap: 15px; + background-color: #f0f0f0; + box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1); +} + +.riquadro { + flex: 1; + background-color: #3a5f8a; + border: 2px solid #84c1d9; + border-radius: 12px; + padding: 14px; + color: #ffffff; + font-size: 1.3em; + line-height: 1.7; + box-sizing: border-box; + word-wrap: break-word; +} \ No newline at end of file diff --git a/TPSI/tamaddon_sam/CSS/tamaddon_esercizio_css_45.html b/TPSI/tamaddon_sam/CSS/tamaddon_esercizio_css_45.html new file mode 100644 index 00000000..8488965f --- /dev/null +++ b/TPSI/tamaddon_sam/CSS/tamaddon_esercizio_css_45.html @@ -0,0 +1,19 @@ + + + + + + + Esercizio CSS 45 + + +
+
Sono piccolo
+
Ho più contenuto rispetto all'elemento molto piccolo.
+
+ Ho un sacco di contenuti. Talmente tanti che non so dove andranno a finire tutti. + Per fortuna CSS è abbastanza bravo a gestire situazioni in cui ci sono più parole del previsto! +
+
+ + \ No newline at end of file diff --git a/TPSI/tamaddon_sam/CSS/tamaddon_esercizio_css_46.css b/TPSI/tamaddon_sam/CSS/tamaddon_esercizio_css_46.css new file mode 100644 index 00000000..0fc0a450 --- /dev/null +++ b/TPSI/tamaddon_sam/CSS/tamaddon_esercizio_css_46.css @@ -0,0 +1,27 @@ +body, html { + height: 100%; + margin: 0; + padding: 0; +} + +.contenitore { + display: flex; + justify-content: center; + align-items: center; + height: 300px; + width: 400px; + margin: 50px auto; + border: 1.5px solid #67a8c7; + border-radius: 6px; + box-sizing: border-box; +} + +.pulsante { + padding: 10px 20px; + background-color: #4b77b9; + color: white; + border: none; + font-family: sans-serif; + font-size: 14px; + cursor: pointer; +} \ No newline at end of file diff --git a/TPSI/tamaddon_sam/CSS/tamaddon_esercizio_css_46.html b/TPSI/tamaddon_sam/CSS/tamaddon_esercizio_css_46.html new file mode 100644 index 00000000..85036413 --- /dev/null +++ b/TPSI/tamaddon_sam/CSS/tamaddon_esercizio_css_46.html @@ -0,0 +1,14 @@ + + + + + + Esercizio CSS 46 + + + +
+ +
+ + \ No newline at end of file diff --git a/TPSI/tamaddon_sam/CSS/tamaddon_esercizio_css_47.css b/TPSI/tamaddon_sam/CSS/tamaddon_esercizio_css_47.css new file mode 100644 index 00000000..108194f5 --- /dev/null +++ b/TPSI/tamaddon_sam/CSS/tamaddon_esercizio_css_47.css @@ -0,0 +1,30 @@ +body { + margin: 0; + font-family: sans-serif; + background-color: #fff; + display: flex; + justify-content: center; + align-items: center; + height: 100vh; +} + +.contenitore { + display: flex; + flex-wrap: wrap; + width: 400px; + justify-content: center; + border: 1px solid #ccc; + padding: 20px; + border-radius: 6px; + background-color: white; +} + +.elemento { + background-color: #4b77b9; + color: white; + padding: 10px 20px; + margin: 5px; + border-radius: 10px; + text-align: center; + font-size: 14px; +} \ No newline at end of file diff --git a/TPSI/tamaddon_sam/CSS/tamaddon_esercizio_css_47.html b/TPSI/tamaddon_sam/CSS/tamaddon_esercizio_css_47.html new file mode 100644 index 00000000..f7874e70 --- /dev/null +++ b/TPSI/tamaddon_sam/CSS/tamaddon_esercizio_css_47.html @@ -0,0 +1,25 @@ + + + + + + Esercizio CSS 47 + + + +
+
Rapa
+
Cime di rapa
+
Achillea
+
Fagiolo riso
+ +
Navone
+
Indivia
+
Cavolfiore
+ +
Lattuga di mare
+
Cavolo rapa
+
Amaranto
+
+ + \ No newline at end of file diff --git a/TPSI/tamaddon_sam/CSS/tamaddon_esercizio_css_49.css b/TPSI/tamaddon_sam/CSS/tamaddon_esercizio_css_49.css new file mode 100644 index 00000000..b13c0507 --- /dev/null +++ b/TPSI/tamaddon_sam/CSS/tamaddon_esercizio_css_49.css @@ -0,0 +1,20 @@ +.grid-container { + display: grid; + grid-template-columns: 25% 25% 25% 25%; + border: 0px solid black; + padding: 20px; + height: 500px; + width: 500px; + justify-content: center; + justify-self: center; +} + + .grid-item { + border: 1px solid black; + text-align: center; + background-color: orange; + } + h1 + { + text-align: center; + } \ No newline at end of file diff --git a/TPSI/tamaddon_sam/CSS/tamaddon_esercizio_css_49.html b/TPSI/tamaddon_sam/CSS/tamaddon_esercizio_css_49.html new file mode 100644 index 00000000..7776e90b --- /dev/null +++ b/TPSI/tamaddon_sam/CSS/tamaddon_esercizio_css_49.html @@ -0,0 +1,30 @@ + + + + + + + Gioco del 15 + + +

Gioco del 15

+
+
1
+
2
+
3
+
4
+
5
+
6
+
7
+
8
+
9
+
10
+
11
+
12
+
13
+
14
+
15
+
+
+ + diff --git a/TPSI/tamaddon_sam/CSS/tamaddon_esercizio_css_50.css b/TPSI/tamaddon_sam/CSS/tamaddon_esercizio_css_50.css new file mode 100644 index 00000000..4af3d84a --- /dev/null +++ b/TPSI/tamaddon_sam/CSS/tamaddon_esercizio_css_50.css @@ -0,0 +1,12 @@ +.grid2 div { + background: #333; + color: white; + display: flex; + justify-content: center; + } +.grid2 { + display: grid; + grid-template-columns: repeat(3, 100px); + grid-template-rows: repeat(2, 80px); + gap: 10px; + } diff --git a/TPSI/tamaddon_sam/CSS/tamaddon_esercizio_css_50.html b/TPSI/tamaddon_sam/CSS/tamaddon_esercizio_css_50.html new file mode 100644 index 00000000..f2983a1d --- /dev/null +++ b/TPSI/tamaddon_sam/CSS/tamaddon_esercizio_css_50.html @@ -0,0 +1,15 @@ +!DOCTYPE html> + + + + css_50 + + + + +
+
A
B
C
+
D
E
F
+
+ + \ No newline at end of file diff --git a/TPSI/tamaddon_sam/CSS/tamaddon_esercizio_css_51.css b/TPSI/tamaddon_sam/CSS/tamaddon_esercizio_css_51.css new file mode 100644 index 00000000..0e3ad6d2 --- /dev/null +++ b/TPSI/tamaddon_sam/CSS/tamaddon_esercizio_css_51.css @@ -0,0 +1,22 @@ +.a { + grid-column: 1 / 3; + } + .item { + background-color: #646361; + color: white; + padding: 10px; + border-radius: 6px; + align-content: center; +} + + .b { + grid-column-start: 3; + grid-row: 1 / 3; + } + .grid-container { + display: grid; + grid-template-columns: 1fr 1fr 100px; + grid-template-rows: 60px 60px; + gap: 10px; + } + \ No newline at end of file diff --git a/TPSI/tamaddon_sam/CSS/tamaddon_esercizio_css_51.html b/TPSI/tamaddon_sam/CSS/tamaddon_esercizio_css_51.html new file mode 100644 index 00000000..72a57e25 --- /dev/null +++ b/TPSI/tamaddon_sam/CSS/tamaddon_esercizio_css_51.html @@ -0,0 +1,17 @@ + + + + + + + es 51 + + +
+
A
+
B
+
C
+
D
+
+ + \ No newline at end of file diff --git a/TPSI/tamaddon_sam/CSS/tamaddon_esercizio_css_52.css b/TPSI/tamaddon_sam/CSS/tamaddon_esercizio_css_52.css new file mode 100644 index 00000000..890280d0 --- /dev/null +++ b/TPSI/tamaddon_sam/CSS/tamaddon_esercizio_css_52.css @@ -0,0 +1,26 @@ +.grid4 { + display: grid; + grid-template-columns: 1fr 2fr; + grid-auto-rows: 60px; + gap: 10px; + } + .grid4 div { + background: #333; + color: white; + display: flex; + justify-content: center; + align-items: center; + } + .e { grid-column: 1 / 3; } + .a { + grid-column: 1 / 3; + } + + .b { + grid-column: 3 / 5; + } + + .d { + grid-row-start: 2; + grid-column: 2 / 5; + } \ No newline at end of file diff --git a/TPSI/tamaddon_sam/CSS/tamaddon_esercizio_css_52.html b/TPSI/tamaddon_sam/CSS/tamaddon_esercizio_css_52.html new file mode 100644 index 00000000..b7774292 --- /dev/null +++ b/TPSI/tamaddon_sam/CSS/tamaddon_esercizio_css_52.html @@ -0,0 +1,18 @@ + + + + + + + es 52 + + +
+
A
+
B
+
C
+
D
+
E
+
+ + \ No newline at end of file diff --git a/TPSI/tamaddon_sam/CSS/tamaddon_esercizio_css_53.css b/TPSI/tamaddon_sam/CSS/tamaddon_esercizio_css_53.css new file mode 100644 index 00000000..ca11794e --- /dev/null +++ b/TPSI/tamaddon_sam/CSS/tamaddon_esercizio_css_53.css @@ -0,0 +1,26 @@ + + .header, .footer { + grid-column: 1 / 4; + background: #999; + } + + .content { + background: #333; color: white; + } + .sidebar2 { + background: #ccc; + } + .grid5 > div { + padding: 10px; + border-radius: 5px; + } + .sidebar { + background: #333; color: white; + } + .grid5 { + display: grid; + grid-template-columns: 1fr 2fr 1fr; + grid-template-rows: auto auto auto; + gap: 10px; + background: #eee; + } \ No newline at end of file diff --git a/TPSI/tamaddon_sam/CSS/tamaddon_esercizio_css_53.html b/TPSI/tamaddon_sam/CSS/tamaddon_esercizio_css_53.html new file mode 100644 index 00000000..15116f64 --- /dev/null +++ b/TPSI/tamaddon_sam/CSS/tamaddon_esercizio_css_53.html @@ -0,0 +1,18 @@ + + + + + + + es 53 + + +
+
Header
+
Sidebar
+
Content
More content than we had before so this column is now quite tall.
+
Sidebar 2
+
Footer
+
+ + \ No newline at end of file diff --git a/TPSI/tamaddon_sam/CSS/tamaddon_esercizio_css_54.css b/TPSI/tamaddon_sam/CSS/tamaddon_esercizio_css_54.css new file mode 100644 index 00000000..fde39d2c --- /dev/null +++ b/TPSI/tamaddon_sam/CSS/tamaddon_esercizio_css_54.css @@ -0,0 +1,28 @@ +#grid6 { + display: grid; + grid-template-columns: 1fr 2fr; + grid-template-rows: auto auto auto; + gap: 10px; + background: #eee; + } + .grid6 > div { + padding: 10px; + border-radius: 5px; + } + .header { + grid-column: 2 / 3; + background: #999; + } + .sidebar { + grid-row: 2 / 3; + background: #333; color: white; + } + .content { + grid-column: 2 / 3; + grid-row: 2 / 3; + background: #333; color: white; + } + .footer { + grid-column: 1 / 3; + background: #999; + } \ No newline at end of file diff --git a/TPSI/tamaddon_sam/CSS/tamaddon_esercizio_css_54.html b/TPSI/tamaddon_sam/CSS/tamaddon_esercizio_css_54.html new file mode 100644 index 00000000..758be0f5 --- /dev/null +++ b/TPSI/tamaddon_sam/CSS/tamaddon_esercizio_css_54.html @@ -0,0 +1,18 @@ +@@ -0,0 +1,17 @@ + + + + + + + es 54 + + +
+
Header
+
Sidebar
+
Content
More content than we had before so this column is now quite tall.
+
Footer
+
+ + \ No newline at end of file