css calc使用總結
加減等運算子前後必須加空格
表現負數:
方式一:calc(-1 * 25px - -1 * 5px); 使用-1 * 來實現
方式二:calc(0px - (25px + 5px))); 使用0px - 來實現
calc中帶變數:使用方式相同
calc(-1 * var(--circleWidth) - -1 * var(--gap));
calc(0px - (var(--circleWidth) + var(--gap)));
程式碼示例:
.jf-switch-checked{
left: 100%;
margin-left: calc(-1 * var(--circleWidth) + -1 * var(--gap));
/* calc(0px - (var(--circleWidth) + var(--gap))) */
}
相關文章
- CSS calc()CSS
- css中的calc()函式CSS函式
- 【CSS筆記】— 使用calc()計算寬高(vw/vh)CSS筆記
- css基本語法總結及使用CSS
- css 總結CSS
- CSS總結CSS
- CSS3 calc()用法簡單介紹CSSS3
- CSS日常總結CSS
- CSS背景總結CSS
- CSS動畫總結CSS動畫
- css技巧總結CSS
- CSS自己總結CSS
- css居中總結CSS
- css display 總結CSS
- css3 calc()應用程式碼例項CSSS3
- CSS-佈局5-Calc三列布局CSS
- html和css總結HTMLCSS
- css面試題總結CSS面試題
- css中居中總結CSS
- css常用大總結CSS
- CSS縮寫總結CSS
- CSS技巧總結2CSS
- css簡寫總結CSS
- 關於css屬性calc對於ie的態度CSS
- css 元素左右居中總結CSS
- 初學者css每日總結CSS
- css3動畫總結CSSS3動畫
- CSS選擇符總結CSS
- css的常用效果總結CSS
- CSS垂直居中精華總結CSS
- css選擇器總結CSS
- css3d總結CSSS33D
- CSS-@規則(At-rules)常用語法使用總結CSS
- css + css3技術總結報告CSSS3
- [譯] CSS 變數 + calc + rgb = 自動高對比度CSS變數
- less中解決CSS3的calc衝突問題CSSS3
- CSS知識點面試總結CSS面試
- css各種佈局總結CSS