Ali @mintik
8 Haziran 2021 13:27

0

Beatiful animated buttons

Web sitenizde kullanabileceğiniz animasyonlu buton örneği. Sazzad Hossain tarafından hazırlanmış bu buton örnekleri mouse üzerine geldiğinde başlıklar görünüyor ve butonlardaki ikonlar biraz daha yaklaşıp daha büyük bir halle geliyor Butonların arkaplanında bulunan renkli resimler kodları alınarak css dosyasının içine kod olarak entegre edildiği saf Css3 gibi görünüyor. olsa da saf css değil.

Download

Demo

Kullanım

Head etiketileri arasına eklemeniz gereken bölüm.

Css dosya adresi :

<link href="stil.css" media="all" rel="stylesheet" type="text/css" />

Body etiketleri arasına eklemeniz gereken bölüm.

Html :

<div class="gridcontainer clearfix">
	<div class="grid_3">
		<div class="fmcircle_out">
			<a href="http://mintik.com/?p=11865">
				<div class="fmcircle_border">
					<div class="fmcircle_in fmcircle_blue">
						<span>Web-Design</span><img src="https://dl.dropbox.com/u/65958930/uploads/cssdeck/design.png" alt="" />
					</div>
				</div>
			</a>
		</div>
	</div>

	<div class="grid_3">
		<div class="fmcircle_out">
			<a href="http://mintik.com/?p=11865">
				<div class="fmcircle_border">
					<div class="fmcircle_in fmcircle_green">
						<span>Branding</span><img src="https://dl.dropbox.com/u/65958930/uploads/cssdeck/logo.png" alt="" />
					</div>
				</div>
			</a>
		</div>
	</div>

	<div class="grid_3">
		<div class="fmcircle_out">
			<a href="http://mintik.com/?p=11865">
				<div class="fmcircle_border">
					<div class="fmcircle_in fmcircle_red">
						<span>Integration</span><img src="https://dl.dropbox.com/u/65958930/uploads/cssdeck/develop.png" alt="" />
					</div>
				</div>
			</a>
		</div>
	</div>
</div>