Open your text editor: Please complete this code in HTML create a new file and name it “Lec_Ex4_2.html” create a new file and name it “style_2.css” Type the 8 lines in the html(basic html structure). Add this line to the head section of html: Write these lines in the body of the html: Your name . Style it in the CSS: #title{ background-color:blue;} #container1 {background-color:red;} If we don’t specify the width of the div element, it will take up the full width available. We can specify the width and height of the div using percentages or pixels. Percentages are flexible (changes according to the screen size), and pixels are fixed. Add the following property to both divs: Width:80%; This is comparing to the full screen For the title div: Padding:2%; For the container div: Height: 400px; Height can also be made with percentages, but pixels are preferred. Your code must have 3 divs : title, container1 and container2 (the one inside the red div). Container2 must be inside container1. All the divs must be centered, colorful, and not fill up the full space that is given to them.
Open your text editor: Please complete this code in HTML
create a new file and name it “Lec_Ex4_2.html”
create a new file and name it “style_2.css”
Type the 8 lines in the html(basic html structure).
Add this line to the head section of html:
Write these lines in the body of the html:
<div id=“title”><h1>Your name</h1></div>
<div id=“container1”> . </div>
Style it in the CSS:
#title{ background-color:blue;}
#container1 {background-color:red;}
If we don’t specify the width of the div element,
it will take up the full width available.
We can specify the width and height of the div
using percentages or pixels.
Percentages are flexible (changes according to
the screen size), and pixels are fixed.
Add the following property to both divs:
Width:80%;
This is comparing to the full screen
For the title div:
Padding:2%;
For the container div:
Height: 400px;
Height can also be made with percentages, but
pixels are preferred.
Your code must have 3 divs : title, container1
and container2 (the one inside the red div).
Container2 must be inside container1.
All the divs must be centered, colorful, and not
fill up the full space that is given to them.
Step by step
Solved in 3 steps
