translateX ශ්‍රිතය

translateX ශ්‍රිතය මූලද්‍රව්‍යය X අක්ෂය ඔස්සේ මාරු කිරීම අර්ථ දක්වයි. ගුණය සමඟ එක්ව භාවිතා කරයි transform. ගුණයේ අගය ලෙස ඕනෑම ප්‍රමාණ ඒකක සේවය කරයි. ධන අගයක් දකුණට මාරු කරයි, ඍණ අගයක් - වමට.

වාග් රීතිය

cssතෝරන්නා {
  transform: translateX(මාරුව);
}

නිදර්ශනය

මූසිකය බ්ලොක් එක මත ගෙන ගියහොත් - එය මාරු වේ 30px දකුණට:

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

css#elem {
  border: 1px solid black;
  width: 100px;
  height: 50px;
}
#elem:hover {
  transform: translateX(30px);
}

Результат:

නිදර්ශනය

මූසිකය බ්ලොක් එක මත ගෙන ගියහොත් - එය මාරු වේ 30px වමට:

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

css#elem {
  border: 1px solid black;
  width: 100px;
  height: 50px;
}
#elem:hover {
  transform: translateX(-30px);
}

Результат:

තවද බලන්න