css3中的calc的使用

2022-07-04 14:27:08 字數 268 閱讀 4608

最近在布局的時候遇到乙個問題,在頁面中的左側是側邊欄,右邊是內容區域,內容區域中有乙個固定定位的標籤頁,在設定固定定位的標籤設定寬度的時候應該是內容區域的寬度,而固定定位的時候相對於是視窗的寬度,所以轉換為了當前視窗的寬度減去左側的側邊欄的寬度

開始在網上查了查有個calc屬性是可以寫表示式的,但是自己使用的時候卻沒有效果,自己測試了半天才發現是寫法的錯誤

width: calc(100% - 10px);

在寫的時候需要在運算子的左右都加上空格才能生效

css3 中的calc用法

calc 函式用於動態計算長度值。1.需要注意的是,運算子前後都需要保留乙個空格,例如 width calc 100 10px 2.任何長度值都可以使用calc 函式進行計算 3.calc 函式支援 運算 4.calc 函式使用標準的數 算優先順序規則 calc是css3中的計算,ie10 瀏覽器支...

CSS3中 的 calc 函式

css3 的 calc 函式。這裡的意思是設定寬度比100 的寬度少30px。calc 函式用於動態計算長度值。calc 函式支援 運算 calc 函式使用標準的數 算優先順序規則 在less中使用以下樣式寬度計算錯誤 width calc 100 30px 計算出來是 width 70 分析 px...

CSS3中的 calc 計算函式

calc 函式用於動態計算長度值 clac 巢狀 calc 函式可以巢狀。在函式裡邊,會被視為簡單的括號表示式,如下例所示。foo 函式的計算值如下所示 foo 例項 1.我們可以創造乙個表示式,用乙個百分比減掉乙個畫素值 foo 本例中,foo 元素總是小於它父元素寬度 50px。2.使用 cal...