HTML kodum hatalı mı?

Hüsnü_Çoban

Hectopat
Katılım
5 Nisan 2020
Mesajlar
2.672
Çözümler
9
Daha fazla  
Cinsiyet
Erkek
Meslek
Sivil Polis
[CODE lang="html" title="HTML"]<!DOCTYPE html>
<html>
<head>
<title>MİLİTUMDEREX-Eğlenceli Discord sunucusu!</title>
</head>
<head><style type="text/css"></style></head>
<head>
p {

font-size: 120%;


color: dimgray;


}

a {

text-decoration: none;


}

a:link, a:visited, a:hover a:active {


background-color: green;


color: white;


padding: 10px 25px;


text-align: center;


texr-decoration: none;


display: inline-black;


}
</head>
<body>
</body>
</html>[/CODE]
Kodda hata mı var? Bir türlü istediğim şekilde olmuyor.
1611305743505.png
 
Son düzenleyen: Moderatör:
Bu daha doğru olur sanırım.

Kod:
<!DOCTYPE html>
<html>
    <head>
        <title>MİLİTUMDEREX-Eğlenceli Discord sunucusu!</title>
        <style>
            p {

font-size: 120%;


color: dimgray;


}

 a {

text-decoration: none;


}

a:link, a:visited, a:hover a:active {


background-color: green;


color: white;


padding: 10px 25px;


text-align: center;


text-decoration: none;


display: inline-black;


}
        </style>
    </head>
    <body>
        
    </body>
</html>
 
HTML içerisine CSS kodları eklemişsiniz. Onları style.css den çekmeniz site verimliliği ve SEO açısından daha doğru.
Fakat tek bir sayfa HTML yapacaksanız problem değil.
Ne demek istiyorsunuz?
[CODE lang="css" title="html"]display: inline-block;[/CODE]
[CODE title="HTML"]<!DOCTYPE html>
<html>
<head><style type="text/css">
<div class="yuvarla">
<a href="https://discord.gg/svheBDcjY6">Katıl!</a>
</div>
.yuvarla {
width: 100px;
height: 100px;
line-height: 100px;
text-decoration: none;
text-align: center;
font-size: 25px;
text-shadow: 0 1px 0 rgba(255,255,255,.7);
letter-spacing: -.065em;
box-shadow: 2px 2px 7px rgba(0,0,0,.2);
border-radius: 50%;
-webkit-transition: all .25s ease-in-out;
-o-transition: all .25s ease-in-out;
-moz-transition: all .25s ease-in-out;
transition: all .25s ease-in-out;
box-shadow: 2px 2px 7px rgba(0,0,0,.2);
border-width: 4px;
border-style: solid;
background-color: rgba(252,227,1,1);
border-color: rgba(153,38,0,.2);
}
.yuvarla:hover {
box-shadow: 0px 0px 7px 2px rgba(0,0,0,.5);
border-color: rgba(153,38,0,.5);
}
.yuvarla a{
color: rgba(153,38,0,1);

}

<title>MILITUMDEREX-Eglenceli Discord sunucusu!</title>
</head>
<body>

</body>
</html>[/CODE]
Peki bunda nasıl bir sıkıntı var? Bunda hiç bir şey gözükmüyor.
 
Son düzenleme:
Bu link anlamanız için daha güzel olur, örnekleri de var.
Diyelim ki bir yazıya arka plan, yazı rengi vs vereceksiniz. Bunu HTML içerisine kod olarak yazmanız yerine CSS dosyasından çağırabilirsiniz.

[CODE title="HTML Kodları"]<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="style.css">
</head>
<body>

<h1>İçerik başlığı</h1>
<p>İçerik yazısı</p>

</body>
</html>[/CODE]

[CODE title="CSS Kodları"]body {
background-color: powderblue;
}
h1 {
color: blue;
}
p {
color: red;
}[/CODE]

Örnek olarak verdiğim kodlar, H1 başlığı diyelim CSS kodunda mavi olarak yazıldığı için direk mavi rengi çekecek.
İçerik yazısı da CSS de kırmızı olduğu için yazılar kırmızı renkte yazacak.
 
Son düzenleme:
Ne demek istiyorsunuz?

[CODE title="HTML"]<!DOCTYPE html>
<html>
<head><style type="text/css">
<div class="yuvarla">
<a href="https://discord.gg/svheBDcjY6">Katıl!</a>
</div>
.yuvarla {
width: 100px;
height: 100px;
line-height: 100px;
text-decoration: none;
text-align: center;
font-size: 25px;
text-shadow: 0 1px 0 rgba(255,255,255,.7);
letter-spacing: -.065em;
box-shadow: 2px 2px 7px rgba(0,0,0,.2);
border-radius: 50%;
-webkit-transition: all .25s ease-in-out;
-o-transition: all .25s ease-in-out;
-moz-transition: all .25s ease-in-out;
transition: all .25s ease-in-out;
box-shadow: 2px 2px 7px rgba(0,0,0,.2);
border-width: 4px;
border-style: solid;
background-color: rgba(252,227,1,1);
border-color: rgba(153,38,0,.2);
}
.yuvarla:hover {
box-shadow: 0px 0px 7px 2px rgba(0,0,0,.5);
border-color: rgba(153,38,0,.5);
}
.yuvarla a{
color: rgba(153,38,0,1);

}

<title>MILITUMDEREX-Eglenceli Discord sunucusu!</title>
</head>
<body>

</body>
</html>[/CODE]
Peki bunda nasıl bir sıkıntı var? Bunda hiç bir şey gözükmüyor.

Daha fazla çalışman gerekiyor. Konuyu tam anlamamışsın sanırım. Farklı bir kaynaktan tekrardan dene istersen.

[CODE lang="html" title="düzenlenmiş hali."]<!DOCTYPE html>
<html>
<head>
<div class="yuvarla">
<a href="https://discord.gg/svheBDcjY6">Katıl!</a>
</div>
<style>
.yuvarla {
width: 100px;
height: 100px;
line-height: 100px;
text-decoration: none;
text-align: center;
font-size: 25px;
text-shadow: 0 1px 0 rgba(255,255,255,.7);
letter-spacing: -.065em;
box-shadow: 2px 2px 7px rgba(0,0,0,.2);
border-radius: 50%;
-webkit-transition: all .25s ease-in-out;
-o-transition: all .25s ease-in-out;
-moz-transition: all .25s ease-in-out;
transition: all .25s ease-in-out;
box-shadow: 2px 2px 7px rgba(0,0,0,.2);
border-width: 4px;
border-style: solid;
background-color: rgba(252,227,1,1);
border-color: rgba(153,38,0,.2);
}
.yuvarla:hover {
box-shadow: 0px 0px 7px 2px rgba(0,0,0,.5);
border-color: rgba(153,38,0,.5);
}
.yuvarla a{
color: rgba(153,38,0,1);

}
</style>
<title>MILITUMDEREX-Eglenceli Discord sunucusu!</title>
</head>
<body>

</body>
</html>[/CODE]


Bu arada <div></div> gibi kodlar genellikle <body></body> arasında kullanılır.

[CODE title="doğru kullanımı bu şekilde."]<!DOCTYPE html>
<html>
<head>
<title>MILITUMDEREX-Eglenceli Discord sunucusu!</title>
<style>
.yuvarla {
width: 100px;
height: 100px;
line-height: 100px;
text-decoration: none;
text-align: center;
font-size: 25px;
text-shadow: 0 1px 0 rgba(255,255,255,.7);
letter-spacing: -.065em;
box-shadow: 2px 2px 7px rgba(0,0,0,.2);
border-radius: 50%;
-webkit-transition: all .25s ease-in-out;
-o-transition: all .25s ease-in-out;
-moz-transition: all .25s ease-in-out;
transition: all .25s ease-in-out;
box-shadow: 2px 2px 7px rgba(0,0,0,.2);
border-width: 4px;
border-style: solid;
background-color: rgba(252,227,1,1);
border-color: rgba(153,38,0,.2);
}
.yuvarla:hover {
box-shadow: 0px 0px 7px 2px rgba(0,0,0,.5);
border-color: rgba(153,38,0,.5);
}
.yuvarla a{
color: rgba(153,38,0,1);

}
</style>

</head>
<body>
<div class="yuvarla">
<a href="https://discord.gg/svheBDcjY6">Katıl!</a>
</div>
</body>
</html>[/CODE]
 

Yeni konular

Geri
Yukarı