La funci贸n scaleX() es una funci贸n incorporada que se utiliza para cambiar el tama帽o de un elemento a lo largo del eje x en un plano 2D. Escala los elementos en direcci贸n horizontal.
Sintaxis:
scaleX() = scaleX( number )
Par谩metros: esta funci贸n acepta un n煤mero de par谩metro 煤nico que contiene el factor de escala a lo largo del eje x.
Los siguientes ejemplos ilustran la funci贸n scaleX() en CSS:
Ejemplo 1:
<!DOCTYPE html>聽
<html>聽
聽聽
<head>聽
聽聽聽聽<title>CSS scaleX() function</title>聽
聽聽
聽聽聽聽<style>聽
聽聽聽聽聽聽聽聽body {
聽聽聽聽聽聽聽聽聽聽聽聽text-align:center;
聽聽聽聽聽聽聽聽}
聽聽聽聽聽聽聽聽h1 {
聽聽聽聽聽聽聽聽聽聽聽聽color:green;
聽聽聽聽聽聽聽聽}
聽聽聽聽聽聽聽聽.scaleX_image {
聽聽聽聽聽聽聽聽聽聽聽聽transform: scaleX(2);
聽聽聽聽聽聽聽聽}
聽聽聽聽</style>聽
</head>聽
聽聽
<body>聽
聽聽聽聽<h1>GeeksforGeeks</h1>
聽聽聽聽<h2>CSS scaleX() function</h2>
聽聽聽聽聽聽
聽聽聽聽<br><br>
聽聽聽聽聽聽
聽聽聽聽<img class="scaleX_image" src=聽
"https://media.geeksforgeeks.org/wp-content/cdn-uploads/20190710102234/download3.png"
聽聽聽聽聽聽聽聽alt="GeeksforGeeks logo">聽
</body>聽
聽聽
</html>
Producci贸n:
Ejemplo 2:
<!DOCTYPE html>聽
<html>聽
聽聽
<head>聽
聽聽聽聽<title>CSS scaleX() function</title>聽
聽聽聽聽聽聽
聽聽聽聽<style>聽
聽聽聽聽聽聽聽聽body {
聽聽聽聽聽聽聽聽聽聽聽聽text-align:center;
聽聽聽聽聽聽聽聽}
聽聽聽聽聽聽聽聽h1 {
聽聽聽聽聽聽聽聽聽聽聽聽color:green;
聽聽聽聽聽聽聽聽}
聽聽聽聽聽聽聽聽.GFG {
聽聽聽聽聽聽聽聽聽聽聽聽font-size:35px;
聽聽聽聽聽聽聽聽聽聽聽聽font-weight:bold;
聽聽聽聽聽聽聽聽聽聽聽聽color:green;
聽聽聽聽聽聽聽聽聽聽聽聽transform: scaleX(1.5);
聽聽聽聽聽聽聽聽}
聽聽聽聽</style>聽
</head>聽
聽聽
<body>聽
聽聽聽聽<h1>GeeksforGeeks</h1>
聽聽聽聽<h2>CSS scaleX() function</h2>
聽聽
聽聽聽聽<div class="GFG">Welcome to GeeksforGeeks</div>聽
</body>聽
聽聽
</html>
Producci贸n:
Navegadores compatibles: los navegadores compatibles con la funci贸n scaleX() se enumeran a continuaci贸n:
- Google Chrome
- explorador de Internet
- Firefox
- 脫pera
- Safari
Publicaci贸n traducida autom谩ticamente
Art铆culo escrito por jit_t y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA