CSS3 calc()函数使用
发布时间:2017-08-22 12:00:10
1、calc是什么?calc是英文单词calculate(计算)的缩写,用于动态计算长度值。calc()函数支持 "+", "-", "*", "/" 运算;+ 和 - 运算符的两边必须始终要有空 ...
1、calc是什么?
calc是英文单词calculate(计算)的缩写,用于动态计算长度值。
- calc()函数支持 "+", "-", "*", "/" 运算;
+ 和
- 运算符的两边必须始终要有空白符。
比如 calc(50% -8px) 会被解析成为一个无效的表达式:一个百分比后跟一个负数长度值。
而 calc(8px + -50%) 会被解析成为一个长度后跟一个加号再跟一个负百分比。
4、示例代码
<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title>CSS3 calc()函数应用</title> <style> * { padding: 0; margin: 0; } .test { width: calc(100% - 50px); border: 1px solid red; } </style> </head> <body> <div class="test">我的宽度为100% - 50px</div> </body></html>
效果:
海外公司注册、海外银行开户、跨境平台代入驻、VAT、EPR等知识和在线办理:https://www.xlkjsw.com
原标题:CSS3 calc()函数使用
关键词:CSS
*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们:
admin#shaoqun.com
(#换成@)。