Saturday, June 20, 2009

css deneylerim - üçgen

çok güzel css deneyleri ile karşılaştım bu gün. Biraz biraz denemelere başladım ben de.
Herkes gibi css ve üçgen meselesine uzaktan giriş yaptım:


benim üçgen modelim şöyle oldu:
(css ile sadece dik kenar üçgen çizmek için bir prototiptir. yükseklik, taban uzunluğu, konum ve renk değiştirilebilir.)
css:
<style type="text/css" media="screen">
  .ust {
  position:absolute; 
  left:150px; top:100px;/* konumlandır */   }

  .ust div {
    border-left-color: transparent;
    border-style: solid;
  }
  .ic{
  border-width: 0 0 /* taban: */ 300px /* yükseklik : */ 200px;
  border-bottom-color: #955;
  }
</style>
html:
<div class="ust">
<div class="ic"></div>
</div>
sonuç:

biraz oynayınca şuna benzer çıktılar da elde edilebilir.



konuyu irdelemek için:
http://www.tantek.com/ (css ve geometrik şekiller ile ilgili ilk incelediğim site)
http://www.tantek.com/CSS/Examples/polygons.html (yöntemler harika)

No comments: