Css Eğitimi Ders 14-Transparan

<div class="separator" style="clear: both; text-align: center;"> <a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRn6g5w5vuV4vMz1nyOFuw-90T45P85arbtihwjduHirEXC7svCFrFetpdB37bh2wSdieNmSMYuordTTOYwKZZeC9IgVs3ULuJLOkzv3m2oK8H25u7FndeSvezH0HVRp-dq9YeaD_gMGtu/s1600/5035a79ebf516.preview-620.jpg" imageanchor="1" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" height="116" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRn6g5w5vuV4vMz1nyOFuw-90T45P85arbtihwjduHirEXC7svCFrFetpdB37bh2wSdieNmSMYuordTTOYwKZZeC9IgVs3ULuJLOkzv3m2oK8H25u7FndeSvezH0HVRp-dq9YeaD_gMGtu/s1600/5035a79ebf516.preview-620.jpg" width="200" /></a></div> Merhaba,<br /> Siteye güzel bir görüntü katan transparan resimler üzerinde bir konu işleyeceğiz. Bazı örnekler verip daha iyi anlamanızı sağlayacağım.<br /> <h3> Transparan Nedir?</h3> <div> Transparan saydamlık anlamına gelir. Resim üzerinde kullanılır. </div> <h3> Transparan</h3> <div> Transparanlık belirtmek için "opacity" kullanılır. </div> <div> <br /></div> img.transparanresim {<br /> <div> opacity: 0.6; </div> <div> filter: alpha(opacity=60); </div> <div> }</div> <div> <br /></div> <div> "opacity" ile 0.6 transparan oluşturduk. Ve bunu "filter" kullanarak tarayıcı uyumluluğuna bağladık. Bununla ilgili bir güzel örnek daha:</div> <div> <br /></div> img.transparanresim {<br /> <div> opacity: 0.6; filter: alpha(opacity=60); </div> <div> } </div> <div> img:hover.transparanresim { </div> <div> opacity: 1.0; filter: alpha(opacity=100); </div> <div> }</div> <div> <br /></div> <div> Bu kodu bir resim üzerinde önizlerseniz (class adı transparan resim) resim transparan olup üstüne gelince 1 yani düz transparanlığa dönüşecektir. Eğer herhangi bir class oluşturmayıp kullansaydık ozaman bütün resimlerde bu css stili uygulanacaktır.</div> <div> <br /></div> <div> <div 0.6="" 1.0="" alpha="" class="separator" filter:="" img:hover="" img="" opacity:="" opacity="100);" style="clear: both; text-align: center;"> </div> <br /></div>

Css Eğitimi Ders 14-Transparan

Merhaba, Siteye güzel bir görüntü katan transparan resimler üzerinde bir konu işleyeceğiz. Bazı örnekler verip daha iyi anlamanızı sağlay...

Devamı »

Css Eğitimi Ders 13-Kaydırma

<div class="separator" style="clear: both; text-align: center;"> <a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRn6g5w5vuV4vMz1nyOFuw-90T45P85arbtihwjduHirEXC7svCFrFetpdB37bh2wSdieNmSMYuordTTOYwKZZeC9IgVs3ULuJLOkzv3m2oK8H25u7FndeSvezH0HVRp-dq9YeaD_gMGtu/s1600/5035a79ebf516.preview-620.jpg" imageanchor="1" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" height="116" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRn6g5w5vuV4vMz1nyOFuw-90T45P85arbtihwjduHirEXC7svCFrFetpdB37bh2wSdieNmSMYuordTTOYwKZZeC9IgVs3ULuJLOkzv3m2oK8H25u7FndeSvezH0HVRp-dq9YeaD_gMGtu/s1600/5035a79ebf516.preview-620.jpg" width="200" /></a></div> Merhaba,<br /> Bugün büyük bir sorun olan otamatik olarak kaydırma özelliğini kaldırmayı ve anlamayı öğreneceğiz. Kısa bir ders olacak.<br /> <h3> Kaydırma Nedir?</h3> <div> Kaydırma html okunurken içinde bulunduğu kutu veya herhangi bir şeye sığmayınca aşağı atma veya başka seçeneklere sürüklemedir. Örneğin 3 adet resmi yan yana koyduğumuzda 1'isi aşağı kayıyorsa bunu düzelmek için resimlerin boyutunu düşürebilirsiniz. Ama daha kolay yolu da var:</div> <div> <br /></div> <div> .kaydırma {</div> <div> clear: both;</div> <div> }</div> <div> <br /></div> <div> Bu şekilde kaydırma adlı sınıfımıza kaydırma engellemesini koyduk.</div>

