En İyi Sosyal Medya Siteleri

CSS Kullanarak Şekiller Nasıl Oluşturulur ? 2020

Teknobu — 5 yıl ago reading time 1 minutes

Bu makalede, CSS kullanarak bazı farklı şekil türleri tasarlayacağız. CSS ile her türlü şekli yapabilir.

Css İle Kare oluşturma

<!DOCTYPE html> 
<html> 
  
<head> 
    <style> 
        .square { 
            height: 50px; 
            width: 50px; 
            background-color: green; 
        } 
    </style> 
</head> 
  
<body> 
    <div class="square"></div> 
</body> 
  
</html>

Ekran Çıktısı

Çember Oluşturma

<!-- Write HTML code here -->
<!DOCTYPE html> 
<html> 

<head> 
	<style> 
		.circle { 
			height: 70px; 
			width: 70px; 
			background-color: green; 
			border-radius: 50%; 
		} 
	</style> 
</head> 

<body> 
	<div class="circle"></div> 
</body> 

</html>

Ekran Çıktısı

Dikdörtgen oluşturma

<!DOCTYPE html> 
<html> 

<head> 
	<style> 
		.rectangle { 
			height: 50px; 
			width: 80px; 
			background-color: green; 
		} 
	</style> 
</head> 

<body> 
	<div class="rectangle"></div> 
</body> 

</html>

Ekran Çıktısı

Tags: css şekiller