Tidadigi Logo

CSS scale() Function

Hàm scale() là một hàm dựng sẵn để thay đổi kích thước phần tử trong mặt phẳng 2D. Nó điều chỉnh kích thước phần tử theo chiều ngang và chiều dọc.

Cú pháp:

scale( sx )

hoặc

scale( sx, sy )

Tham số:

  • sx: Nó thay đổi kích thước các phần tử theo chiều ngang.
  • sy: Nó thay đổi kích thước các phần tử theo chiều dọc. Nếu giá trị của sy không được xác định thì nó sẽ thay đổi kích thước phần tử theo sx theo cả hai hướng. (ngang và dọc).

Các ví dụ dưới đây minh họa scale() trong CSS:

Ví dụ 1:

html 
<!DOCTYPE html> 
<html> 
<head> 
    <title>CSS scale() function</title> 
    <style> 
        body {
            text-align:center;
        }
        h1 {
            color:green;
        }
        .scale_image {
            transform: scale(1.5);
        }
    </style> 
</head> 

<body> 
    <h1>GeeksforGeeks</h1>
    <h2>CSS scale() function</h2>
    <br><br>
    <img class="scale_image" src= 
"https://media.geeksforgeeks.org/wp-content/cdn-uploads/20190710102234/download3.png"
        alt="GeeksforGeeks logo"> 
</body> 
</html>

Đầu ra:

 css-scale-function Ví dụ 2:

html 
<!DOCTYPE html> 
<html> 
<head> 
    <title>CSS scale() function</title> 
    <style> 
        body {
            text-align:center;
        }
        h1 {
            color:green;
        }
        .GFG {
            font-size:35px;
            font-weight:bold;
            color:green;
            transform: scale(1, 2);
        }
    </style> 
</head> 

<body> 
    <h1>GeeksforGeeks</h1>
    <h2>CSS scale() function</h2>

    <div class="GFG">Welcome to GeeksforGeeks</div> 
</body> 
</html>

Đầu ra:

 css-scale-function 

Trình duyệt được hỗ trợ: Các trình duyệt được hỗ trợ bởi scale() được liệt kê dưới đây:

  • Google Chrome 1
  • Edge 12
  • Internet Explorer 9
  • Firefox 3.5
  • Safari 3.1
  • Opera 10.5

Last Updated : 21/07/2025