Hàm calc() trong CSS

Định nghĩa và cách sử dụng

CSS calc() Hàm thực hiện tính toán và sử dụng kết quả làm giá trị thuộc tính.

Mẫu

Sử dụng calc() Tính toán độ rộng của phần tử <div>:

#div1 {
  position: absolute;
  left: 50px;
  width: calc(100% - 100px);
  border: 1px solid black;
  background-color: yellow;
  padding: 5px;
  text-align: center;
}

Thử ngay

Ngữ pháp CSS

calc(expression)
Giá trị Mô tả
expression

Bắt buộc. Một biểu thức toán học, kết quả của nó sẽ được sử dụng làm giá trị.

Có thể sử dụng các toán tử sau: +, -, *, /.

Chi tiết kỹ thuật

Phiên bản: CSS3

Hỗ trợ trình duyệt

Số trong bảng biểu thị phiên bản trình duyệt đầu tiên hỗ trợ đầy đủ hàm đó.

Chrome Edge Firefox Safari Opera
26 9 16 7 15

Trang liên quan

Tham khảo:Hàm acos() trong CSS

Tham khảo:Hàm asin() trong CSS

Tham khảo:Hàm atan() trong CSS

Tham khảo:Hàm atan2() trong CSS

Tham khảo:Hàm cos() trong CSS

Tham khảo:Hàm exp() trong CSS

Tham khảo:Hàm hypot() trong CSS

Tham khảo:Hàm log() trong CSS

Tham khảo:Hàm mod() trong CSS

Tham khảo:Hàm pow() trong CSS

Tham khảo:Hàm sin() CSS

Tham khảo:Hàm sqrt() CSS

Tham khảo:Hàm tan() CSS