CSS ile 3 Boyutlu Yazı
Yazar: SBayir Tarih: Ağustos 17, 2010 · Yorum Yap , Kategori: CSS
Etiketler: css efekt, css ile 3 boyutlu, css ile cool yazı, css yazı şekli, şekilli yazı
Aklıma gelmişti ama kurcalamamıştım diyebileceğim bir konu rastgele dolaşırken karşıma çıktı. Peki bunu nasıl yapabiliriz?
Margin’leri ile oynadığımız 2 yazının farklı renklerde ve koordinatlarının değişimi bu görüntüyü veriyor.
Elimizde bir div birde h1 tagları var. Div id’si “container”.
CSS :
body { background: #eee; }
#container {
width: 800px; height: 380px; margin: 50px auto; padding: 170px 0 0 0; text-align: center;
background: url(main-bg.jpg) 0 0 no-repeat;
}h1 {
display: inline;
position: relative;
font: 200px Helvetica, Sans-Serif;
letter-spacing: -5px;
color: rgba(0,0,255,0.5);
}h1:after {
content: “Hello”;
position: absolute; left: 10px; top: 5px;
color: rgba(255,0,0,0.5);
}
ve HTML :
<div id=“container”>
<h1>Hello</h1>
</div>
