HTML5+CSS3静态页面项目-BusinessTheme的总结
因为期末考试、调整心态等等的种种原因,距离上一次的项目练习已经过了很久了,今天终于有时间继续练习HTML5+CSS3的页面架构和设计稿还原。设计图很长,整个页面分为了好几个区域,所以就不放完整的设计图
顺晟科技
2021-09-13 12:29:50
205
我们在写前端页面的时候,会遇到这样的情况,就是一个div设置宽度,设置左右边距10像素,这样的布局,在里面嵌套的div的宽度设置,这样写的话,里面的宽度是和外面的宽度一致的,同样是的宽度。
而我们想要的就是里面的宽度是-20的宽度,很多时候我们会用JS来做,其实我们可以用css来做。
width: calc( - 20px);
CSS calc() 函数 :calc() 函数用于动态计算长度值。
● 需要注意的是,运算符前后都需要保留一个空格,例如:width: calc( - 10px);
● 任何长度值都可以使用calc()函数进行计算;
● calc()函数支持 "+", "-", "*", "/" 运算;
● calc()函数使用标准的数学运算优先级规则;
15
2022-09
15
2022-09
15
2022-09
15
2022-09
14
2022-09
14
2022-09