E1Rhan
Kilopat
- Katılım
- 14 Ocak 2016
- Mesajlar
- 570
- Çözümler
- 2
Daha fazla
- Cinsiyet
- Erkek
- Meslek
- Frontend Developer
<!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="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"
integrity="sha512-iecdLmaskl7CVkqkXNQ/ZH/XLlvWZOJyj7Yy7tcenmpD1ypASozpmT/E0iPtmFIB46ZmdtAc9eNBvH0H/ZpiBw=="
crossorigin="anonymous"
referrerpolicy="no-referrer"
/>
<link rel="stylesheet" href="style.css" />
<link
href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css"
rel="stylesheet"
integrity="sha384-9ndCyUaIbzAi2FUVXJi0CjmCapSmO7SnpJef0486qhLnuZ2cdeRhO02iuK6FUUVM"
crossorigin="anonymous"
/>
</head>
<body>
<div class="container-lg">
<div class="upper">
<div class="title"><h1>FORD OTOMOTİV SANAYİ A.Ş.</h1></div>
<div class="badges">
<i class="fas fa-globe-asia"></i>
<i class="fab fa-facebook-f"></i>
<i class="fab fa-twitter"></i>
<i class="fab fa-youtube"></i>
<i class="fab fa-instagram"></i>
</div>
</div>
<div class="text">
<p><b>Akpınar Mah. Hasan Basri Cad. No:2 Sancaktepe/İstanbul</b></p>
<p>www.ford.com.tr - [email protected] 36 73</p>
<p><b>MERSİS No:</b> 0649002036300014</p>
</div>
<div class="lower">
<div class="koc">
<img class ="img-fluid" src="2.png" alt="koc" />
<p>Koç</p>
</div>
<div class="img-fluid"><img src="1.png" alt="ford" /></div>
</div>
</div>
<script
src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"
integrity="sha384-geWF76RCwLtnZ8qwWowPQNguL3RmwHVBC9FhGdlKrxdiJJigb/j/68SIy3Te4Bkz"
crossorigin="anonymous"
></script>
</body>
</html>
.container-lg{
background-color: rgb(27, 27, 116);
}
.upper{
display: flex;
justify-content: space-between;
color: rgb(226, 226, 226);
align-items: center;
padding-top: 20px;
}
.upper h1, i{
font-size: 1.5em;
padding: 5px;
}
.text{
color: rgb(226, 226, 226);
display: flex;
flex-direction: column;
padding-top:1em;
}
.text p{
margin-bottom:0.1em;
}
.lower{
display: flex;
justify-content: space-between;
}
.lower{
display: flex;
justify-content: space-between;
align-items: center;
padding-top:1.5em;
}
img{
background-color: transparent;
width: 5em;
height: 5em;
}
.logo2{
color:white
}
.koc{
display: flex;
align-items: center;
}
.koc p{
color:rgb(226, 226, 226);
font-size: 2em;
margin-left:0.1em
}
.koc img{
width: 3em;
height: 3em;
filter:brightness(0) invert(1);
}
Çok iyi olmuş elinize sağlık. Sadece sağdan ve soldan biraz daha içeri alınabilir. Ford logosu belki 50pixel daha büyürse olur. Bir de sağ üstte ki sosyal medya ikonlarına border radius verildiği zaman biter.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="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css" integrity="sha512-iecdLmaskl7CVkqkXNQ/ZH/XLlvWZOJyj7Yy7tcenmpD1ypASozpmT/E0iPtmFIB46ZmdtAc9eNBvH0H/ZpiBw==" crossorigin="anonymous" referrerpolicy="no-referrer" /> <link rel="stylesheet" href="style.css" /> <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-9ndCyUaIbzAi2FUVXJi0CjmCapSmO7SnpJef0486qhLnuZ2cdeRhO02iuK6FUUVM" crossorigin="anonymous" /> </head> <body> <div class="container-lg"> <div class="upper"> <div class="title"><h1>FORD OTOMOTİV SANAYİ A.Ş.</h1></div> <div class="badges"> <i class="fas fa-globe-asia"></i> <i class="fab fa-facebook-f"></i> <i class="fab fa-twitter"></i> <i class="fab fa-youtube"></i> <i class="fab fa-instagram"></i> </div> </div> <div class="text"> <p><b>Akpınar Mah. Hasan Basri Cad. No:2 Sancaktepe/İstanbul</b></p> <p>www.ford.com.tr - [email protected] 36 73</p> <p><b>MERSİS No:</b> 0649002036300014</p> </div> <div class="lower"> <div class="koc"> <img class ="img-fluid" src="2.png" alt="koc" /> <p>Koç</p> </div> <div class="img-fluid"><img src="1.png" alt="ford" /></div> </div> </div> <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-geWF76RCwLtnZ8qwWowPQNguL3RmwHVBC9FhGdlKrxdiJJigb/j/68SIy3Te4Bkz" crossorigin="anonymous" ></script> </body> </html>
CSS:.container-lg{ background-color: rgb(27, 27, 116); } .upper{ display: flex; justify-content: space-between; color: rgb(226, 226, 226); align-items: center; padding-top: 20px; } .upper h1, i{ font-size: 1.5em; padding: 5px; } .text{ color: rgb(226, 226, 226); display: flex; flex-direction: column; padding-top:1em; } .text p{ margin-bottom:0.1em; } .lower{ display: flex; justify-content: space-between; } .lower{ display: flex; justify-content: space-between; align-items: center; padding-top:1.5em; } img{ background-color: transparent; width: 5em; height: 5em; } .logo2{ color:white } .koc{ display: flex; align-items: center; } .koc p{ color:rgb(226, 226, 226); font-size: 2em; margin-left:0.1em } .koc img{ width: 3em; height: 3em; filter:brightness(0) invert(1); }
Benzedi gibi.
Eki Görüntüle 1848830
Bu sitenin çalışmasını sağlamak için gerekli çerezleri ve deneyiminizi iyileştirmek için isteğe bağlı çerezleri kullanıyoruz.