css geometrik şekiller etiketine sahip kayıtlar gösteriliyor. Tüm kayıtları göster
css geometrik şekiller etiketine sahip kayıtlar gösteriliyor. Tüm kayıtları göster

29 Haziran 2013 Cumartesi

CSS ile Geometrik Şekiller Oluşturma

Css ile kare , dikdörtgen ,daire üçgen gibi temel geometrik şekiller oluşturmak için tablo halinde css geometrik şekiller isimli bir tablo hazırladım.Buradaki kodları kullanarak sizlerde css ile geometrik şekiller oluşturabilir ve geliştirebilirsiniz.
Kare Dikdörtgen Elmas Üçgen Daire
#kare { width: 100px; height: 100px; background: blue; margin-left:auto; margin-right:auto; } #dikdörtgen { width: 100px; height: 60px; background: blue; margin-left:auto; margin-right:auto; } #elmas{ width: 80px; height: 80px; background: blue; -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); -webkit-transform-origin: 0 100%; -moz-transform-origin: 0 100%; -ms-transform-origin: 0 100%; -o-transform-origin: 0 100%; transform-origin: 0 100%; text-align: center; float: right; margin-top: 3px; margin-right: 0; margin-bottom: 0; margin-left: 30px;} #ucgen { width: 0; height: 0; border-bottom: 100px solid red; border-left: 50px solid transparent; border-right: 50px solid transparent; } #circle { width: 90px; height: 90px; background: yellow; -moz-border-radius: 45px; -webkit-border-radius: 45px; border-radius: 45px; }
//Luckyorange//