OPACİTY NEDİR? NASIL KULLANILIR?
Bu özelliği kullanarak
bir öğenin saydamlığını değiştirebiliyoruz.
Kullanımı:
<img src=”abc. jpg” style=”opacity:0,4;filter:alpha(opacity=40);
Onmouseover=”this.
style.opacity=1;this.filters.alpha.opacity=”100”
Onmouseout=”this.style.opacity=0.4;this.filters.alpha.opacity=40”/>
örneklendirelim:
<title>OPACITY</title>
<style type="text/css">
.rsm img{width:250px;height:200px;}
p{color:green;font-size:24px;}
</style>
</head>
<body>
<p>Opacity özelligi ile bir ögenin saydamligini degistirebiliyoruz...</p>
<div class="rsm">
<img src="abc.jpg" style="opacity:0.4; filter:alpha(opacity=40)"
onmouseover="this.style.opacity=1;this.filters.alpha.opacity=100"
onmouseout="this.style.opacity=4;this.filters.alpha.opacity=40"/>
</div>
</body>
örneklendirelim:
<title>OPACITY</title>
<style type="text/css">
.rsm img{width:250px;height:200px;}
p{color:green;font-size:24px;}
</style>
</head>
<body>
<p>Opacity özelligi ile bir ögenin saydamligini degistirebiliyoruz...</p>
<div class="rsm">
<img src="abc.jpg" style="opacity:0.4; filter:alpha(opacity=40)"
onmouseover="this.style.opacity=1;this.filters.alpha.opacity=100"
onmouseout="this.style.opacity=4;this.filters.alpha.opacity=40"/>
</div>
</body>
FLOAT NEDİR? NASIL
KULLANILIR?
Bu özellik
ile birlikte bir elemanı diğerlerinden bağımsız olarak sağ yada solda gösterip
elemanın gerisinde kalan alanları(aşağı yada yukarı) boşluk olarak
değerlendirip o alanları da kullanabileceğimiz sayfalar yapabiliriz.
kullanımı:
<title>FLOAT</title>
<style type="text/css">
<style type="text/css">
img{width:350px;height:300px;float:right;}
</style>
</head>
</head>
<body>
<u>float = </u>Bu özellik ile birlikte bir elemani digerlerinden bagimsiz olarak <b> sag ya da solda gösterip</b>
elemanin geride kalan alanlari kullanabilecegimiz sayfalar yapabiliriz. Bunu bir resim için yapalim...
<img src="abcd.jpg"/><br><h1>simdi sol tarafta kalan bos alani kullanabilirz. :)</h1>
<u>float = </u>Bu özellik ile birlikte bir elemani digerlerinden bagimsiz olarak <b> sag ya da solda gösterip</b>
elemanin geride kalan alanlari kullanabilecegimiz sayfalar yapabiliriz. Bunu bir resim için yapalim...
<img src="abcd.jpg"/><br><h1>simdi sol tarafta kalan bos alani kullanabilirz. :)</h1>
</body>
WİDTH= Genişlik ayarı.
<title>WIDTH/</title>
<style type="text/css">
.rsm2 img{width:750px;}</style>
</head>
<style type="text/css">
.rsm2 img{width:750px;}</style>
</head>
<body>
<u> WIDTH :</u> bu özellikle genislik ayarlari belirtilir. <i>Bir resimle örneklendirelim...</i><br>
<h3>resmin ilk hali</h3><br>
<img src="abcde.jpg" />
<div class="rsm2">
<h3>BUDA RESMIMIZIN GENISLIGIYLE OYNANMIS HALI</h3>
<img src="abcde.jpg" />
</div>
</body>
<u> WIDTH :</u> bu özellikle genislik ayarlari belirtilir. <i>Bir resimle örneklendirelim...</i><br>
<h3>resmin ilk hali</h3><br>
<img src="abcde.jpg" />
<div class="rsm2">
<h3>BUDA RESMIMIZIN GENISLIGIYLE OYNANMIS HALI</h3>
<img src="abcde.jpg" />
</div>
</body>
HEİGHT=Yükseklik ayarı.
<title>HEIGHT/</title>
<style type="text/css">
.rsm2 img{height:100px;}</style>
</head>
<style type="text/css">
.rsm2 img{height:100px;}</style>
</head>
<body>
<u> HEIGHT :</u> bu özellikle yükseklik ayarlari belirtilir. <i>Bir resimle örneklendirelim...</i><br>
<h3>resmin ilk hali</h3><br>
<img src="abcde.jpg" />
<div class="rsm2">
<h3>BUDA RESMIMIZIN YÜKSEKLİĞİYLE OYNANMIS HALI</h3>
<img src="abcde.jpg" />
</div>
</body>
<u> HEIGHT :</u> bu özellikle yükseklik ayarlari belirtilir. <i>Bir resimle örneklendirelim...</i><br>
<h3>resmin ilk hali</h3><br>
<img src="abcde.jpg" />
<div class="rsm2">
<h3>BUDA RESMIMIZIN YÜKSEKLİĞİYLE OYNANMIS HALI</h3>
<img src="abcde.jpg" />
</div>
</body>
Hiç yorum yok:
Yorum Gönder