From b292da9a82b514ef3b6eca68490bb2e30e9c6b70 Mon Sep 17 00:00:00 2001 From: Branda-Rachele Date: Wed, 7 May 2025 06:11:42 +0200 Subject: [PATCH] compiti per 07/05/25 --- .../branda_esercizio_css_49.css | 36 ++++++++++++++++++ .../branda_esercizio_css_49.html | 37 +++++++++++++++++++ .../branda_esercizio_css_50.css | 12 ++++++ .../branda_esercizio_css_50.html | 15 ++++++++ .../branda_esercizio_css_51.css | 21 +++++++++++ .../branda_esercizio_css_51.html | 17 +++++++++ .../branda_esercizio_css_52.css | 26 +++++++++++++ .../branda_esercizio_css_52.html | 18 +++++++++ .../branda_esercizio_css_53.css | 28 ++++++++++++++ .../branda_esercizio_css_53.html | 18 +++++++++ .../branda_esercizio_css_54.css | 31 ++++++++++++++++ .../branda_esercizio_css_54.html | 18 +++++++++ 12 files changed, 277 insertions(+) create mode 100644 TPSI/branda_rachele/branda_esercizio_css_49.css create mode 100644 TPSI/branda_rachele/branda_esercizio_css_49.html create mode 100644 TPSI/branda_rachele/branda_esercizio_css_50.css create mode 100644 TPSI/branda_rachele/branda_esercizio_css_50.html create mode 100644 TPSI/branda_rachele/branda_esercizio_css_51.css create mode 100644 TPSI/branda_rachele/branda_esercizio_css_51.html create mode 100644 TPSI/branda_rachele/branda_esercizio_css_52.css create mode 100644 TPSI/branda_rachele/branda_esercizio_css_52.html create mode 100644 TPSI/branda_rachele/branda_esercizio_css_53.css create mode 100644 TPSI/branda_rachele/branda_esercizio_css_53.html create mode 100644 TPSI/branda_rachele/branda_esercizio_css_54.css create mode 100644 TPSI/branda_rachele/branda_esercizio_css_54.html diff --git a/TPSI/branda_rachele/branda_esercizio_css_49.css b/TPSI/branda_rachele/branda_esercizio_css_49.css new file mode 100644 index 00000000..8c0d6d29 --- /dev/null +++ b/TPSI/branda_rachele/branda_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/branda_rachele/branda_esercizio_css_49.html b/TPSI/branda_rachele/branda_esercizio_css_49.html new file mode 100644 index 00000000..2d3e8665 --- /dev/null +++ b/TPSI/branda_rachele/branda_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/branda_rachele/branda_esercizio_css_50.css b/TPSI/branda_rachele/branda_esercizio_css_50.css new file mode 100644 index 00000000..4af3d84a --- /dev/null +++ b/TPSI/branda_rachele/branda_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/branda_rachele/branda_esercizio_css_50.html b/TPSI/branda_rachele/branda_esercizio_css_50.html new file mode 100644 index 00000000..9c7275ce --- /dev/null +++ b/TPSI/branda_rachele/branda_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/branda_rachele/branda_esercizio_css_51.css b/TPSI/branda_rachele/branda_esercizio_css_51.css new file mode 100644 index 00000000..ae388503 --- /dev/null +++ b/TPSI/branda_rachele/branda_esercizio_css_51.css @@ -0,0 +1,21 @@ +.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/branda_rachele/branda_esercizio_css_51.html b/TPSI/branda_rachele/branda_esercizio_css_51.html new file mode 100644 index 00000000..e03dfd12 --- /dev/null +++ b/TPSI/branda_rachele/branda_esercizio_css_51.html @@ -0,0 +1,17 @@ + + + + + + + es 51 + + +
+
A
+
B
+
C
+
D
+
+ + \ No newline at end of file diff --git a/TPSI/branda_rachele/branda_esercizio_css_52.css b/TPSI/branda_rachele/branda_esercizio_css_52.css new file mode 100644 index 00000000..9c21d8aa --- /dev/null +++ b/TPSI/branda_rachele/branda_esercizio_css_52.css @@ -0,0 +1,26 @@ +.e { grid-column: 1 / 3; } +.a { + grid-column: 1 / 3; +}.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; + } + + + .b { + grid-column: 3 / 5; + } + + .d { + grid-row-start: 2; + grid-column: 2 / 5; + } \ No newline at end of file diff --git a/TPSI/branda_rachele/branda_esercizio_css_52.html b/TPSI/branda_rachele/branda_esercizio_css_52.html new file mode 100644 index 00000000..f92f6a24 --- /dev/null +++ b/TPSI/branda_rachele/branda_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/branda_rachele/branda_esercizio_css_53.css b/TPSI/branda_rachele/branda_esercizio_css_53.css new file mode 100644 index 00000000..7d73bc3c --- /dev/null +++ b/TPSI/branda_rachele/branda_esercizio_css_53.css @@ -0,0 +1,28 @@ + + + .content { + background: #333; color: white; + } + .sidebar2 { + background: #ccc; + } + + .sidebar { + background: #333; color: white; + } + + .header, .footer { + grid-column: 1 / 4; + background: #999; + } + .grid5 { + display: grid; + grid-template-columns: 1fr 2fr 1fr; + grid-template-rows: auto auto auto; + gap: 10px; + background: #eee; + } + .grid5 > div { + padding: 10px; + border-radius: 5px; + } \ No newline at end of file diff --git a/TPSI/branda_rachele/branda_esercizio_css_53.html b/TPSI/branda_rachele/branda_esercizio_css_53.html new file mode 100644 index 00000000..915f8a87 --- /dev/null +++ b/TPSI/branda_rachele/branda_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/branda_rachele/branda_esercizio_css_54.css b/TPSI/branda_rachele/branda_esercizio_css_54.css new file mode 100644 index 00000000..592cdeb4 --- /dev/null +++ b/TPSI/branda_rachele/branda_esercizio_css_54.css @@ -0,0 +1,31 @@ + + .grid6 > div { + padding: 10px; + border-radius: 5px; + } + .header { + grid-column: 2 / 3; + background: #999; + } + + + .footer { + grid-column: 1 / 3; + background: #999; + } + .grid6 { + display: grid; + grid-template-columns: 1fr 2fr; + grid-template-rows: auto auto auto; + gap: 10px; + background: #eee; + } + .sidebar { + grid-row: 2 / 3; + background: #333; color: white; + } + .content { + grid-column: 2 / 3; + grid-row: 2 / 3; + background: #333; color: white; + } \ No newline at end of file diff --git a/TPSI/branda_rachele/branda_esercizio_css_54.html b/TPSI/branda_rachele/branda_esercizio_css_54.html new file mode 100644 index 00000000..2ce18c7c --- /dev/null +++ b/TPSI/branda_rachele/branda_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