Skip to content

es 44 - 47 #589

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
Busca-Matteo wants to merge 3 commits into
base: main
Choose a base branch
from
Open

es 44 - 47 #589

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
8105a48
es 44 - 47
Busca-Matteo Apr 15, 2025
da15daf
Add files via upload
Busca-Matteo Apr 30, 2025
e0e911c
es 49-54
Busca-Matteo May 6, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
23 changes: 23 additions & 0 deletions TPSI/busca_matteo/CSS/busca_esercizio_css_44.css
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,23 @@
body{
margin-left: 450px;
text-align: center;
}

#container {
border: 1px lightgray solid;
display: flex;
flex-direction: row;
justify-content: space-between;
width: 600px;
padding: 10px;
}

.item {
border-radius: 10px;
color: white;
background-color: #424c99;
border: 3px solid #636fcb;
width: 80px;
padding: 10px;
text-align:center;
}
19 changes: 19 additions & 0 deletions TPSI/busca_matteo/CSS/busca_esercizio_css_44.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,19 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="author" content="Matteo Busca" />
<meta name="description" content="esercizio 44" />
<meta name="keywords" content="reti, localhost, IPv4, loopback" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet" href="busca_esercizio_css_44.css" type="text/css" />
<title>busca_esercizio_css_44</title>
</head>
<body>
<div id="container">
<div class="item">Home</div>
<div class="item">About Us</div>
<div class="item">Our Product</div>
<div class="item">Contact Us</div>
</div>
</body>
24 changes: 24 additions & 0 deletions TPSI/busca_matteo/CSS/busca_esercizio_css_45.css
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,24 @@
body{
margin-left: 450px;
text-align: center;
}

#container {
border: 1px lightgray solid;
display: flex;
flex-direction: row;
align-items: stretch;
width: 533px;
height: 187px;
padding: 8px;
}

.item {
border-radius: 10px;
color: white;
background-color: #424c99;
border: 3px solid #636fcb;
width: 155px;
padding: 10px;
text-align: left;
}
20 changes: 20 additions & 0 deletions TPSI/busca_matteo/CSS/busca_esercizio_css_45.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,20 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="author" content="Matteo Busca" />
<meta name="description" content="esercizio 45" />
<meta name="keywords" content="reti, localhost, IPv4, loopback" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet" href="busca_esercizio_css_45.css" type="text/css" />
<title>busca_esercizio_css_45</title>
</head>
<body>
<div id="container">
<div class="item">I am small</div>
<div class="item">I have more content than the very small item.</div>
<div class="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!
</div>
</div>
</body>
</html>
25 changes: 25 additions & 0 deletions TPSI/busca_matteo/CSS/busca_esercizio_css_46.css
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,25 @@
body{
margin-left: 600px;
text-align: center;
}

#container {
border: 1px rgb(54, 55, 125) solid;
display: flex;
justify-content: space-evenly;
flex-direction: row;
align-items: center;
width: 320px;
height: 230px;
padding: 10px;
border-radius: 10px;
}

#item {
font-size: larger;
color: white;
background-color: #424c99;
width: 155px;
padding: 10px;
text-align: left;
}
17 changes: 17 additions & 0 deletions TPSI/busca_matteo/CSS/busca_esercizio_css_46.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,17 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="author" content="Matteo Busca" />
<meta name="description" content="esercizio 46" />
<meta name="keywords" content="reti, localhost, IPv4, loopback" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet" href="busca_esercizio_css_46.css" type="text/css" />
<title>busca_esercizio_css_46</title>
</head>
<body>
<div id="container">
<div id="item">Center me.</div>
</div>
</body>
</html>
27 changes: 27 additions & 0 deletions TPSI/busca_matteo/CSS/busca_esercizio_css_47.css
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,27 @@
body{
margin-left: 500px;
text-align: center;
}

#container {
text-align: justify;
border: 1px lightgray solid;
display: flex;
justify-items: stretch;
flex-wrap: wrap;
align-content: stretch;
width: 450px;
height: 180px;
padding: 20px;
border-radius: 10px;
}

.item {
color: white;
background-color: #424c99;
border: 3px solid #636fcb;
border-radius: 10px;
margin: 10px;
padding: 10px 20px;
text-align: left;
}
26 changes: 26 additions & 0 deletions TPSI/busca_matteo/CSS/busca_esercizio_css_47.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,26 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="author" content="Matteo Busca" />
<meta name="description" content="esercizio 47" />
<meta name="keywords" content="reti, localhost, IPv4, loopback" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet" href="busca_esercizio_css_47.css" type="text/css" />
<title>busca_esercizio_css_47</title>
</head>
<body>
<div id="container">
<div class="item">Turnip</div>
<div class="item">greens</div>
<div class="item">yarrow</div>
<div class="item">ricebean</div>
<div class="item">rutabaga</div>
<div class="item">endive</div>
<div class="item">cauliflower</div>
<div class="item">sea lettuce</div>
<div class="item">kohlrabi</div>
<div class="item">amaranth</div>
</div>
</body>
</html>
29 changes: 29 additions & 0 deletions TPSI/busca_matteo/CSS/busca_esercizio_css_48.css
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,29 @@
body{
display:flex;
justify-content: center;
}

