我想知道如何制作這些 facebook 女主角,而一個永遠滾動另一個只到其自身的盡頭。然而,兩者都卷起來,第一個輸入影像描述在這里固定在它的開始。
uj5u.com熱心網友回復:
使用 CSSposition: sticky可以達到這個效果。
main {
height: 2000px;
display: flex;
gap: 10px;
}
aside {
flex: none;
width: 170px;
background: tomato;
position: sticky;
top: 10px;
height: 200px;
}
article {
flex: 1;
background: linear-gradient(180deg, rgba(163,122,255,1) 0%, rgba(179,255,0,1) 100%);
height: 100%;
}
<header>
<h1>Header</h1>
</header>
<main>
<aside>
I'm sticky!
</aside>
<article>Main content</article>
</main>
轉載請註明出處,本文鏈接:https://www.uj5u.com/qianduan/466349.html
標籤:javascript html css
上一篇:使一些文本和影像以正確的大小對齊