Css Eğitimi Ders 13-Kaydırma

Merhaba, Bugün büyük bir sorun olan otamatik olarak kaydırma özelliğini kaldırmayı ve anlamayı öğreneceğiz. Kısa bir ders olacak. Kaydı...

Devamı »

Css Eğitimi Ders 12-Pozisyon

<div class="separator" style="clear: both; text-align: center;"> <a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRn6g5w5vuV4vMz1nyOFuw-90T45P85arbtihwjduHirEXC7svCFrFetpdB37bh2wSdieNmSMYuordTTOYwKZZeC9IgVs3ULuJLOkzv3m2oK8H25u7FndeSvezH0HVRp-dq9YeaD_gMGtu/s1600/5035a79ebf516.preview-620.jpg" imageanchor="1" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" height="116" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRn6g5w5vuV4vMz1nyOFuw-90T45P85arbtihwjduHirEXC7svCFrFetpdB37bh2wSdieNmSMYuordTTOYwKZZeC9IgVs3ULuJLOkzv3m2oK8H25u7FndeSvezH0HVRp-dq9YeaD_gMGtu/s1600/5035a79ebf516.preview-620.jpg" width="200" /></a></div> Merhaba,<br /> Şimdi önemli bir konu olan bazı elementlerin pozisyonlarını belirtmeyi göreceğiz. Bildiğimiz üzere tüm elementler top (üst), bottom(alt), right(sağ) ve left(sol) özelliklerine sahiptir. Anacak bu özellikler "position" özelliği kullanılmadıysa yarayacaktır.<br /> <div> <br /></div> <ul> <li>static : Hiçbir özellik belirtilmediyse</li> <li>fixed : Sabit, tarayıcıya göre hareket etmeyen element</li> <li>relative : Normal olması gereken pozisyona göre konum belirlemek</li> <li>absolute : Koordinat belirlemek</li> </ul> <h4> Static</h4> <div> Herhangi bir position belirmemek durumunda oluşan html etiketlerinin  top (üst), bottom(alt), right(sağ) ve left(sol) özelliklerine sahip olmamasıdır.</div> <h4> Fixed</h4> <div> Bu seçenek ile tarayıcı scroll (Kaydırma Çubuğu) oynatıldığında bile hareket etmeyen html tagları oluşturmaya yarar. Bunu yazı, resim gibi etiketlerde kullanabilirsiniz. Örneğin:</div> <div> <br /></div> <div> p{</div> <div> position: fixed;</div> <div> <br /></div> <div> bottom: 50px;</div> <div> right: 25px;</div> <div> }</div> <div> <br /></div> <div> Bu kodu çalıştırınca p tagının sabit bir şekilde altta 50px ve sağdan 25px olarak durduğunu göreceksiniz. Bu fixed özelliği diğer tagların önüne geçer.</div> <h4> Relative</h4> <div> Tag'a özel pozisyonundan farklı bir değer vermeyi sağlar. Sağ'a kaydırma, sola kaydırma gibi. Örneğin:</div> <div> <br /></div> <div> h4 {</div> <div> position: relative;</div> <div> <br /></div> <div> left: -15px;</div> <div> }</div> <div> <br /></div> <div> Bu kodu çalıştırdığımızda h4 etiketinin kullanıldığı kısımda 15px sola kayacaktır.</div> <h4> Absolute</h4> <div> Tag için herhangi bir konum belirlemeyi sağlar. Konumu her yer olabilir.</div> <div> <br /></div> <div> h1 {</div> <div> position: absolute;</div> <div> left: 50px;</div> <div> top: 100px;</div> <div> }</div> <div> <br /></div> <div> Bu şekilde h1 başlığının 50px solda 100px üstte olmasını sağladık. </div> <h4> z-index</h4> <div> Belirlenen etiketin katmanını belirler. Yani birden fazla belirtmiş isek hangisi önde hangisi arkada diye belirtmemiz de gerekir. Bunun için z-index kullanılır. Örneğin:</div> <div> <br /></div> <div> img.duyuru {</div> <div> position: fixed;</div> <div> <br /></div> <div> left: 0px;</div> <div> top: 0px;</div> <div> <br /></div> <div> z-index: 1</div> <div> }</div> <div> <br /></div> <div> Bu durumda img'ye özel "duyuru" adlı bir class içine fixed özelliği ile bir resim atadığımızı düşünelim. z-index belirtilmeyen taglar 0 olacağına göre resim öne geçecektir. Negatif sayılar ise arkasına geçmesine neden olur.</div>