.grid-container {
display: grid;
grid-template-columns: 84px 84px 84px 84px;
padding: 20px;
margin-top: 100px;
}

.grid-item {
display: flex;
background-color: orange;
border: 1px solid black;
width: 80px;
height: 80px;
padding: 3px;
justify-content: center;
align-items: center;
}


#box{
text-align: center;
width: 376px;
height: 528px;
}
35 changes: 35 additions & 0 deletions TPSI/busca_matteo/CSS/busca_esercizio_css_48.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,35 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="author" content="Matteo Busca" />
<meta name="description" content="esercizio 48" />
<meta name="keywords" content="reti, localhost, IPv4, loopback" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet" href="busca_esercizio_css_48.css" type="text/css" />
<title>busca_esercizio_css_48</title>
</head>
<body>
<div id="box">
<p>Gioco del 15</p>
<div class="grid-container">
<div class="grid-item">1</div>
<div class="grid-item">2</div>
<div class="grid-item">3</div>
<div class="grid-item">4</div>
<div class="grid-item">5</div>
<div class="grid-item">6</div>
<div class="grid-item">7</div>
<div class="grid-item">8</div>
<div class="grid-item">9</div>
<div class="grid-item">10</div>
<div class="grid-item">11</div>
<div class="grid-item">12</div>
<div class="grid-item">13</div>
<div class="grid-item">14</div>
<div class="grid-item">15</div>
<div class="grid-item"></div>
</div>
</div>
</body>
</html>
27 changes: 27 additions & 0 deletions TPSI/busca_matteo/CSS/busca_esercizio_css_49.css
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,27 @@
.grid-container {
display: grid;
grid-template-columns:
repeat(6, 1fr);
}
.grid-item {
border: 1px solid red;
padding: 10px;
text-align: center;
}
#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;
}
40 changes: 40 additions & 0 deletions TPSI/busca_matteo/CSS/busca_esercizio_css_49.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,40 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="author" content="Matteo Busca" />
<meta name="description" content="esercizio 49" />
<meta name="keywords" content="reti, localhost, IPv4, loopback" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet" href="busca_esercizio_css_49.css" type="text/css" />
<title>busca_esercizio_css_49</title>
</head>
<body>
<div class="grid-container">
<div class="grid-item" id="a">1</div>
<div class="grid-item">1</div>
<div class="grid-item">1</div>
<div class="grid-item" id="b">1</div>
<div class="grid-item" id="c">1</div>
<div class="grid-item">1</div>
<div class="grid-item">1</div>
<div class="grid-item">1</div>
<div class="grid-item">1</div>
<div class="grid-item">1</div>
<div class="grid-item">1</div>
<div class="grid-item">1</div>
<div class="grid-item">1</div>
<div class="grid-item">1</div>
<div class="grid-item">1</div>
<div class="grid-item" id="d">1</div>
<div class="grid-item">1</div>
<div class="grid-item">1</div>
<div class="grid-item">1</div>
<div class="grid-item">1</div>
<div class="grid-item">1</div>
<div class="grid-item">1</div>
<div class="grid-item">1</div>
<div class="grid-item">1</div>
</div>
</body>
</html>
20 changes: 20 additions & 0 deletions TPSI/busca_matteo/CSS/busca_esercizio_css_50.css
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,20 @@
body{
display:flex;
justify-content: center;
}

.grid-container {
display: grid;
grid-template-columns: 100px 100px 100px;
grid-template-rows: 60px 60px;
grid-column-gap: 10px;
grid-row-gap: 10px;
}

.item {
background-color: #3c3b3a;
color: white;
padding: 10px;
border-radius: 6px;
align-content: center;
}
22 changes: 22 additions & 0 deletions TPSI/busca_matteo/CSS/busca_esercizio_css_50.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,22 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="author" content="Matteo Busca" />
<meta name="description" content="esercizio 50" />
<meta name="keywords" content="reti, localhost, IPv4, loopback" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet" href="busca_esercizio_css_50.css" type="text/css" />
<title>busca_esercizio_css_50</title>
</head>
<body>
<div class="grid-container">
<div class="item">A</div>
<div class="item">B</div>
<div class="item">C</div>
<div class="item">D</div>
<div class="item">E</div>
<div class="item">F</div>
</div>
</body>
</html>
Loading