left Özelliği

left özelliği, bir öğenin sol kenarının konumunu belirler. Özellik için değerler, piksel, inç, punto, yüzde gibi yaygın boyut birimleriyle yazılabilir. Belirlenen değerler negatif sayılar da olabilir, bu durumda öğeler üst üste binecektir. Koordinatların sayımı, genellikle relative (göreli konum) veya absolute (mutlak konum) değerini alan position özelliği tarafından belirlenir.

Sözdizimi

cssseçici {
  left: boyut veya auto;
}

Örnek

Alt öğenin üzerine gelindiğinde, sol kenar konumunu 25px olarak ayarlayalım:

html<div id="elem">
  <p></p>
</div>

css#elem {
  width: 400px;
  height: 300px;
  border: 1px solid black;
}
p {
  position: relative;
  width: 100px;
  height: 100px;
  border: 1px solid red;
  margin-left: 50px;
}
p:hover {
  left: 25px;
  width: 100px;
  height: 100px;
  border: 1px solid red;
}

Результат:

Örnek

Şimdi de alt öğenin üzerine gelindiğinde sol kenarının -50px konumunda olmasını sağlayalım:

html<div id="elem">
  <p></p>
</div>

css#elem {
  width: 400px;
  height: 300px;
  border: 1px solid black;
}
p {
  position: relative;
  width: 100px;
  height: 100px;
  border: 1px solid red;
  margin-left: 50px;
}
p:hover {
  left: -50px;
  width: 100px;
  height: 100px;
  border: 1px solid red;
}

Результат:

Ayrıca Bakınız