Html - Css - Eglence - Ve Fazlası




 
AnasayfaKayıt OlGiriş yap

Paylaş | 
 

 Css’i Html üzerinde kullanmak

Önceki başlık Sonraki başlık Aşağa gitmek 
YazarMesaj
MusallaTR
Admin
Admin
avatar

Mesaj Sayısı Mesaj Sayısı : 410
Rep Gücü Rep Gücü : 33
Doğum tarihi Doğum tarihi : 10/08/94
Kayıt tarihi Kayıt tarihi : 10/09/09
Nerden Nerden : İzmir
Ruh Hali Ruh Hali :

MesajKonu: Css’i Html üzerinde kullanmak   Ptsi 14 Eyl. 2009 - 17:32

Css’i Html üzerinde kullanmak için 3 yöntem (yerel-global-bağlantılı) . Şimdi ise komple bir css dosyasını Html üzerinde nasıl kullanacağımız görelim. Fakat öncelikle Html’deki etiketinin diğer etiketlerden farklı olarak bir kullanım tarzı bulunmakta. İlk önce ona değinelim.


(A) Etiketinin CSS İle Kullanımı


Bildiğiniz üzere
etiketi Html’e çok büyük bir özellik katan link etiketidir. Bu etiket ile diğer bir web sayfasına veya bir mail adresine gönderme yapabiliriz. Bu etiketin belli durumlarda aldığı değişik değerler vardır. Yani link tıklandığında etiket artık visited (ziyaret edilmiş) pozisyonuna geçecektir. Biz Css yardımıyla etiketinin aldığı posizyonlara istediğimiz biçimi verebiliriz. Şimdi etiketinin aldığı pozisyonları görelim :

İlk poziyon linke herhangi bir tıklama olmadığındadır. Bu değer linkin sayfada görülecek ilk halidir.
Visited : Bu pozisyon link tıklandığından sonra etiketin aldığı değerdir. Active : Bu pozisyon linkin aktif olduğu durumdur. Yani imleç linkin tıklandığı andaki durumdur. Hover : Bu pozisyon Linkin üzerine gelindiği durumdur. Yani linkin üzerine gelindiğinde nasıl bir biçimde olması isteniyorsa stil o şekilde verilir.
Şimdi
etiketi için bir stil dosyası yapalım.



Şimdi
etiketinin özel durumunu da gördükten sonra esaslı bir css kullanma tekniğini görelim. Bu örneğimizde
, , ,

...

,

, gibi Html etiketlerini kullanırken nasıl bir yöntem izlememiz gerektiğini göreceğiz.

İlk öncelikle stillerimiz hem bağlantılı hem global hem de yerel kullanacağız. Bunu belirteyim. Böylelikle sizde nasıl bir yol izlemenize karar verin.

Şimdi bağlantılı css dosyamızı hazırlayalım. Hatırlayacağınız üzere bu dosyanın uzantısı css olmalı. Bu css dosyasını Html dosyamızın içerisinde çağıracağız. Aşağıdaki kodları stil.css adıyla kaydedelim


Aşağıdaki kodları da css.html adıyla kaydedelim. (Dikkat ! html uzantlı kaydedin )


kod:

Kod:
<html>
<head>
<title>Css</title>
<style type="text/css">
<!--
.onemli {font-weight:bold;}
h4 {color:blue;
position : relative;
visibility : visible;
left : 25pt;
font-size:large;
.solic { color:brown;
font-family:"Verdana,Arial,Helvetica";
position : relative;
visibility : visible;
left : 20pt;
font-weight:bold; }
li { list-style-type : circle;
list-style-position : inside;
list-style : decimal;}
; -->
</style>
<link rel=stylesheet href="stil.css" type="text/css">
</head>
<body>
<table width="500" align="center">
<tr><td> <!-- Global -->
<h4>Bilgisayar;<a name="bsl">  </a></h4>
<!-- Eğer koordinatları tam olarak ayarlamak istiyorsanız (MSIE ve NN icin) Global Stil Şablonu Kullanmalısınız. -->
<!-- Bağlantılı -->
<p id="sol">
Aldığı komutlar uyarınca, veri işleyerek problem çözen otomatik elektronik aygıtların ortak adı. Bu tür aygıtlar, çalışma ilkeleri,donanım tasarımları ve uygulama alanları bakımından örneksel, sayısal ve karma bilgisayarlar olarak <font class="onemli">üçe</font> ayrılır.</p>
<p id="sol">
<ul>
<li><a href="css.html#orneksel">Örneksel (analog) bilgisayarlar</a>
<li><a href="css.html#sayisal">Sayısal bilgisayarlar</a>
<li><a href="css.html#karma">Karma bilgisayarlar</a>
</ul>
</p> <p class="solic">
Örneksel (analog) bilgisayarlar<a name="orneksel">  </a></p>
<p id="sol">Açısal konum ya da gerilim gibi değişken nicelikleri temsil eden veriler üzerinde işlem yapar ve çözülmesi istenen matematiksel problemin fiziksel bir örneğini oluştururlar. Sıradan diferensiyel denklemleri çözebilen örneksel bilgisayarlar, sistem mühendisliğinde, özellikle bazı süre ve donatımların gerçek zamanlı benzetim modellerinin oluşturulmasına çok elverişlidirler. Bu bilgisayarların bir başka yaygın kullanım alanı da elektrik dağıtım sistemi gibi şebekelerin analizidir.<br> 
<a href="css.html#bsl">Başa Dön</a>
</p>
<p class="solic">Sayısal bilgisayarlar,<a name="sayisal">  </a></p>
<p id="sol">Çeşitli üretim süreçlerine, takım tezgahlarına , karmaşık laboratuvar ve hastane aygıtlarına kumanda etmekte kullanılırlar. Aynı özellikten, uçakların ve uzay araçlarının karmaşık iletişim sistemlerinin otomatizasyonunda da yararlanılır. Sayısal bilgisayarlar ayrıca, eğitimde yardımcı olarak (örn. temel dil ve matematik becerilerinin kazandırılmasında) , bilimsel araştırmalarda ise verilerin analizi ve matematiksel modellerin geliştirilmesi amacıyla kullanılır.
<br> <a href="css.html#bsl">Başa Dön</a> </p>
<p class="solic">Karma bilgisayarlar,<a name="karma"> &nbsp;</a></p>
<p id="sol">Örneksel ve sayısal bilgisayarların özelliklerine ve yararlarını birleştirirler; örneksel bilgisayarlara oranla daha fazla kesinlik, sayısal bilgisayarlara oranla daha fazla deneteleme sağlarlar.
<br><a href="css.html#bsl">Başa Dön</a>
</p> </td> </tr> </table>
</body>
</html>


Burada birkaç konuya açıklık getirelim.

Bazı stil özelliklerinin sonunda gördüğünüz !important ifadesi ile ziyaretçi kendi bilgisayarındaki tarayıcı özelliklerini değiştirmiş olsa dahi bu değerleri kullanmamasının bizim belirttiğimiz değerleri kullanmasını söylemiş oluyoruz. Font özelliklerinde çoğu zaman birden çok font ismi kullandık. Bunun nedeni eğer ziyaretçinin makinasında ilk font yoksa ikincisi o da yoksa üçüncü font kullanılır. Şayet o fontta yoksa tarayıcının kendi banko fontu kullanılır. Böylelikle bizde değişik ziyaretçi makinalarında sayfamızın nasıl görünebileceğini öncelikle kontrol altına almış oluruz.


Not: Bu css ve html dosyaların için fon.gif , fon2.gif dosyalarına ihtiyaç vardır.
Sayfa başına dön Aşağa gitmek
http://citycss.zforum.biz
Pashaa
General
General
avatar

Mesaj Sayısı Mesaj Sayısı : 603
Rep Gücü Rep Gücü : 22
Doğum tarihi Doğum tarihi : 24/02/96
Kayıt tarihi Kayıt tarihi : 10/09/09
Nerden Nerden : BuRSa
Ruh Hali Ruh Hali :

MesajKonu: Geri: Css’i Html üzerinde kullanmak   Cuma 18 Eyl. 2009 - 17:10

saol paylasım ıcın
Sayfa başına dön Aşağa gitmek
http://www.ayarsizpaylasim.tr.gg
 
Css’i Html üzerinde kullanmak
Önceki başlık Sonraki başlık Sayfa başına dön 
1 sayfadaki 1 sayfası

Bu forumun müsaadesi var:Bu forumdaki mesajlara cevap veremezsiniz
Html - Css - Eglence - Ve Fazlası :: Tr.Gg Dünyası :: Css Hakkında Herşey-
Buraya geçin: