使用纯CSS从底部开始div滚动条 [英] Start div scrollbar from bottom with pure css

问题描述

是否可以使用纯css从底部(并非总是作为初始位置)而不是从顶部开始div的滚动条?

Is it possible to start a div's scrollbar from bottom (As initial position, not always) instead from top, with pure css?

推荐答案

使用transform:rotateX包装div并在sub div中返回(以避免文本翻过来)

Use transform:rotateX to wrap div and return it (to avoid the text from turning over) also in sub div

.page{
 overflow-y: scroll;

 width:150px;
 height:150px;
 transform:rotateX(180deg);
                -moz-transform:rotateX(180deg); /* Mozilla */
                -webkit-transform:rotateX(180deg); /* Safari and Chrome */
                -ms-transform:rotateX(180deg); /* IE 9+ */
                -o-transform:rotateX(180deg); /* Opera */
}
.sub{
   transform:rotateX(180deg);
                -moz-transform:rotateX(180deg); /* Mozilla */
                -webkit-transform:rotateX(180deg); /* Safari and Chrome */
                -ms-transform:rotateX(180deg); /* IE 9+ */
                -o-transform:rotateX(180deg); /* Opera */
}

    <div class="page">
    <div class="sub">
       <p>This is some text in a paragraph.</p>
    <p>This is some text in a paragraph.</p>
    <p>This is some text in a paragraph.</p>
    <p>This is some text in a paragraph.</p>
    <p>This is some text in a paragraph.</p>
    <p>This is some text in a paragraph.</p> 
    </div>

    </div>

这篇关于使用纯CSS从底部开始div滚动条的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！