diff --git a/TPSI/prevedi_daniele/Esercitazioni_CSS/htmls/prevedi_esercizio_css_45.html b/TPSI/prevedi_daniele/Esercitazioni_CSS/htmls/prevedi_esercizio_css_45.html new file mode 100644 index 00000000..216f5607 --- /dev/null +++ b/TPSI/prevedi_daniele/Esercitazioni_CSS/htmls/prevedi_esercizio_css_45.html @@ -0,0 +1,16 @@ + + + + + + Document + + + +
+
I am small
+
I have more content than the very small item.
+
I have lots of content.
So much content that I don't know where it is all going to go. I'm glad that CSS is pretty good at dealing with situations where we end up with more words than expected!
+
+ + \ No newline at end of file diff --git a/TPSI/prevedi_daniele/Esercitazioni_CSS/htmls/prevedi_esercizio_css_46.html b/TPSI/prevedi_daniele/Esercitazioni_CSS/htmls/prevedi_esercizio_css_46.html new file mode 100644 index 00000000..b09e8162 --- /dev/null +++ b/TPSI/prevedi_daniele/Esercitazioni_CSS/htmls/prevedi_esercizio_css_46.html @@ -0,0 +1,14 @@ + + + + + + Document + + + +
+
Center me.
+
+ + \ No newline at end of file diff --git a/TPSI/prevedi_daniele/Esercitazioni_CSS/htmls/prevedi_esercizio_css_47.html b/TPSI/prevedi_daniele/Esercitazioni_CSS/htmls/prevedi_esercizio_css_47.html new file mode 100644 index 00000000..e76a9d21 --- /dev/null +++ b/TPSI/prevedi_daniele/Esercitazioni_CSS/htmls/prevedi_esercizio_css_47.html @@ -0,0 +1,23 @@ + + + + + + Document + + + +
+
Turnip
+
greens
+
yarrow
+
riceban
+
rutabaga
+
endive
+
cauliflower
+
sea lettuce
+
kohlrabi
+
amaranth
+
+ + \ No newline at end of file diff --git a/TPSI/prevedi_daniele/Esercitazioni_CSS/htmls/prevedi_esercizio_css_48.html b/TPSI/prevedi_daniele/Esercitazioni_CSS/htmls/prevedi_esercizio_css_48.html new file mode 100644 index 00000000..6837a62a --- /dev/null +++ b/TPSI/prevedi_daniele/Esercitazioni_CSS/htmls/prevedi_esercizio_css_48.html @@ -0,0 +1,29 @@ + + + + + + Document + + + +
Il gioco del 15
+
+
1
+
2
+
3
+
4
+
5
+
6
+
7
+
8
+
9
+
10
+
11
+
12
+
13
+
14
+
15
+
+ + \ No newline at end of file diff --git a/TPSI/prevedi_daniele/Esercitazioni_CSS/htmls/prevedi_esercizio_css_49.html b/TPSI/prevedi_daniele/Esercitazioni_CSS/htmls/prevedi_esercizio_css_49.html new file mode 100644 index 00000000..179f8b66 --- /dev/null +++ b/TPSI/prevedi_daniele/Esercitazioni_CSS/htmls/prevedi_esercizio_css_49.html @@ -0,0 +1,37 @@ + + + + + + Document + + + +
+
1
+
1
+
1
+
1
+
1
+
1
+
1
+
1
+
1
+
1
+
1
+
1
+
1
+
1
+
1
+
1
+
1
+
1
+
1
+
1
+
1
+
1
+
1
+
1
+
+ + \ No newline at end of file diff --git a/TPSI/prevedi_daniele/Esercitazioni_CSS/htmls/prevedi_esercizio_css_50.html b/TPSI/prevedi_daniele/Esercitazioni_CSS/htmls/prevedi_esercizio_css_50.html new file mode 100644 index 00000000..016504fa --- /dev/null +++ b/TPSI/prevedi_daniele/Esercitazioni_CSS/htmls/prevedi_esercizio_css_50.html @@ -0,0 +1,19 @@ + + + + + + Document + + + +
+
A
+
B
+
C
+
D
+
E
+
F
+
+ + \ No newline at end of file diff --git a/TPSI/prevedi_daniele/Esercitazioni_CSS/htmls/prevedi_esercizio_css_51.html b/TPSI/prevedi_daniele/Esercitazioni_CSS/htmls/prevedi_esercizio_css_51.html new file mode 100644 index 00000000..2ac2db74 --- /dev/null +++ b/TPSI/prevedi_daniele/Esercitazioni_CSS/htmls/prevedi_esercizio_css_51.html @@ -0,0 +1,17 @@ + + + + + + Document + + + +
+
A
+
B
+
C
+
D
+
+ + \ No newline at end of file diff --git a/TPSI/prevedi_daniele/Esercitazioni_CSS/htmls/prevedi_esercizio_css_52.html b/TPSI/prevedi_daniele/Esercitazioni_CSS/htmls/prevedi_esercizio_css_52.html new file mode 100644 index 00000000..b96fdd99 --- /dev/null +++ b/TPSI/prevedi_daniele/Esercitazioni_CSS/htmls/prevedi_esercizio_css_52.html @@ -0,0 +1,18 @@ + + + + + + Document + + + +
+
A
+
B
+
C
+
D
+
E
+
+ + \ No newline at end of file diff --git a/TPSI/prevedi_daniele/Esercitazioni_CSS/htmls/prevedi_esercizio_css_53.html b/TPSI/prevedi_daniele/Esercitazioni_CSS/htmls/prevedi_esercizio_css_53.html new file mode 100644 index 00000000..1955b1e9 --- /dev/null +++ b/TPSI/prevedi_daniele/Esercitazioni_CSS/htmls/prevedi_esercizio_css_53.html @@ -0,0 +1,18 @@ + + + + + + Document + + + +
+
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/prevedi_daniele/Esercitazioni_CSS/htmls/prevedi_esercizio_css_54.html b/TPSI/prevedi_daniele/Esercitazioni_CSS/htmls/prevedi_esercizio_css_54.html new file mode 100644 index 00000000..f3608746 --- /dev/null +++ b/TPSI/prevedi_daniele/Esercitazioni_CSS/htmls/prevedi_esercizio_css_54.html @@ -0,0 +1,17 @@ + + + + + + Document + + + +
+
Header
+
Sidebar
+
Content
More content than we had before so this column is now quite tall.
+
Footer
+
+ + \ No newline at end of file diff --git a/TPSI/prevedi_daniele/Esercitazioni_CSS/styles/prevedi_esercizio_css_45.css b/TPSI/prevedi_daniele/Esercitazioni_CSS/styles/prevedi_esercizio_css_45.css new file mode 100644 index 00000000..e2e45d46 --- /dev/null +++ b/TPSI/prevedi_daniele/Esercitazioni_CSS/styles/prevedi_esercizio_css_45.css @@ -0,0 +1,21 @@ +.container{ + display: flex; + flex-direction: row; + align-items: stretch; + justify-content: center; + width: 600px; + height: 200px; + border: 1px solid black; + padding: 15px; + border-radius: 3px; +} + +.left, .center, .right{ + padding: 10px; + background-color: #476b98; + border: 3px solid #68a7b7; + border-radius: 10px; + color: white; + width: 200px; + font-family: sans-serif; +} \ No newline at end of file diff --git a/TPSI/prevedi_daniele/Esercitazioni_CSS/styles/prevedi_esercizio_css_46.css b/TPSI/prevedi_daniele/Esercitazioni_CSS/styles/prevedi_esercizio_css_46.css new file mode 100644 index 00000000..87026f2e --- /dev/null +++ b/TPSI/prevedi_daniele/Esercitazioni_CSS/styles/prevedi_esercizio_css_46.css @@ -0,0 +1,21 @@ +.container{ + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + width: 1000px; + height: 700px; + border: 1px solid black; + padding: 15px; + border-radius: 3px; +} + +.center{ + width: 100px; + padding: 10px; + background-color: #476b98; + border: 3px solid #68a7b7; + border-radius: 10px; + color: white; + font-family: sans-serif; +} \ No newline at end of file diff --git a/TPSI/prevedi_daniele/Esercitazioni_CSS/styles/prevedi_esercizio_css_47.css b/TPSI/prevedi_daniele/Esercitazioni_CSS/styles/prevedi_esercizio_css_47.css new file mode 100644 index 00000000..c9bf9555 --- /dev/null +++ b/TPSI/prevedi_daniele/Esercitazioni_CSS/styles/prevedi_esercizio_css_47.css @@ -0,0 +1,22 @@ +.container{ + display: flex; + flex-direction: row; + flex-wrap: wrap; + justify-content: space-between; + align-items: center; + align-content: space-between; + width: 330px; + height: 200px; + border: 1px solid black; + padding: 15px; + border-radius: 3px; +} + +.box{ + padding: 10px; + background-color: #476b98; + border: 3px solid #68a7b7; + border-radius: 10px; + color: white; + font-family: sans-serif; +} \ No newline at end of file diff --git a/TPSI/prevedi_daniele/Esercitazioni_CSS/styles/prevedi_esercizio_css_48.css b/TPSI/prevedi_daniele/Esercitazioni_CSS/styles/prevedi_esercizio_css_48.css new file mode 100644 index 00000000..003bffff --- /dev/null +++ b/TPSI/prevedi_daniele/Esercitazioni_CSS/styles/prevedi_esercizio_css_48.css @@ -0,0 +1,27 @@ +.titolo{ + font-size: 2em; + font-weight: bold; + text-align: center; + margin-bottom: 5px; +} + +.container{ + display: grid; + grid-template-columns: 25% 25% 25% 25%; + grid-template-rows: 25% 25% 25% 25%; + border: 5px solid black; + width: 20vw; + height: 20vw; + margin: auto; + background-color: #ff8c00; +} + +.grid-item{ + display: flex; + justify-content: center; + align-items: center; + border: 2px solid black; + padding: 20px; + font-weight: bold; + font-size: 1.25em; +} \ No newline at end of file diff --git a/TPSI/prevedi_daniele/Esercitazioni_CSS/styles/prevedi_esercizio_css_49.css b/TPSI/prevedi_daniele/Esercitazioni_CSS/styles/prevedi_esercizio_css_49.css new file mode 100644 index 00000000..e83f32a8 --- /dev/null +++ b/TPSI/prevedi_daniele/Esercitazioni_CSS/styles/prevedi_esercizio_css_49.css @@ -0,0 +1,36 @@ +.container{ + margin: auto; + width: 50vw; + height: 50vh; + display: grid; + grid-template-columns: repeat(6, 1fr); + grid-template-rows: repeat(6, 1fr); +} + +.item{ + padding: 10px; + border: 1px solid red; + display: flex; + justify-content: center; + align-items: center; + padding: 20px; + font-weight: bold; +} + +.a{ + grid-column: 2 / 5; +} + +.b{ + grid-row: 2 / 5; +} + +.c{ + grid-column: 2 / 5; + grid-row: 2 / 5; +} + +.d{ + grid-column: 5 / 7; + grid-row: 5 / 8; +} \ No newline at end of file diff --git a/TPSI/prevedi_daniele/Esercitazioni_CSS/styles/prevedi_esercizio_css_50.css b/TPSI/prevedi_daniele/Esercitazioni_CSS/styles/prevedi_esercizio_css_50.css new file mode 100644 index 00000000..22a5d555 --- /dev/null +++ b/TPSI/prevedi_daniele/Esercitazioni_CSS/styles/prevedi_esercizio_css_50.css @@ -0,0 +1,17 @@ +.container{ + display: grid; + grid-template-columns: repeat(3, 1fr); + width: 400px; + height: 170px; + margin: auto; +} + +.item{ + background-color: #444444; + color: white; + padding: 30px; + margin: 5px; + border-radius: 10px; + font-size: 1.5em; + align-items: center; +} \ No newline at end of file diff --git a/TPSI/prevedi_daniele/Esercitazioni_CSS/styles/prevedi_esercizio_css_51.css b/TPSI/prevedi_daniele/Esercitazioni_CSS/styles/prevedi_esercizio_css_51.css new file mode 100644 index 00000000..cb0e0998 --- /dev/null +++ b/TPSI/prevedi_daniele/Esercitazioni_CSS/styles/prevedi_esercizio_css_51.css @@ -0,0 +1,25 @@ +.container{ + display: grid; + grid-template-columns: repeat(3, 1fr); + grid-template-rows: repeat(2, 1fr); + width: 400px; + height: 170px; +} + +.item{ + background-color: #444444; + color: white; + padding: 30px; + margin: 5px; + border-radius: 10px; + font-size: 1.5em; +} + +.a{ + grid-column: 1 / 3; +} + +.b{ + grid-column-start: 3; + grid-row: 1 / 3; +} \ No newline at end of file diff --git a/TPSI/prevedi_daniele/Esercitazioni_CSS/styles/prevedi_esercizio_css_52.css b/TPSI/prevedi_daniele/Esercitazioni_CSS/styles/prevedi_esercizio_css_52.css new file mode 100644 index 00000000..eed4ef0b --- /dev/null +++ b/TPSI/prevedi_daniele/Esercitazioni_CSS/styles/prevedi_esercizio_css_52.css @@ -0,0 +1,36 @@ +.container{ + display: grid; + grid-template-columns: repeat(4, 1fr); + width: 400px; + height: 170px; + margin: auto; +} + +.item{ + background-color: #444444; + color: white; + padding: 30px; + margin: 5px; + border-radius: 10px; + font-size: 1.5em; +} + +.a{ + grid-column: 1 / 3; +} + +.b{ + grid-column: 3 / 5; +} + +.c{ + grid-column: 1 / 2; +} + +.d{ + grid-column: 2 / 5; +} + +.e{ + grid-column: 1 / 5; +} \ No newline at end of file diff --git a/TPSI/prevedi_daniele/Esercitazioni_CSS/styles/prevedi_esercizio_css_53.css b/TPSI/prevedi_daniele/Esercitazioni_CSS/styles/prevedi_esercizio_css_53.css new file mode 100644 index 00000000..209b7d72 --- /dev/null +++ b/TPSI/prevedi_daniele/Esercitazioni_CSS/styles/prevedi_esercizio_css_53.css @@ -0,0 +1,40 @@ +.container{ + display: grid; + grid-template-columns: repeat(4, 1fr); + width: 400px; + height: 170px; + margin: auto; +} + +.item{ + background-color: #444444; + color: white; + padding: 7px; + margin: 5px; + border-radius: 5px; + font-size: 0.9em; +} + +.header{ + grid-column: 1 / 5; + background-color: #999999; +} + +.sidebar1{ + grid-column: 1 / 2; +} + +.content{ + grid-column: 2 / 4; +} + +.sidebar2{ + grid-column: 4 / 5; + background-color: #cccccc; + color: #444444; +} + +.footer{ + grid-column: 1 / 5; + background-color: #999999; +} \ No newline at end of file diff --git a/TPSI/prevedi_daniele/Esercitazioni_CSS/styles/prevedi_esercizio_css_54.css b/TPSI/prevedi_daniele/Esercitazioni_CSS/styles/prevedi_esercizio_css_54.css new file mode 100644 index 00000000..f07284de --- /dev/null +++ b/TPSI/prevedi_daniele/Esercitazioni_CSS/styles/prevedi_esercizio_css_54.css @@ -0,0 +1,34 @@ +.container{ + display: grid; + grid-template-columns: repeat(3, 1fr); + width: 300px; + height: 200px; + margin: auto; +} + +.item{ + background-color: #444444; + color: white; + padding: 7px; + margin: 5px; + border-radius: 5px; + font-size: 1em; +} + +.header{ + grid-column: 2 / 4; + background-color: #999999; +} + +.sidebar{ + grid-column: 1 / 2; +} + +.content{ + grid-column: 2 / 4; +} + +.footer{ + grid-column: 1 / 4; + background-color: #999999; +} \ No newline at end of file