INDEX.HTML
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link rel="stylesheet" href="css/Style.css">
</head>
<body>
<!--
<div class="rec">
</div>
<br>
<section class="rec2">
</section>
<br>
<div class="rec3"></div>
<br>
<div class="rec4"></div>
-->
<!-- <div class="rec">
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Unde quisquam debitis recusandae tenetur voluptatem
tempore natus quis culpa! Doloribus, obcaecati possimus optio consectetur eligendi repellendus vel iste
totam doloremque voluptatum.</p>
</div> -->
<div class="rec">
</div>
</body>
</html>
Style.css
/* div {
height: 400px;
width: 400px;
margin: auto;
background-color: black;
} */
/*
.rec {
opacity: 0.5;
height: 400px;
width: 400px;
margin: auto;
/* by name */
/* background-color: black; */
/* } */
/*
*{
margin: 300px;
} */
/*
.rec2 {
height: 400px;
width: 400px;
margin: auto;
by hex code
background-color: #77728d;
}
.rec3 {
height: 400px;
width: 400px;
margin: auto;
background-color: rgb(100, 50, 20);
}
.rec4 {
height: 400px;
width: 400px;
margin: auto;
background-color: rgba(100, 50, 20, 0);
} */
/* .rec {
height: 400px;
width: 300px;
margin: auto;
background-color: blue;
color: white;
/* top bottom right left*/
/* margin: 20px 50px 50px 50px; */
/* padding-left: 20px;
/* padding-top: 40px;
} */
.rec {
height: 300px;
width: 300px;
border-radius: 50%;
/* border-width:1px ;
border-style: solid;
border-color: red; */
border: 2px solid red;
margin: auto;
background-image: url("../images/profile.jpg");
/* background-size: contain; */
background-size: cover;
background-repeat: no-repeat;
background-position: center;
}
Comments
Post a Comment