Css Eğitimi Ders 12-Pozisyon

Merhaba, Şimdi önemli bir konu olan bazı elementlerin pozisyonlarını belirtmeyi göreceğiz. Bildiğimiz üzere tüm elementler top (üst), bot...

Devamı »

Css Eğitimi Ders 11-Sınırlama

<div class="separator" style="clear: both; text-align: center;"> <a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRn6g5w5vuV4vMz1nyOFuw-90T45P85arbtihwjduHirEXC7svCFrFetpdB37bh2wSdieNmSMYuordTTOYwKZZeC9IgVs3ULuJLOkzv3m2oK8H25u7FndeSvezH0HVRp-dq9YeaD_gMGtu/s1600/5035a79ebf516.preview-620.jpg" imageanchor="1" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" height="116" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRn6g5w5vuV4vMz1nyOFuw-90T45P85arbtihwjduHirEXC7svCFrFetpdB37bh2wSdieNmSMYuordTTOYwKZZeC9IgVs3ULuJLOkzv3m2oK8H25u7FndeSvezH0HVRp-dq9YeaD_gMGtu/s1600/5035a79ebf516.preview-620.jpg" width="200" /></a></div> Merhaba,<br /> Kutu modeli dersinden hatırlarsak width belirlemezsek tamamen yatay kaplıyordu. height belirlemezsek içine yazılanlara göre uzuyordu. İşte uzamasını belli bir sınıra koymak için css sınırlamaları kullanırız.<br /> <h3> Sınırlama</h3> <div> Sınırlamalarda en düşüğü belirlemek için "min" en yükseği sınırı belirlemek için "max" kullanırız. Yani "min-width, min-height, max-width, max-height" oluyor. Örneği inceleyelim:</div> <div> <br /></div> <div> .kutu {</div> <div> //width belirmeyip tam kaplamasını sağlıyacağız</div> <div> max-height: 500px;</div> <div> }</div> <div> <br /></div> <div> Bu şekilde kutu başta içindeki kadar büyüyecek ve 500px'e gelince duracaktır. Bunu aynı şekilde min olarak da belirtebiliriz:</div> <div> <br /></div> <div> <div> .kutu {</div> <div> //width belirmeyip tam kaplamasını sağlıyacağız</div> <div> min-height: 100px;</div> <div> max-height: 500px;</div> <div> }</div> </div>

Css Eğitimi Ders 11-Sınırlama

Merhaba, Kutu modeli dersinden hatırlarsak width belirlemezsek tamamen yatay kaplıyordu. height belirlemezsek içine yazılanlara göre uzuy...

Devamı »

Css Eğitimi Ders 10-Gruplama

