Computer >> Máy Tính >  >> Lập trình >> HTML

Nền kiểu HTML DOM

Thuộc tính style backgroundRepeat được sử dụng để đặt hoặc lấy cách hình nền lặp lại chính nó.

Cú pháp

Sau đây là cú pháp cho -

Đặt thuộc tính backgroundRepeat -

object.style.backgroundRepeat = "repeat|repeat-x|repeat-y|no-repeat|initial|inherit"

Giá trị

Sau đây là các giá trị thuộc tính ở trên -

Sr.No Giá trị &Mô tả
1 lặp lại
Đây là giá trị mặc định. Nó lặp lại hình nền theo chiều dọc và chiều ngang của cả hai.
2 repeat-x
Điều này chỉ lặp lại hình nền theo chiều ngang.
3 repeat-y
Thao tác này chỉ lặp lại hình nền theo chiều dọc
4 không lặp lại
Không lặp lại hình nền.

Ví dụ

Chúng ta hãy xem một ví dụ cho thuộc tính backgroundRepeat -

<!DOCTYPE html>
<html>
<head>
<style>
   body {
      background-image: url("https://www.tutorialspoint.com/power_bi/images/power-bi-minilogo.jpg");
      background-repeat: repeat-x;
      color:black;
      font-size:20px;
   }
</style>
<script>
   function changeBackRepeat(){
      document.body.style.backgroundRepeat="repeat-y";
      document.getElementById("Sample").innerHTML="The background image is now repeated vertically";
   }
</script>
</head>
<body>
<h2>Demo Heading</h2>
<p>This is demo text.</p>
<p>This is demo text.</p>
<p>This is demo text.</p>
<p>This is demo text.</p>
<p>Change the body background image repeat value by clicking the below button</p>
<button onclick="changeBackRepeat()">CHANGE REPEAT</button>
<p id="Sample"></p>
</body>
</html>

Đầu ra

Điều này sẽ tạo ra kết quả sau -

Nền kiểu HTML DOM

Khi nhấp vào nút THAY ĐỔI LẶP LẠI -

Nền kiểu HTML DOM