CSS3中的寬度減法指的是使用calc()函數將元素的寬度減去一個固定值,以達到靈活調整布局的目的。
.example{ width: calc(100% - 20px); }
上述代碼將元素的寬度設置為父元素寬度減去20像素,這樣的設置可以讓元素在寬度改變時保持布局的穩定性。
同時,寬度減法還可以用于響應式布局。例如:
.example{ width: calc(50% - 10px); } @media screen and (max-width: 768px){ .example{ width: calc(100% - 20px); } }
在上述代碼中,當屏幕寬度小于768像素時,元素的寬度會變成父元素寬度減去20像素,而在大屏幕上,元素會以50%寬度顯示。
需要注意的是,calc()函數需要在數值和操作符之間添加空格,并且不同瀏覽器的語法支持可能會存在差異,因此在使用時需要做好兼容性處理。
下一篇css3 gt