css - 有没有办法在 CSS 中加减值?

标签 css height margin

我有一个以负边距定位的 div,但我希望它一直向下延伸到其容器 div 的底部,这样我就可以使用不只是随机结束的边框。如果你看http://kineticaid.com/k/home.php你会明白我的意思。我不能只以像素为单位扩展它的高度,因为容器 div 的高度随页面动态变化。我想要做的是这样的:

#rightcol {
float: right;
width: 225px;

height: 100% + 250px;

margin: -325px -25px 0 0;
}

基本上,我是在问您是否可以在 CSS 中进行加减运算。谢谢!

最佳答案

是的。 CSS3 具有 calc() 函数。这适用于大多数浏览器的当前版本 ( http://caniuse.com/calc )。

height: calc( 100% + 250px );

演示: jsFiddle

HTML:

<div id="one"></div>
<div id="two"></div>

CSS:

div {
    border: 1px solid red;
    height: 100px;
}

#one {
    width: calc(50% + 20px);
}

#two {
    width: 50%;
}

输出:

enter image description here

关于css - 有没有办法在 CSS 中加减值?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/8643401/

相关文章:

JavaFX - 为整个应用程序设置默认 CSS 样式表

swift - 如何获得动态高度? (Xcode)

ios - UITableView Cells - 如何使一个单元格的高度固定,其他单元格的高度相对于屏幕尺寸可变?

css - margin-top 仅当 flex 元素被包裹时

css - 自定义 text_area Ruby on rails 以实现 css

css - 选项卡的 IE css 宽度问题

javascript - 尽管宽度为 :0;,但 Textarea 滚动条不会消失

javascript - iframe 高度为 iphone 中容器的 100%。不可能吗?

html - div 下方的未知空间?

html - 我的标题和导航 div 之间有一个未知的间隙/空间。我试过查找答案,但似乎没有任何解决方法