Worksheet- Write the HTML code for the fig shown below
Answers
Answer:
Depends on your browser it will show
Step-by-step explanation:
<!DOCTYPE html>
<head>
<style>
body{
height: 100%;
width : 100%;
}
.a {
background: white;
color: blue;
border: 2px solid blue;
width: 48%;
display: inline;
height: 50%;
text-align: center;
}
.b {
background: white;
color: blue;
border: 2px solid blue;
width: 45%;
height: 50%;
text-align: center;
float: right;
}
.c {
background: white;
color: blue;
border: 2px solid blue;
width: 48%;
height: 50%;
text-align: center;
}
.sec {
background: white;
color: blue;
border: 2px solid blue;
width: 45%;
height: 50%;
text-align: center;
float: right;
padding: 0;
}
.d{
width: 48%;
height: 48%;
border-right: red;
border-bottom: green;
text-align: center;
}
.d e{
width: 48%;
height: 48%;
border-left: red;
border: 1px blue
border-bottom: green;
text-align: center;
float: right;
}
.down{
width: 100%;
height : 50%;
text-align: center;
}
</style>
<title> My site</title>
</head>
<body>
<div class='a'><h1> A File</h1></div>
<div class='b'><h1> B File</h1></div>
<div class='c'><h1> C File</h1></div>
<div class='sec'>
<div class='d'> D Left File</div>
<div class='d e'> D Right File</div>
<div class ='down'><h1> D bottom file</h1>
</div>
</body>
</html>