ສາຍສາວນິຍົມ CSS

ສາຍສາວນິຍົມ CSS

CSS float ປະສົບຜົນຈະກໍານົດໃຫ້ບັນດາປະກອບຈະອອກອາກາດໄດ້ຫຼືບໍ່.

CSS clear ປະສົບຜົນຈະກໍານົດໃຫ້ບັນດາປະກອບໃດທີ່ສາມາດກັນກັບບັນດາປະກອບທີ່ຈະກັນບໍລິສັດແລະໃນທາງໃດ.

ປະສົບຜົນ float

float ປະສົບຜົນຈະນໍາໃຊ້ເພື່ອການຈັດການການທີ່ຕິດຕັ້ງແລະຈຳນວນສິ່ງທີ່ສາມາດກັນກັບບັນດາປະກອບທີ່ຈະກັນບໍລິສັດ. ເພື່ອຫຼິ້ນກັບພາບທີ່ອອກອາກາດໄປຊ້າຍຫາຂໍ້ຄວາມໃນບໍລິສັດ.

float ປະສົບຜົນທີ່ສາມາດກວາດໃຊ້ໄດ້ແມ່ນ:

  • left - ບັນດາປະກອບຈະອອກອາກາດໃນທາງຊ້າຍຂອງບໍລິສັດ
  • right - ບັນດາປະກອບຈະອອກອາກາດໃນທາງຊ້າຍຂອງບໍລິສັດ
  • none - ບັນດາປະກອບຈະບໍ່ອອກອາກາດ (ຈະສະແດງຢູ່ບ່ອນທີ່ຈະອອກມາກ່ອນຄືນ). ຄວາມຄິດສົມບູນ.
  • inherit - ບັນດາປະກອບຈະຮັບຄວາມຄິດ float ຈາກພາຍເພີ່ມພັນຂອງມັນ

ການນໍາໃຊ້ທີ່ງາມກວ່າຢູ່ນີ້ແມ່ນ:float ປະສົບຜົນຂອງປະສານງານຈະສະແດງຄວາມຄິດຂອງຕົວແທນພາບ.

ຄວາມນິຍົມ - float: right;

ບົດຕາມນີ້ຈະກໍານົດໃຫ້ພາບຕັ້ງຢູ່ໃນຄືນຂອງຂໍ້ຄວາມທີ່ການອອກອາກາດໄປຊ້າຍ:

ປາຍາມານິຍົມ

领先的 Web 技术教程 - 全部免费。在 CodeW3C.com，你可以找到你所需要的所有的网站建设教程。从基础的 HTML 到 CSS，乃至进阶的 XML、SQL、JS、PHP。

我们的参考手册涵盖了网站技术的方方面面。其中包括W3C标准技术：HTML、CSS、XML 。以及其他技术，诸如 JavaScript、PHP、SQL 等。

在 CodeW3C.com，我们提供上千个实例。通过使用我们的在线编辑器，你可以编辑这些例子，并对代码进行实验。

实例

img {
  float: right;
{}

亲自试一试

ຄວາມນິຍົມ - float: left;

ບົດຕາມນີ້ຈະກໍານົດໃຫ້ພາບຕັ້ງຢູ່ໃນຄືນຂອງຂໍ້ຄວາມຂ້າງຊ້າຍການອອກອາກາດ:

ປາຍາມານິຍົມ

领先的 Web 技术教程 - 全部免费。在 CodeW3C.com，你可以找到你所需要的所有的网站建设教程。从基础的 HTML 到 CSS，乃至进阶的 XML、SQL、JS、PHP。

我们的参考手册涵盖了网站技术的方方面面。其中包括W3C标准技术：HTML、CSS、XML 。以及其他技术，诸如 JavaScript、PHP、SQL 等。

在 CodeW3C.com，我们提供上千个实例。通过使用我们的在线编辑器，你可以编辑这些例子，并对代码进行实验。

实例

img {
  float: left;
{}

亲自试一试

ຄວາມນິຍົມ - No float

ໃນບົດຕາມນີ້ພາບຈະສະແດງຢູ່ບ່ອນທີ່ຈະອອກມາກ່ອນຄືນ (float: none;):

ປາຍາມານິຍົມ 领先的 Web 技术教程 - 全部免费。在 CodeW3C.com，你可以找到你所需要的所有的网站建设教程。从基础的 HTML 到 CSS，乃至进阶的 XML、SQL、JS、PHP。 我们的参考手册涵盖了网站技术的方方面面。其中包括W3C标准技术：HTML、CSS、XML 。以及其他技术，诸如 JavaScript、PHP、SQL 等。 在 CodeW3C.com，我们提供上千个实例。通过使用我们的在线编辑器，你可以编辑这些例子，并对代码进行实验。

实例

img {
  float: none;
{}

亲自试一试

延伸阅读

课外书：CSS Float