clear հատկությունը

clear հատկությունը չեղարկում է մեկ էլեմենտի հոսքը մյուսներով, որը սահմանված է float հատկությամբ։ Կարող է ընդունել հետևյալ արժեքները․ none (չեղարկում է սեփական գործողությունը), both (չեղարկում է float միաժամանակ աջից և ձախից), left (չեղարկում է float ձախից), right (չեղարկում է float աջից)։

Շարահյուսություն

cssընտրիչ {
  clear: none կամ left կամ right կամ both
}

Օրինակ

Եկեք չեղարկենք նկարի հոսքը տեքստով ձախից․

html<img class="image" src="bg.png" alt="">
<div class="txt">
  <p>
    տեքստ տեքստ տեքստ տեքստ տեքստ տեքստ
    տեքստ տեքստ տեքստ տեքստ տեքստ տեքստ
    տեքստ տեքստ տեքստ տեքստ տեքստ տեքստ
    տեքստ տեքստ տեքստ տեքստ տեքստ տեքստ
  </p>
</div>

css.image {
  float: left;
  padding-right: 10px;
}
.txt {
  clear: left;
}

Результат:

Օրինակ

Հիմա եկեք չեղարկենք նկարի հոսքը տեքստով աջից․

html<img class="image" src="bg.png" alt="">
<div class="txt">
  <p>
    տեքստ տեքստ տեքստ տեքստ տեքստ տեքստ
    տեքստ տեքստ տեքստ տեքստ տեքստ տեքստ
    տեքստ տեքստ տեքստ տեքստ տեքստ տեքստ
    տեքստ տեքստ տեքստ տեքստ տեքստ տեքստ
  </p>
</div>

css.image {
  float: right;
  padding-right: 10px;
}
.txt {
  clear: right;
}

Результат:

Օրինակ

Եկեք չեղարկենք clear հատկության սեփական գործողությունը․

html<img class="image" src="bg.png" alt="">
<div class="txt">
  <p>
    տեքստ տեքստ տեքստ տեքստ տեքստ տեքստ
    տեքստ տեքստ տեքստ տեքստ տեքստ տեքստ
    տեքստ տեքստ տեքստ տեքստ տեքստ տեքստ
    տեքստ տեքստ տեքստ տեքստ տեքստ տեքստ
  </p>
</div>

css.image {
  float: right;
  padding-right: 10px;
}
.txt {
  clear: none;
}

Результат:

Տես նաև