CSS中的浮動和不浮動都是布局中常用的屬性，下面我們一起來了解一下。

.float {
float: left;
width: 50%;
}
.no-float {
width: 50%;
}

首先，我們來看一下浮動屬性。設置元素的float屬性為left或right，可以使元素脫離文檔流，向左或向右浮動。當使用浮動屬性時，可以同時設置其寬度，以實現元素間的間距。

比如上述代碼中的.float類，設置了一個寬度為50%的元素向左浮動，可以使另外一個元素與之排列在同一行而不會換行。

但是，浮動屬性也會帶來一些問題，如浮動的元素與其后面的元素出現重疊等。此時可以使用清除浮動的方法，即在浮動元素的父元素中添加clearfix類。

.clearfix::after {
content: '';
display: block;
clear: both;
}

緊接著，我們來看一下不浮動的屬性。不浮動屬性指的是不設置float屬性的元素，它們會保持在文檔流中，不會脫離文檔流。不浮動的元素可以使用display屬性設置為block或inline-block，以實現寬度設置和行內元素轉為塊級元素的效果。

比如上述代碼中的.no-float類，設置了一個寬度為50%的塊級元素。這個元素會在文檔流中占據50%的寬度，與之排在同一行的下一個元素會自動換行。

總的來說，浮動和不浮動屬性的使用需要靈活掌握，在具體實踐中根據需要進行合理選擇。