最近這個月一直在趕專案開發，遇到的問題和學到的前端知識沒有更新到，現在閒了下來，就整理一下前端知識。
在專案開發中，在樣式這方面花費的時間較多，因為針對於數字的變化特別多，本人不愛記數字，在看設計圖時總是反覆計算之間的數值，覺得很麻煩，偶然谷歌一下，發現了css3的乙個屬性--calc()
calc() 很顯然，是calculate的縮寫--計算。是css3的乙個屬性。可以用來給width，height，border，margin以及padding等屬性值設定動態值，拿個例子說：
doctype html
>
<
html
lang
="en"
>
<
head
>
<
meta
charset
="utf-8"
>
<
title
>title
title
>
<
style
>
.one
.two
.three
style
>
head
>
<
body
>
<
div
class
="one"
>
<
div
class
="two"
>
<
div
class
="three"
>abc
div>
div>
div>
body
>
html
>
使用方法：
1. 可以巢狀使用 例如：calc( calc() );
2. 可以使用四則運算 + - * ／；
3. 可以% ，px，em，rem 混合使用。
注意事項：
1. +和-在計算時前後要有空格，否則不識別。* 和 ／沒要求，為了規範都加空格吧。 例如： calc(100%-10px) 這樣不會識別。
2. 0 不能作為除數，否則會報錯。很顯然。
相容性：
既然是css3的新屬性，避免不了相容性問題。
ie9以下不支援，火狐4以下不支援，4.0-15.0需要加字首，谷歌19.0以下不支援，19.0-25.0需要加字首，蘋果5.1以下（包括5.1）不支援，6.0需要加字首，歐朋15.0以下不支援。
會計算的calc
calc可以通過乙個表示式來動態設定元素的長度，它是css3的新增功能。calc 的運算規則 calc 使用通用的數 算規則，但是也提供更智慧型的功能 1 使用 和 四則運算 2 可以使用百分比 px em rem等單位 3 可以混合使用各種單位進行計算 4 表示式中有 和 時，其前後必須要有空格，...
使用calc 函式在CSS屬性值時執行計算
在現實中，我們經常要動態調整相對整個畫面的整體高度或者寬度 比如 我想設定乙個div高度為整個螢幕的100 再減去20px固定高度，這種如何實現呢？我們就可以適合用calc 函式調整了。使用方法 實現了寬度為父容器寬度減去固定的20px width webkit calc 100 20px widt...
CSS3中的 calc 計算函式
calc 函式用於動態計算長度值 clac 巢狀 calc 函式可以巢狀。在函式裡邊，會被視為簡單的括號表示式，如下例所示。foo 函式的計算值如下所示 foo 例項 1.我們可以創造乙個表示式，用乙個百分比減掉乙個畫素值 foo 本例中，foo 元素總是小於它父元素寬度 50px。2.使用 cal...