我有这段代码：
header, footer {
text-align: center;
background-color: orange;
padding: 18px;
}
body {
margin: 0 auto;
max-width: 1024px;
}
section {
position: absolute;
}
footer {
}<header>header text</header>
<section>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Assumenda eaque aliquid minima tempora ad tempore aut iure accusantium sunt, excepturi quas. Unde ullam quam velit aspernatur distinctio incidunt sapiente provident, maiores minima omnis sunt assumenda praesentium facere, hic harum animi at eaque dignissimos odit blanditiis nulla natus quo? Nostrum earum sed aut distinctio doloribus quaerat nulla atque, inventore delectus, sint blanditiis. Perferendis id iure fuga, voluptatem quo quaerat earum ipsa nam accusamus porro quasi tempora rem voluptatum non ut dolor impedit vero accusantium voluptas, ipsum neque. Quaerat dignissimos consequatur ratione? Eveniet, odit quisquam facilis iure id libero magni beatae velit recusandae praesentium tenetur quis omnis, neque sint sapiente veritatis magnam? Tempora tenetur, reiciendis aliquam nesciunt amet laudantium praesentium deserunt accusamus est at optio ea modi dolore sed repellendus! Libero voluptatem modi deserunt atque vitae quo, cupiditate ipsam minus porro nisi excepturi cumque ipsa accusantium! Ad ratione sapiente similique modi enim? Provident qui voluptatibus explicabo voluptates quidem quam officia doloribus nostrum alias cumque sint porro, molestiae quaerat recusandae labore, id ab dolores dolor ex, beatae inventore culpa aperiam? Expedita similique sapiente nesciunt harum cupiditate nulla perferendis minus saepe. Nesciunt est, cum aperiam reprehenderit, repellendus placeat, dicta unde illum dolor nemo impedit dolorem error assumenda! Aliquid soluta repellendus tenetur? Repudiandae pariatur mollitia fugiat aut fuga quod dignissimos dolorem deleniti quaerat alias dolore aspernatur consequatur, blanditiis odit atque velit, ea quam ullam. Quas, veritatis illo! Ducimus obcaecati ut id, consectetur eveniet ad placeat, minima, ab tenetur possimus soluta corrupti optio architecto? Deserunt est quaerat doloribus rem veritatis commodi debitis culpa excepturi porro eveniet, unde iure, beatae recusandae inventore tenetur. Excepturi deserunt minus expedita voluptatibus ad! Repudiandae esse dolores expedita nisi, pariatur nemo explicabo asperiores architecto non ipsa minus eum veniam delectus, nostrum deserunt, culpa dolorem magni! Deleniti sequi ex repellendus consectetur, laudantium nostrum alias, voluptatem ea velit blanditiis totam in facere tenetur modi ad similique ratione non maxime a rerum, incidunt corrupti quod quibusdam maiores? Neque dolor reiciendis placeat adipisci dignissimos dolores saepe quam et asperiores! Praesentium cupiditate laudantium soluta maxime porro odio reprehenderit fugit velit. Beatae dolorem animi dicta et iusto sed, quasi cumque debitis inventore officiis accusantium, sequi corrupti, tempore doloribus tenetur minima asperiores laboriosam voluptas soluta eum optio non voluptatem? Eum omnis impedit laborum aut laudantium praesentium optio dolorum inventore fuga temporibus. Ea aspernatur iste sapiente debitis error. Quaerat excepturi ipsa impedit hic. Nobis esse voluptate id tenetur vel perspiciatis, distinctio facere alias dignissimos laudantium dolorum veritatis beatae voluptas dolores, ipsam culpa consequatur modi, dolorem quasi eos? Tempora soluta quisquam rerum corporis quis quaerat molestiae, doloremque, nobis eos placeat provident cupiditate, quasi omnis perspiciatis architecto natus veritatis aperiam reiciendis dolorum? Odit reiciendis minus cum dicta facere, voluptas obcaecati. Cumque quod, magni voluptatem dignissimos deleniti labore perferendis atque doloribus adipisci nesciunt pariatur fugit molestias laudantium facilis quibusdam, veritatis quisquam doloremque illo consequuntur quas nostrum consequatur. Placeat tempore molestiae ducimus, animi obcaecati laboriosam hic. Tempore repellat ducimus cupiditate voluptatum doloribus, nobis qui vero. Minima ex sit expedita possimus. Dolorem rerum id praesentium!</section>
<footer>foorer text</footer>
https://codepen.io/anon/pen/boOvqz
如何制作粘性页脚（页脚必须始终位于底部）？如果section必须为absolute（这是过渡动画所必需的）
答案 0 :(得分：0)
将以下css添加到.footer
footer {
position: fixed;
bottom:0;
}
请查看以下代码段以供参考。
header,
footer {
text-align: center;
background-color: orange;
padding: 18px;
}
body {
margin: 0 auto;
max-width: 1024px;
}
section {
position: absolute;
padding-bottom: 60px;
}
footer {
position: fixed;
bottom: 0;
left: 0;
right: 0;
}<header>header text</header>
<section>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Assumenda eaque aliquid minima tempora ad tempore aut iure accusantium sunt, excepturi quas. Unde ullam quam velit aspernatur distinctio incidunt sapiente provident, maiores minima omnis sunt assumenda
praesentium facere, hic harum animi at eaque dignissimos odit blanditiis nulla natus quo? Nostrum earum sed aut distinctio doloribus quaerat nulla atque, inventore delectus, sint blanditiis. Perferendis id iure fuga, voluptatem quo quaerat earum ipsa
nam accusamus porro quasi tempora rem voluptatum non ut dolor impedit vero accusantium voluptas, ipsum neque. Quaerat dignissimos consequatur ratione? Eveniet, odit quisquam facilis iure id libero magni beatae velit recusandae praesentium tenetur quis
omnis, neque sint sapiente veritatis magnam? Tempora tenetur, reiciendis aliquam nesciunt amet laudantium praesentium deserunt accusamus est at optio ea modi dolore sed repellendus! Libero voluptatem modi deserunt atque vitae quo, cupiditate ipsam minus
porro nisi excepturi cumque ipsa accusantium! Ad ratione sapiente similique modi enim? Provident qui voluptatibus explicabo voluptates quidem quam officia doloribus nostrum alias cumque sint porro, molestiae quaerat recusandae labore, id ab dolores
dolor ex, beatae inventore culpa aperiam? Expedita similique sapiente nesciunt harum cupiditate nulla perferendis minus saepe. Nesciunt est, cum aperiam reprehenderit, repellendus placeat, dicta unde illum dolor nemo impedit dolorem error assumenda!
Aliquid soluta repellendus tenetur? Repudiandae pariatur mollitia fugiat aut fuga quod dignissimos dolorem deleniti quaerat alias dolore aspernatur consequatur, blanditiis odit atque velit, ea quam ullam. Quas, veritatis illo! Ducimus obcaecati ut id,
consectetur eveniet ad placeat, minima, ab tenetur possimus soluta corrupti optio architecto? Deserunt est quaerat doloribus rem veritatis commodi debitis culpa excepturi porro eveniet, unde iure, beatae recusandae inventore tenetur. Excepturi deserunt
minus expedita voluptatibus ad! Repudiandae esse dolores expedita nisi, pariatur nemo explicabo asperiores architecto non ipsa minus eum veniam delectus, nostrum deserunt, culpa dolorem magni! Deleniti sequi ex repellendus consectetur, laudantium nostrum
alias, voluptatem ea velit blanditiis totam in facere tenetur modi ad similique ratione non maxime a rerum, incidunt corrupti quod quibusdam maiores? Neque dolor reiciendis placeat adipisci dignissimos dolores saepe quam et asperiores! Praesentium cupiditate
laudantium soluta maxime porro odio reprehenderit fugit velit. Beatae dolorem animi dicta et iusto sed, quasi cumque debitis inventore officiis accusantium, sequi corrupti, tempore doloribus tenetur minima asperiores laboriosam voluptas soluta eum optio
non voluptatem? Eum omnis impedit laborum aut laudantium praesentium optio dolorum inventore fuga temporibus. Ea aspernatur iste sapiente debitis error. Quaerat excepturi ipsa impedit hic. Nobis esse voluptate id tenetur vel perspiciatis, distinctio
facere alias dignissimos laudantium dolorum veritatis beatae voluptas dolores, ipsam culpa consequatur modi, dolorem quasi eos? Tempora soluta quisquam rerum corporis quis quaerat molestiae, doloremque, nobis eos placeat provident cupiditate, quasi
omnis perspiciatis architecto natus veritatis aperiam reiciendis dolorum? Odit reiciendis minus cum dicta facere, voluptas obcaecati. Cumque quod, magni voluptatem dignissimos deleniti labore perferendis atque doloribus adipisci nesciunt pariatur fugit
molestias laudantium facilis quibusdam, veritatis quisquam doloremque illo consequuntur quas nostrum consequatur. Placeat tempore molestiae ducimus, animi obcaecati laboriosam hic. Tempore repellat ducimus cupiditate voluptatum doloribus, nobis qui
vero. Minima ex sit expedita possimus. Dolorem rerum id praesentium!</section>
<footer>foorer text</footer>