我刚刚注意到Webkit现在对CSS值和单位模块级规范有一些支持.我想知道是否有人知道是否有办法从CSS选择器引用另一个CSS选择器(或DOM样式)属性?
我期待像这样在这里得到答案.我所知道的最有可能是当前浏览器实现的情况; 但请继续阅读......
例如,在动画可能调整元素大小的情况下(注意,这${.element2.width}是虚构的语法):
<style type="text/css">
.element1 {
.width: /*-webkit-,-o-,-moz-*/calc(80% - ${.element2.width});
}
.element2 {
.width: 100px;
}
.element2:hover {
width: 200px;
transition: all 0.4s ease-in-out;
}
</style>
Run Code Online (Sandbox Code Playgroud)
在这种情况下,我希望根据.element2上的悬停事件触发的转换重新评估.element1的宽度.
我意识到前面提到的规范.只是一个工作草案,但也许在另一个规范中定义了引用这种"引用选择器属性"的语法.我还没发现什么?或者只是不是一个值得关注的案例(感谢被忽视的工作)?
提前感谢您花时间阅读,更不用说回答问题了.
我添加了您链接的问题的答案:/sf/answers/775026451/
现在以由 CSS 本身调整大小的元素为例:您可以使用CSS3 媒体查询及其@media包含任意数量的声明块的规则。这些媒体查询将适应此处视口的宽度。
通过动画和媒体查询混合扩展元素会产生相反的效果,很快就会变得非常复杂(我想知道你正在玩什么内容);如果你想保持简单,那么 JS 是最好的选择。有变量、循环、事件;),您可以通过在元素(或任何 CSS 选择器)中添加或删除单个类来启动 CSS3 动画。
CSS3 不会取代 JS(并且您不应该使用 JS 来设置 HTML 样式,因为 JS 并未激活或存在于各处,而且已经有一个名为 CSS 的不错的后备方案)。
| 归档时间: |
|
| 查看次数: |
7766 次 |
| 最近记录: |