计算
width: calc(100% - 80px)
heigth: calc(2em * 5)
- * + / 加减乘除都可以 前后要空格否则报错
应用场景 居中 position: absolute;
top: calc(50% - 自己的高度)；
left: calc(50% - 自己的宽度)；
等等
calc()主要应用在流体布局上,可以通过calc()计算得到元素的宽度。
calc()根据给定百分比、em、px和rem单位值计算出其宽度或者高度,比如说“width:calc(50% + 2em)”,这样一来你就不用考虑元素DIV的宽度值到底是多少,而把这个烦人的任务交由浏览器去计算。
rem 相对于根元素字体大小
vw相对于视窗的困度 视窗宽度是100vw
vh 相对于视窗的宽度 视窗的宽度是100vh
vm 相对于视窗的宽度和高度 取决于哪个更小
视窗指 window.innerWidth / window.innerHeight
可以用来制作完全覆盖页面的遮罩层
CSS3 transition动画 CSS3 transform变换 CSS3 animation动画
1 CSS3 兼容性 2 CSS3 选择器 3 CSS3 新加属性 4 CSS3 过渡动画 5 CSS3 变型 6...
知识点： CSS3 背景图像区域CSS3 背景图像定位CSS3 背景图像大小CSS3 多重背景图像CSS3 背景属...
知识点： CSS3 渐变CSS3 线性渐变CSS3 径向渐变 CSS3 渐变 渐变（gradients）可以在两个...
CSS3设置圆角边框 css3圆角特效代码 CSS3 border-radius 属性 使用 CSS3 borde...
CSS3动画 CSS3 @keyframes 规则如需在 CSS3 中创建动画，您需要学习 @keyframes ...
1. css3 起步 (图形2D旋转) 2. CSS3 模块 CSS3 被划分为模块。其中最重要的 CSS3 ...
知识点： CSS3圆角CSS3盒阴影CSS3边界图片 一、CSS3圆角 border-radius属性 一个最多可...
css3 圆角使用 CSS3 border-radius 属性，你可以给任何元素制作 "圆角"。CSS3 bord...
资源：css3制作工具css3按钮生成css3制作特殊效果-web前端实验室 浏览器的型号和css3前缀 五种主流...
本文标题：css3
本文链接：https://www.haomeiwen.com/subject/qlathftx.html
网友评论