Membuat Logo Facebook HTML + CSS
LOGO FACEBOOK HTML & CSS
Halo teman teman kali ini kita akan mempelajari cara membuat logo facebook dengan mengunakan versi html5 dan css , untuk alat dan bahan yang kalian butuh kan adalah sebuah laptop , software text editor dan google , safari , firefoox oke langsung saja kita mulai
buat file bernama Index.html
berikut ini sintak koding nya
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Belajar Membuat logo Facebook</title>
</head>
<body>
<div id="facebook"></div>
</body>
</html>
buat file bernama style.css
berikut code program nya
<head>
<style type="text/css">
#facebook {
background: #3b5998;
border: 15px solid #3b5998;
width: 100px;
height: 110px;
border-radius: 5px;
position: relative;
overflow: hidden;
display: inline-block;
text-indent: -999em
}
#facebook::before{
background:#3b5998 ;
position: absolute;
border: 25px solid #ffffff;
bottom: -30px;
right: -37px;
border-radius: 25px;
width: 40px;
height: 90px;
content: "/20";
}
#facebook::after{
position: absolute;
background: #ffffff;
top: 50px;
right: 5px;
width: 55px;
height: 20px;
content: "/20";
}
.body{
background-color: yellowgreen;
}
</style>
hasil nya adalah sebagai berikut :
