Compare commits

...

3 Commits

  1. 42
      Ex3_Box model and positioning/3-1/default.html
  2. 28
      Ex3_Box model and positioning/3-2/default.html

@ -0,0 +1,42 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<meta name="viewport" content="width=device-width"/>
<style>
#text1 {
font-size: 1em;
}
#text2 {
font-size: 2em;
}
#text3 {
font-size: 1rem;
}
#text4 {
font-size: 2rem;
}
#text5 {
font-size: 30px;
}
body {
font-size: 20px;
}
</style>
</head>
<body>
<p>Basic text size: body 20px</p>
<p id="text5">30px</p>
<hr>
<p id="text1">1em</p>
<p id="text2">2em</p>
<hr>
<p id="text3">1rem</p>
<p id="text4">2rem</p>
</body>
</html>

@ -0,0 +1,28 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<meta name="viewport" content="width=device-width"/>
<style>
.box1 {
width: 100px;
border-color: purple;
border-width: 10px;
border-style: solid;
padding: 20px 20px;
margin: 20px 20px;
}
.box2 {
border-color: powderblue;
border-width: 20px;
border-style: solid;
padding: 50px 50px;
margin: 100px 100px;
}
</style>
</head>
<body>
<div class="box1">Box1</div>
<div class="box2">Box2</div>
</body>
</html>
Loading…
Cancel
Save