css3变换规模坚持到底

Question

是否可以使用transform:scale(x)属性,同时保持元素粘在页面底部？(默认情况下,如果比例相对于元素的中心,如下所示)

默认比例行为http://www.w3schools.com/css3/transform_scale.gif

Answer 1

使用该transform-origin属性:

element{
    -webkit-transform : scale(0.5);
    -moz-transform : scale(0.5);
    -o-transform : scale(0.5);
    -ms-transform : scale(0.5);
    transform : scale(0.5);

    -webkit-transform-origin : 50% 100%;
    -moz-transform-origin : 50% 100%;
    -o-transform-origin : 50% 100%;
    -ms-transform-origin : 50% 100%;
    transform-origin : 50% 100%;
}

这是一个现场演示,展示了transform-origin实际操作.