<div class="separator" style="clear: both; text-align: center;"> <a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRn6g5w5vuV4vMz1nyOFuw-90T45P85arbtihwjduHirEXC7svCFrFetpdB37bh2wSdieNmSMYuordTTOYwKZZeC9IgVs3ULuJLOkzv3m2oK8H25u7FndeSvezH0HVRp-dq9YeaD_gMGtu/s1600/5035a79ebf516.preview-620.jpg" imageanchor="1" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" height="116" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRn6g5w5vuV4vMz1nyOFuw-90T45P85arbtihwjduHirEXC7svCFrFetpdB37bh2wSdieNmSMYuordTTOYwKZZeC9IgVs3ULuJLOkzv3m2oK8H25u7FndeSvezH0HVRp-dq9YeaD_gMGtu/s1600/5035a79ebf516.preview-620.jpg" width="200" /></a></div> Merhaba,<br /> Şimdi Css'yi daha kolay kullanmak için bir kaç şey göreceğiz.<br /> <h3> Gruplama</h3> <div> Şu kodu inceleyelim:</div> <br /><br /> h2 { color: orange; } <div> h4 { color: orange; } </div> <div> h6 { color: orange; }</div> <div> <br /></div> <div> Hepsinin özellikleri aynı ve bunları tek hamlede yazma ihtimalimiz yok mu? Tabiki var. İşte buna gruplama diyoruz. Gruplama şu şekilde yapılır:</div> <div> <br /></div> <div> h2, h4, h6 {</div> <div> color: orange;</div> <div> }</div> <div> <br /></div> <div> Bu şekilde daha kısa bir css kodu kullandık.</div> <div> <br /></div> <h3> Özel Classlar</h3> <div> Şu kodu inceleyelim:</div> <div> <br /></div> <div> <p> 1. Paragraf </p></div> <div> <p> 2. Paragraf </p></div> <div> <br /></div> <div> Ben 1.'sini normal ve 2.'sini kırmızı istiyorum. O halde css kodum 2 class şeklinde yazmam gerekiyor. Yani bir normal yapan class ve birde kırmızı yapan class. Bunun yerine özel classları kullanırız. Yani bir etiket için özel classlar vardır. Bunlar:</div> <div> <br /></div> <div> p.kirmizi {</div> <div> color: kirmizi;</div> <div> }</div> <div> <br /></div> <div> Bu şekilde p etiketine özel bir paragraf oluşturduk. Bunu kullanırsak:</div> <div> <br /></div> <div> <p class="kirmizi"> Kırmızı Paragraf </p></div> <div> <br /></div> <div> Sadece "kirmizi" yazdık. "p.kirmizi" değil!</div> <div> <br /></div>

Css Eğitimi Ders 10-Gruplama

Merhaba, Şimdi Css'yi daha kolay kullanmak için bir kaç şey göreceğiz. Gruplama Şu kodu inceleyelim: h2 { color: orange; }  h4...

Devamı »

Css Eğitimi Ders 8-Tablolar

<div class="separator" style="clear: both; text-align: center;"> <a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRn6g5w5vuV4vMz1nyOFuw-90T45P85arbtihwjduHirEXC7svCFrFetpdB37bh2wSdieNmSMYuordTTOYwKZZeC9IgVs3ULuJLOkzv3m2oK8H25u7FndeSvezH0HVRp-dq9YeaD_gMGtu/s1600/5035a79ebf516.preview-620.jpg" imageanchor="1" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" height="116" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRn6g5w5vuV4vMz1nyOFuw-90T45P85arbtihwjduHirEXC7svCFrFetpdB37bh2wSdieNmSMYuordTTOYwKZZeC9IgVs3ULuJLOkzv3m2oK8H25u7FndeSvezH0HVRp-dq9YeaD_gMGtu/s1600/5035a79ebf516.preview-620.jpg" width="200" /></a></div> Merhaba,<br /> Şimdi uzun ve önemli bir konu göreceğiz. Tablolar! Bu konu önemli bir konudur. Çünkü tablo ile yapılan tasarımlar tablo özelliklerine dayanır. Başlayalım.<br /> <h3> Tablolar</h3> <h4> Kenarlık:</h4> <div> Stil belirtmek için "border-style" kullanılır. Özelliklerine göz atalım:</div> <div> <ul> <li>dotted: Çizgili</li> <li>dashed: Kısa Çizgili</li> <li>solid: Çizgi</li> <li>double: Çift Çizgili</li> <li>grove, ridge, inset, outside: Kalın Çizgi (Hepsi Olabilir)</li> </ul> <div> Örnek verelim:</div> </div> <div> <br /></div> <div> .tablo {</div> <div> border-style: double;</div> <div> }</div> <div> <br /></div> <div> Şimdi bir kenarın kalınlığını belirtelim. Kesinlikle önceden bir "border-style" belirtmemiz gerekir. Aksi takdirde çalışmaz. Örneğin:</div> <div> <br /></div> <div> <div> .tablo {</div> <div> border-style: solid;</div> <div> border-width: 2px;</div> <div> }</div> </div> <div> <br /></div> <div> Şimdi de kenarlık rengini belirtelim. Bunda da aynı şekilde önceden "border-style" belirtmemiz gerekir. Örneğin:</div> <div> <br /></div> <div> <div> .tablo {</div> <div> border-style: solid;</div> <div> border-width: 2px;</div> <div> border-color: #FF8000;</div> <div> }</div> </div> <div> <br /></div> <div> Bu şekilde tüm öğrendiğimiz stilleri pekiştirdik.</div> <h4> Genişlik-Yükseklik:</h4> <div> Bu yöntem ile tablonun her hücresine ayrı bir büyüklük veya yükseklik verebiliriz. Örneğin:</div> <div> <br /></div> <div> td.hücre1 {</div> <div> width: 100px;</div> <div> height: 100px;</div> <div> }</div> <div> td.hücre2 {</div> <div> <div> width: 100px;</div> <div> height: 200px;</div> </div> <div> }</div> <h4> Yazı Özellikleri:</h4> <div> Tablonun içindeki yazı özellikleridir. Yine her hücrede tek tek kullanılabilir. "text-aling" yani hiza, "color" yani renk, "background-color" arkaplan rengi gibi özellikleri vardır. Örneğin:</div> <div> <br /></div> <div> <div> .tablo {</div> <div> border-style: solid;</div> <div> border-width: 2px;</div> <div> border-color: #FF8000;</div> <div> text-aling: center;</div> <div> color:  #FF8000;</div> <div> background-color: #EEEEEE;</div> <div> }</div> </div> <div> <br /></div> <div> Bu derslik bu kadar ve önemli bir konuyu atlattık ve daha önemli bir konu olan kenarlıklara geçeceğiz. Zor olsada eğlenceli olacak. Kolay gelsin. Çalışmayı unutmayın.</div>

