Você pode usar o Flexbox. Ele trabalha como um flex container, capaz de ordenar e direcionar os elementos filhos. Para utilizá-lo, você precisa determinar display: flex;
e direcionar de acordo com os requisitos que você quer, no seu caso flex-direction: column;
, isso configura a ordenação em coluna das suas divs. Por padrão, ele sempre direciona em linha.
Após você aplicar essa configuração no container
, é necessário adicionar aos elementos filhos o parâmetro order
, definindo com valor numérico a ordem que deseja exibir as suas divs (isso vale também para valores negativos).
.container {
display: flex;
flex-direction: column;
}
.divum {
width: 100%;
height: 200px;
background: black;
order: 2;
}
.divdois {
width: 100%;
height: 200px;
background: red;
order: 1;
}
<div class="container">
<div class="divum"></div>
<div class="divdois"></div>
</div>
Há outras definições que você pode aplicar dependendo da sua necessidade, no site origamid há um ótimo conteúdo sobre o assunto. Você pode ver também no CSS-Tricks e no MDN.