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

Thuộc tính rõ ràng kiểu DOM HTML

Thuộc tính rõ ràng HTML DOM được sử dụng để lấy hoặc thiết lập vị trí của một phần tử nổi. Nó được sử dụng để chỉ định liệu một phần tử có nên được di chuyển xuống bên dưới một phần tử nổi khác hay không.

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

Đặt thuộc tính rõ ràng -

object.style.clear='none|left|right|both|initial|inherit'

Các thuộc tính trên được giải thích như sau -

Các phần tử Các phần tử
Giá trị Mô tả
còn lại không được thả nổi ở phía bên trái.
đúng Các phần tử không được thả nổi ở phía bên phải
cả Các phần tử không được thả nổi ở cả bên trái và bên phải.
không có được thả nổi ở cả hai bên và đây là giá trị mặc định.
kế thừa Để kế thừa giá trị thuộc tính mẹ

Hãy để chúng tôi xem xét một ví dụ cho thuộc tính rõ ràng -

Ví dụ

<!DOCTYPE html>
<html>
<head>
<style>
   img {
      margin: 5px;
      float: right;
      clear: both;
      border: 2px solid orange;
   }
   #DIV1{
      clear:left;
   }
</style>
<script>
   function changeClear(){
      document.getElementById("DIV1").style.clear="right";
      document.getElementById("Sample").innerHTML="The div clear property is changed to right from left ";
   }
</script>
</head>
<body>
   <img src="https://www.tutorialspoint.com/qlikview/images/qlikview-mini-logo.jpg">
   <div id="DIV1">This is sample text inside div. This is another line inside the div.Here is a div       containing some random english text. This div is created to demonstrate clear    property </div>
   <p>Change the above div clear property by clicking the below button</p>
   <button onclick="changeClear()">Change Clear</button>
   <p id="Sample"></p>
</body>
</html>

Đầu ra

Thuộc tính rõ ràng kiểu DOM HTML

Khi nhấp vào nút “Xóa thay đổi” nút -

Thuộc tính rõ ràng kiểu DOM HTML