Css Eğitimi Ders 8-Tablolar

Merhaba, Şimdi uzun ve önemli bir konu göreceğiz. Tablolar! Bu konu önemli bir konudur. Çünkü tablo ile yapılan tasarımlar tablo özellikl...

Devamı »

Css Eğitimi Ders 7-Listeler

<div class="separator" style="clear: both; text-align: center;"> <a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRn6g5w5vuV4vMz1nyOFuw-90T45P85arbtihwjduHirEXC7svCFrFetpdB37bh2wSdieNmSMYuordTTOYwKZZeC9IgVs3ULuJLOkzv3m2oK8H25u7FndeSvezH0HVRp-dq9YeaD_gMGtu/s1600/5035a79ebf516.preview-620.jpg" imageanchor="1" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" height="116" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRn6g5w5vuV4vMz1nyOFuw-90T45P85arbtihwjduHirEXC7svCFrFetpdB37bh2wSdieNmSMYuordTTOYwKZZeC9IgVs3ULuJLOkzv3m2oK8H25u7FndeSvezH0HVRp-dq9YeaD_gMGtu/s1600/5035a79ebf516.preview-620.jpg" width="200" /></a></div> Merhaba,<br /> Bu derste listeleme yaparken özellikleri kullanmayı öğreneceğiz. Şekillendirme, değiştirme vs. Hemen Başlayalım.<br /> <h3> Listeler</h3> <h4> Madde Şekli:</h4> <div> Madde şekillerini 2 yerde kullanırız. Numaralı ve şekilli listeler. Yani "ol" ve "ul". Bir örnek ile madde şekillerini daire, sayıları roman rakamları yapalım:</div> <div> <br /></div> <div> ul {</div> list-style-type: disc;<div> }</div> <div> ol {</div> list-style-type: upper-roman;<div> }</div> <div> <br /></div> <div> Bu stili kullanırsak tüm madde listelerinin başında daire, sayı listelelerinin başında roman rakamları listelenir. Buna pek çok örnek verilebilir.</div> <h4>      Ul Stilleri</h4> <div> <ul> <li>circle: İçi boş daire</li> <li>disc: Daire</li> <li>square: Kare</li> <li>none: Boş</li> </ul> <h4>      Ol Stilleri</h4> </div> <ul> <li>armenian</li> <li>decimal</li> <li>decimal-leading-zero</li> <li>lower-alpha</li> <li>lower-greek</li> <li>lower-latin </li> <li>lower-roman</li> <li>none </li> <li>upper-alpha</li> <li>upper-latin</li> <li>upper-roman</li> </ul> <div> Not: Bunları yazamadım çünkü çoğunu hatırlamıyorum ve alıntı yaptım. Orada da yoktu. Size ödev öğrenin gelin :)</div> <div> <br /></div> <div> Madde şekli yerine resim de kullanabiliriz. Örneğin:</div> <div> <br /></div> ul { <div> list-style-image: url('resim.png'); </div> <div> }</div> <div> <br /></div> <div> Not: Resim yerine gif'de kullanılabilir.</div> <h4> İnside-Outside</h4> <div> Madde işaretinin içinde mi dışında mı olacağıdır. Örneğin:</div> <div> <br /></div> <div> ul { <div> list-style-position: inside; </div> <div> }</div> </div> <div> <br /></div> <div> Bu şekilde madde işareti içeri kısımda başta olacaktır.</div> <div> <br /></div> <div> Bu derslik bu kadar. Çalışın ve ödevi unutmayın. Bu arada tüm "ol" özelliklerini bulana bir süprizim var ;)</div>

