我想到了:
#parent:before{
width: parent.height;
height: prent.width;
}
或
parent:before{
}
along a jQuery like $('#parent:before').width($('#parent').height());
$('#parent:before').height($('#parent').width());
但他们似乎还不被允许。有什么建议吗?
更新的方法
这里有一种方法,它是如此简单,以至于我一开始忽略了它。
height: 100%;
width: 100%;
-webkit-transform: rotate(90deg) ;
-moz-transform: rotate(90deg) ;
-ms-transform: rotate(90deg) ;
-o-transform: rotate(90deg) ;
transform: rotate(90deg);
这是因为宽度和高度是在转换元素之前设置的。CCD_ 1可能有助于正确定位。
如果您需要正确旋转内容,您应该能够使用文本旋转。
Fiddle:http://jsfiddle.net/p4nLX/1/
原始答案
这里有一种将父宽度转换为:before
:高度的方法
div {
width: 300px;
height: 100px;
background-color: red;
}
div:before {
content: '';
display: block;
padding-bottom: 100%;
background-color: blue;
width: 100px;
}
填充百分比(我认为还有边距)是基于父元素的宽度。
Fiddle:http://jsfiddle.net/p4nLX/
基于这个答案:Target:在使用jQuery的伪元素之前和之后,您可以在这里使用jQuery插件:http://jquery.lukelutman.com/plugins/pseudo/jquery.pseudo.js以针对伪元素。快速查看,插件似乎将伪元素内容转移到<span>
中,因此可以将其作为目标,因为伪元素不是DOM的一部分。