现在我在我的LESS代码中尝试在CSS3中执行此操作:
width: calc(100% - 200px);
Run Code Online (Sandbox Code Playgroud)
但是,当LESS编译时,它输出:
width: calc(-100%);
Run Code Online (Sandbox Code Playgroud)
有没有办法告诉LESS不要以这种方式编译并正常输出?
我在Less文件中有以下CSS规则:
.container {
min-height: calc(100vh - 150px);
}
Run Code Online (Sandbox Code Playgroud)
这根本不起作用.我想让容器全窗口高度和负头,页脚固定高度.
我怎样才能做到这一点?
我注意到我使用CSS3 calc()功能作为单位width在最新版本的Chrome中无效.
在Chrome开发者工具中,规则通过它calc()有一个删除线,并在其左侧有一个黄色三角形中的感叹号.这表明财产或价值未被识别.
如何让它在现代浏览器中运行?因为它是一个值而不是一个属性,所以供应商前缀在哪里?
当我说它不起作用时,我的意思是Chrome Dev Tools说它没有认识到我对它的使用width: calc(100%-88px);.我怎么知道它没有认出来?由于chrome开发工具中样式规则旁边的删除线和黄色三角形图标.
有没有办法在less ~运算符中使用变量,比如
~"calc(70% - @spacing)";
Run Code Online (Sandbox Code Playgroud)
当我尝试它时,它只适用于静态值,如
~"calc(70% - 10px)";
Run Code Online (Sandbox Code Playgroud)
我可以在设置为属性之前获取要评估的字符串.
我想在我的Bootstrap模式中使用固定的标头,但是如果我将.modal-header设置为position:fixed它会随着moda内容一起滚动.如何在BS模式中创建trully固定标头?
我正在从Bootstrap 2转移到Bootstrap 3.在旧版本中,我使用的是具有长内容的模态,并且当达到给定的最大高度时,模态会自动滚动.
在Bootstrap 3中,模式只是扩展以显示整个内容,我必须使用向下翻页键实际到达它的末尾并查看模态页脚中的按钮.我无法使用浏览器窗口最右侧的滚动条,因为它被背景覆盖,并且在任何情况下都不能直观地滚动模式框中的内容.
如何在bootstrap 3中实现一个模态,在达到最大高度时自动插入滚动条滚动内容?
我尝试将max height设置为模态类,如下所示:
.modal{
max-height:80%;
}
.modal-header{
height:15% !important;
}
.modal-body{
height:70%;
overflow:auto;
}
.modal-footer{
height:15%;
}
Run Code Online (Sandbox Code Playgroud)
但它没有按预期工作.模态窗口确实达到了最大尺寸,但它只是在那里削减了内容,甚至没有显示页脚.
谢谢你的帮助.
当我calc(100% + 20px)在Chromes和Firefox的Inspector中直接使用它时,它可以正常工作,如图所示.
但是当我将它插入到我的less文件中时,它会被转换为120%.我究竟做错了什么?
有没有办法使用较少的css calc()例程?
如果我去http://less2css.org/ 并输入以下输入(这只是一个常规的CSS规则):
width: calc(100% - 450px);
Run Code Online (Sandbox Code Playgroud)
输出应该完全相同(因为它是常规的css)但是,
编译器产生的css输出是 width: calc(-350%);
有没有办法让这个工作?
.wrap {
height: calc(100vh - 50px);
}
Run Code Online (Sandbox Code Playgroud)
这不行.我得到了50vh的输出.有什么地方我可以用vh减去像素吗?
我想将min() CSS 函数与用 LESS 编写的样式表一起使用。然而,LESS 有自己的 min 和 max 函数来预先计算值(使得混合和匹配单位变得不可能)。我如何获得它,以便输出 CSS 具有我编写的最小/最大函数?
这是 LESS 文件中的样式,这也应该是预期的输出。
canvas {
background: white;
width: min(95vh, 95vw);
height: min(95vh, 95vw);
}
Run Code Online (Sandbox Code Playgroud)
我使用 lessc 3.13.1,它会产生以下错误:
ArgumentError: error evaluating function `min`: incompatible types in <snipped> on line 49, column 12:
48 background: white;
49 width: min(95vh, 95vw);
50 height: min(95vh, 95vw);
Run Code Online (Sandbox Code Playgroud)