Css Eğitimi Ders 7-Listeler

Merhaba, Bu derste listeleme yaparken özellikleri kullanmayı öğreneceğiz. Şekillendirme, değiştirme vs. Hemen Başlayalım. Listeler Ma...

Devamı »

Css Eğitimi Ders 3-Birkaç Bilgi

<div class="separator" style="clear: both; text-align: center;"> <a href="http://saltun.net/wp-content/uploads/2013/10/css.jpg" imageanchor="1" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" height="117" src="http://saltun.net/wp-content/uploads/2013/10/css.jpg" width="200" /></a></div> Merhaba,<br /> Bir önceki derste Class ve ıd yapısını öğrenmiştik ve şimdi nereye eklenir? Dosyası nasıl çağrılır? Onu öğreneceğiz.<br /> <h3> Stil Dosyasını Çağırma</h3> <div> Stil dosyası çok uzun olduğundan index dosyası çöplüğe dönmektedir. Bunu önlemek için ise dosyası başka yerden çağırma yöntem kullanılır. Ayrıca "<head>" ve "</head>" etiketleri arasına konur. İşte böyle çağırılır;</div> <div> <br /></div> <link href="stil.css" type="text/css" rel="stylesheet"/><br /> <div> <br /></div> <div> Bu şekilde index'i kısaltabiliriz. Ve işimiz kolaylaşır.</div> <h3> Css Nereye Yazılır?</h3> <div> Aslında bunu 2 sefer öğrendik ve hala tekrar ediyoruz. Ama önemli bir konu. Yine de söyle dediğinizi duyar gibiyim;</div> <div> <br /></div> <html><br /> <div> <head> </div> <div> <title>MinikUzman</title></div> <div>  <style type="text/css"> </div> <div> body { </div> <div> background-color:grey; </div> <div> color:white; </div> <div> } </div> <div> p { </div> <div> font-family: Arial, Verdana; </div> <div> font-size: 16px;</div> <div>  } </div> <div> <div> h1 { </div> <div> font-family: Arial, Verdana; </div> <div> font-size: 26px;</div> <div> color:orange;</div> <div>  } </div> </div> <div> </style> </div> <div> </head> </div> <div> <body> </div> <div> <h1>Wolder King</h1></div> <div> <p>Merhaba, Blog'uma Hoşgeldiniz.</p> </div> <div> </body> </div> <div> </html></div> <div> <br /></div> <div> Aslında burada büyük bir tekrar yaptık. Burayı iyice bir anlamaya çalışın. Eğer anlarsanız bu konuyu çözdünüz demektir. Bir sonraki derste örnekler vermeye devam edeceğiz. Kolay gelsin.</div>

Css Eğitimi Ders 3-Birkaç Bilgi

Merhaba, Bir önceki derste Class ve ıd yapısını öğrenmiştik ve şimdi nereye eklenir? Dosyası nasıl çağrılır? Onu öğreneceğiz. Stil Dosy...

Devamı »