Selam Dostlar , Html/Css Basit Site Yapalım Konumun İkinci Bölümüne Hoşgeldiniz ... 
:
Elimden Geldiği Kadar Açıklı ve Basit Anlatıcam ...
Evet Burada Kalmıştık Buradan Devam Edelim:
Şimdi Discord Adresimizin Önüne İkon Ekleyelim ...
Bu Kodumuzu "<head> </head>" Ekliyoruz ki, İkon Ekleyeceğimiz Anlaşılsın.
Şimdi "fontawesome"dan İstediğimiz ikonu seçiyoruz ...
Ben "file" ikonunu seçtim ve ekliyorum.
Gördüğünüz gibi ekledik ve çok şık görünüm aldı:
Şimdi Youtube kanal adresimi ekleyeyim:
Şimdi bunu şekillendirelim ...
Şimdi bir video ekleyelim ..
Width ve Height'ı Ayarlaya Biliriz , Önerim 420-315'dir
Yukarıda gösterdiğim kendi-kendini yeniliyor , şimdi kontrol engelleyelim yani videoyu ileriye saramasın ve sesi alamasın ...
Sonuç Bu Alındı ...
Şimdi Sitemize bir resim ekleyelim ...
Artık Sitemde "GREEN TEAM" Logosu gözükecektir.
Ancak yok ben internet URL'sinden Değilde direk dosyalarımdaki resimleri yansıtmak istiyorum derseniz ;
Şimdi siteme bir tablo ekleyicem ve Bilgi Seviyelerimin "100%'dan Değerlendirmesini" yazıcam...
Gördüğünüz Gibi..
Bunuda Şekillendirelim ;
Gelecek Bölümde Görüşmek Üzere , Hoşçakalın ...
:Elimden Geldiği Kadar Açıklı ve Basit Anlatıcam ...
Kod:
<!DOCTYPE HTML>
<html>
<title> Herorahim - Official Site </title>
<head>
</head>
<body>
<div id="baslik"> <center> <h1> Herorahim - Official Website </h1> </center> </div>
<div id="hakkimda"> <h2> Hakkımda : </h2> </div>
<div id="bilgihakkimda"> <h4> Merhaba Ben Herorahim. Sitemi Ziyarete Hoşgeldin :) , İlgi Alanlarım: Yazılım-Deface-Crack-Siber Güvenlik Alanları ... </h4> </div>
<div id="discord"> <h3> Discord: Herorahim#4962 </h3> </div>
</body>
*********
#baslik { background: grey;
margin: 80px; }
#hakkimda {
color: red;
text-decoration: underline; }
#bilgihakkimda {
font-family: "Lucida Console", Courier, monospace;
}
#discord {
color: blue;
border: 6px double;
background-color: lightgrey;
margin: 50px;
height: 50px;
width: 500px;
}
#discord:hover { color: red;
}
</style>
</html>Evet Burada Kalmıştık Buradan Devam Edelim
:Şimdi Discord Adresimizin Önüne İkon Ekleyelim ...
Kod:
<script src="https://kit.fontawesome.com/a076d05399.js"></script>Bu Kodumuzu "<head> </head>" Ekliyoruz ki, İkon Ekleyeceğimiz Anlaşılsın.
Şimdi "fontawesome"dan İstediğimiz ikonu seçiyoruz ...
Ben "file" ikonunu seçtim ve ekliyorum.
Kod:
<div id="discord"> <h3><i class="fas fa-file"> </i> Discord: Herorahim#4962 </h3> </div>Gördüğünüz gibi ekledik ve çok şık görünüm aldı
:Şimdi Youtube kanal adresimi ekleyeyim
:
Kod:
<div id="youtube"><a href="https://www.youtube.com/channel/UC1yNLDwZjPAF9bY6DSSi-CQ">Youtube Kanalım</a> </div>Şimdi bunu şekillendirelim ...
Kod:
a {
color:red;
text-align: center;
text-decoration: none;
border: solid;
}Şimdi bir video ekleyelim ..
Kod:
<iframe width="420" height="315"
src="https://www.youtube.com/embed/qZYzYdyc0YY?autoplay=1">
</iframe>Width ve Height'ı Ayarlaya Biliriz , Önerim 420-315'dir
Yukarıda gösterdiğim kendi-kendini yeniliyor , şimdi kontrol engelleyelim yani videoyu ileriye saramasın ve sesi alamasın ...
Kod:
<iframe width="420" height="315"
src="https://www.youtube.com/embed/qZYzYdyc0YY?controls=0">
</iframe>
Kod:
<!DOCTYPE HTML>
<html>
<title> Herorahim - Official Site </title>
<head>
</head>
<body>
<div id="baslik"> <center> <h1> Herorahim - Official Website </h1> </center> </div>
<div id="hakkimda"> <h2> Hakkımda : </h2> </div>
<div id="bilgihakkimda"> <h4> Merhaba Ben Herorahim. Sitemi Ziyarete Hoşgeldin :) , İlgi Alanlarım: Yazılım-Deface-Crack-Siber Güvenlik Alanları ... </h4> </div>
<div id="discord"> <h3><i class="fas fa-file"> </i> Discord: Herorahim#4962 </h3> </div>
<div id="youtube"><a href="https://www.youtube.com/channel/UC1yNLDwZjPAF9bY6DSSi-CQ"> Youtube Kanalım</a> </div>
<iframe width="420" height="315"
src="https://www.youtube.com/embed/qZYzYdyc0YY?controls=0">
</iframe>
</body>
<script src="https://kit.fontawesome.com/a076d05399.js"></script>
*********
#baslik { background: grey;
margin: 80px; }
#hakkimda {
color: red;
text-decoration: underline; }
#bilgihakkimda {
font-family: "Lucida Console", Courier, monospace;
}
#discord {
color: blue;
border: 6px double;
background-color: lightgrey;
text-align: center;
margin: 50px;
height: 50px;
width: 500px;
}
a {
color:red;
text-align: center;
text-decoration: none;
border: solid;
}
#discord:hover { color: red; }
</style>
</html>Sonuç Bu Alındı ...
Şimdi Sitemize bir resim ekleyelim ...
Kod:
<img src="https://www.turkhackteam.org/customavatars/avatar819687_122.gif" alt="Turkhackteam.org">Artık Sitemde "GREEN TEAM" Logosu gözükecektir.
Ancak yok ben internet URL'sinden Değilde direk dosyalarımdaki resimleri yansıtmak istiyorum derseniz ;
Kod:
<img src="greenteam.png" alt="greenteam">Şimdi siteme bir tablo ekleyicem ve Bilgi Seviyelerimin "100%'dan Değerlendirmesini" yazıcam...
Kod:
<table style="width:30%">
<tr>
<th>Bilgi Seviyem</th>
<th colspan="8">100% Değerlendirme</th>
</tr>
<tr>
<td>Yazılım</td>
<td>60%</td>
<td></td>
</tr>
<tr>
<td>Deface</td>
<td>85%</td>
<td></td>
</tr>
<tr>
<td>Cracking</td>
<td>100%</td>
<td></td>
</tr>
</table>Gördüğünüz Gibi..
Bunuda Şekillendirelim ;
Kod:
}
td { color:green;
}
tr { color:red;}Gelecek Bölümde Görüşmek Üzere , Hoşçakalın ...
