<!DOCTYPE html>
<html>
<head>
<title>programowanie - CSS</title>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-2">
<meta http-equiv="Content-Language" content="pl">
<link rel="Stylesheet" type="text/css" href="style.css" />
<style type="text/css">
#div1 {
background-color: Pink;
height: 75px;
width: calc(100px + 100px);
}
#div2 {
background-color: LightSalmon;
height: 75px;
width: calc(100px + 200px);
}
#div3 {
background-color: PaleVioletRed;
height: 75px;
width: calc(400px - 200px);
}
#div4 {
background-color: Pink;
height: 75px;
width: calc(20px * 20);
}
#div5 {
background-color: LightSalmon;
height: 75px;
width: calc(100% - 100px);
}
#div6 {
background-color: PaleVioletRed;
height: 75px;
width: calc(100% - 400px);
}
#div7{
background-color: Pink;
height: 75px;
width: calc(100vh - 250px);
}
</style>
</head>
<body>
<p>Zmniejsz oraz powiększ stronę żeby zobaczyć efekt.</p>
<div id="div1">Przykładowy tekst...</div>
<div id="div2">Przykładowy tekst...</div>
<div id="div3">Przykładowy tekst...</div>
<div id="div4">Przykładowy tekst...</div>
<div id="div5">Przykładowy tekst...</div>
<div id="div6">Przykładowy tekst...</div>
<div id="div7">Przykładowy tekst...</div>
</body>
</html>
|
|