Welcome,
Here is the css script solution for week 2.
Copy the code and place it in your css folder.
you can follow these steps if you are not clear
|
fig1. Select CSS folder |
|
fig2. Select hw1 file and paste the code |
Now you are done with the assignment. you can save and view your changes by clicking index in fig1.
Note: Don't just copy the code, this is just for your reference only. See and check where you have gone wrong👍😉
Code:
body{
padding: 20px;
margin: 1%;
}
nav a{
display: inline-block;
background-color: rgba(247, 242, 242, 0.459);
text-decoration: none;
height: 50px;
width: 200px;
border-radius: 5px;
-webkit-border-radius:5px;
-moz-border-radius:5px;
-o-border-radius:5px;
margin: 50px;
padding: 20px 0px 0px 0px;
}
.active{
background-color: rgb(247, 242, 242);
}
header{
background-color: rgb(247, 242, 242);
background-image: url(../images/flywheel.jpg);
text-align: center;
padding: 2%;
height: 200px;
color: rgb(247, 242, 242);
background-size: 100%;
}
h1{
text-transform: uppercase;
}
.left, .right{
float: left;
display: inline;
}
.left{
background-color: rgb(20, 60, 192);
padding: 1%;
align-items: center;
width: 270px;
float: left;
}
.right{
width: 74%;
display: inline-block;
padding-left: 2%;
}
img{
width: 200px;
margin: 30px;
border: solid 2px rgb(1,1,1);
display: inline;
}
table {
border-collapse: collapse;
width: 600px;
font-family: "Times New Roman", Times, serif;
font-weight: bold;
font-size: 60%;
}
th {
background: #808000;
color: #FFFFFF;
border: 2px solid #FFFFFF;
}
td {
background: #E0FFFF;
color: #808080;
border: 2px solid #FFFFFF;
text-align: center;
}
table, td, th {
padding: 1%;
}
tr th:first-child, tr td:first-child {
text-align: left;
}
tr td {
opacity: 0.8;
}
tr td:hover {
opacity: 2.5;
text-align: center;
font-size: 120%;
}
If you have any doubts or questions regarding this, feel free to ask in comment section.
Thank you🙏
Comments
Post a Comment