thumbnail

CSS Kaydırma (CSS Float)

Float, Css ile web sayfası tasarımı yaparken en çok kullanılan değerlerin başında gelir. Elementi akışın dışına çıkarmak için kullanılan yöntemdir. Bu özellikler ile nesnelerin pozisyonları belirlenir.


<! DOCTYPE html>

<html>

&nbsp;

<head>

<title>CSS Float</>

<style>

.resim {

float: right;

}

</style>

</head>

<body>

<img class="resim" src="../klasor/resim.png" />

</body>

</hmtl>

Yukarıdaki örnekte tanımladığım “float” içine “right” değerini verdim. “float” değerini atamamış olsaydık tarayıcıda çalıştırdığımızda resim sol tarafta görünecekti. Ancak “right” konumlandırmasını yaptığımızdan sağ tarafta görüntülenecek. Ayrıca float içerisinde left,right,inherit değerini atayabiliriz.

Eğer isterseiz div elementi içinde genişlik ve yükseklik belirleyebilirsiniz. Aşağıda hemen örneğini yapalım.


<!DOCTYPE html>

<html>

&nbsp;

<head>

<title>CSS Float</title>

<style>

.ornek1 {

float: right;

width: 200px;

height: 200px;

border: 1px solid #000000;

}

</style>

</head>

&nbsp;

<body>

<div class="ornek1"></div>

</body>

&nbsp;

<html>

float ile kaydırma/konumlandırma işlemini yaptık. Diğer CSS derslerimizde mutlaka görüşelim 😀

 

3 Comments

  1. Yazının içine bir türlü yerleştirememiştim hep bir sorun çıkıyordu. Teşekkür ederim anlatım detaylı ve güzel olmuş.

  2. Mutlaka görüşelim (: Hemen bir kaç deneme yapalım şimdi CSS ile teşekkürler örnekler için.

Bir Cevap Yazın

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir