我试图向上滑动第一个分区,并在向上滚动后使第二个分区可见。我想要的是在向上滚动绿色分区时修复红色分区。我试图解决这个问题很长一段时间,但我无法解决。有人可以帮我这个吗?
#pagebody{
color:white;
background-color:red;
position: -webkit-sticky;
position: sticky;
top: 0;
}
#header{
color:white;
background-color:green;
position: -webkit-sticky;
position: sticky;
top: 10%;
}
<div id="header">Lato is a sanserif typeface family designed in the Summer 2010 by Warsaw-based designer Łukasz Dziedzic (“Lato” means “Summer” in Polish). In December 2010 the Lato family was published under the open-source Open Font License by his foundry tyPoland, with support from Google.
In 2013 – 2014, the family was greatly extended to cover 3000+ glyphs per style. The Lato 2.010 family now supports 100+ Latin-based languages, 50+ Cyrillic-based languages as well as Greek and IPA phonetics. In the process, the metrics and kerning of the family have been revised and four additional weights were created.
Support further development of Lato through a donation!<br>
Lato is a sanserif typeface family designed in the Summer 2010 by Warsaw-based designer Łukasz Dziedzic (“Lato” means “Summer” in Polish). In December 2010 the Lato family was published under the open-source Open Font License by his foundry tyPoland, with support from Google.
In 2013 – 2014, the family was greatly extended to cover 3000+ glyphs per style. The Lato 2.010 family now supports 100+ Latin-based languages, 50+ Cyrillic-based languages as well as Greek and IPA phonetics. In the process, the metrics and kerning of the family have been revised and four additional weights were created.
Support further development of Lato through a donation!<br>
Lato is a sanserif typeface family designed in the Summer 2010 by Warsaw-based designer Łukasz Dziedzic (“Lato” means “Summer” in Polish). In December 2010 the Lato family was published under the open-source Open Font License by his foundry tyPoland, with support from Google.
In 2013 – 2014, the family was greatly extended to cover 3000+ glyphs per style. The Lato 2.010 family now supports 100+ Latin-based languages, 50+ Cyrillic-based languages as well as Greek and IPA phonetics. In the process, the metrics and kerning of the family have been revised and four additional weights were created.
Support further development of Lato through a donation!</div>
<br>
<br>
<br>
<div id="pagebody">Lato is a sanserif typeface family designed in the Summer 2010 by Warsaw-based designer Łukasz Dziedzic (“Lato” means “Summer” in Polish). In December 2010 the Lato family was published under the open-source Open Font License by his foundry tyPoland, with support from Google.
In 2013 – 2014, the family was greatly extended to cover 3000+ glyphs per style. The Lato 2.010 family now supports 100+ Latin-based languages, 50+ Cyrillic-based languages as well as Greek and IPA phonetics. In the process, the metrics and kerning of the family have been revised and four additional weights were created.
Support further development of Lato through a donation!<br>
Lato is a sanserif typeface family designed in the Summer 2010 by Warsaw-based designer Łukasz Dziedzic (“Lato” means “Summer” in Polish). In December 2010 the Lato family was published under the open-source Open Font License by his foundry tyPoland, with support from Google.
In 2013 – 2014, the family was greatly extended to cover 3000+ glyphs per style. The Lato 2.010 family now supports 100+ Latin-based languages, 50+ Cyrillic-based languages as well as Greek and IPA phonetics. In the process, the metrics and kerning of the family have been revised and four additional weights were created.
Support further development of Lato through a donation!<br>
Lato is a sanserif typeface family designed in the Summer 2010 by Warsaw-based designer Łukasz Dziedzic (“Lato” means “Summer” in Polish). In December 2010 the Lato family was published under the open-source Open Font License by his foundry tyPoland, with support from Google.
In 2013 – 2014, the family was greatly extended to cover 3000+ glyphs per style. The Lato 2.010 family now supports 100+ Latin-based languages, 50+ Cyrillic-based languages as well as Greek and IPA phonetics. In the process, the metrics and kerning of the family have been revised and four additional weights were created.
Support further development of Lato through a donation!</div>
#pagebody{
color: white;
background-color: red;
position: fixed;
top: 0;
bottom: 0;
left: 0;
right: 0;
}
#header{
color: white;
background-color: green;
position: -webkit-sticky;
position: relative;
z-index: 9999;
margin-bottom: 100vw; // You need to add some space so that green panel should go up on scroll.
}
body {
margin: 0;
padding: 0;
}
<div id="header">Lato is a sanserif typeface family designed in the Summer 2010 by Warsaw-based designer Łukasz Dziedzic (“Lato” means “Summer” in Polish). In December 2010 the Lato family was published under the open-source Open Font License by his foundry tyPoland, with support from Google.
In 2013 – 2014, the family was greatly extended to cover 3000+ glyphs per style. The Lato 2.010 family now supports 100+ Latin-based languages, 50+ Cyrillic-based languages as well as Greek and IPA phonetics. In the process, the metrics and kerning of the family have been revised and four additional weights were created.
Support further development of Lato through a donation!<br>
Lato is a sanserif typeface family designed in the Summer 2010 by Warsaw-based designer Łukasz Dziedzic (“Lato” means “Summer” in Polish). In December 2010 the Lato family was published under the open-source Open Font License by his foundry tyPoland, with support from Google.
In 2013 – 2014, the family was greatly extended to cover 3000+ glyphs per style. The Lato 2.010 family now supports 100+ Latin-based languages, 50+ Cyrillic-based languages as well as Greek and IPA phonetics. In the process, the metrics and kerning of the family have been revised and four additional weights were created.
Support further development of Lato through a donation!<br>
Lato is a sanserif typeface family designed in the Summer 2010 by Warsaw-based designer Łukasz Dziedzic (“Lato” means “Summer” in Polish). In December 2010 the Lato family was published under the open-source Open Font License by his foundry tyPoland, with support from Google.
In 2013 – 2014, the family was greatly extended to cover 3000+ glyphs per style. The Lato 2.010 family now supports 100+ Latin-based languages, 50+ Cyrillic-based languages as well as Greek and IPA phonetics. In the process, the metrics and kerning of the family have been revised and four additional weights were created.
Support further development of Lato through a donation!</div>
<br>
<br>
<br>
<div id="pagebody">Lato is a sanserif typeface family designed in the Summer 2010 by Warsaw-based designer Łukasz Dziedzic (“Lato” means “Summer” in Polish). In December 2010 the Lato family was published under the open-source Open Font License by his foundry tyPoland, with support from Google.
In 2013 – 2014, the family was greatly extended to cover 3000+ glyphs per style. The Lato 2.010 family now supports 100+ Latin-based languages, 50+ Cyrillic-based languages as well as Greek and IPA phonetics. In the process, the metrics and kerning of the family have been revised and four additional weights were created.
Support further development of Lato through a donation!<br>
Lato is a sanserif typeface family designed in the Summer 2010 by Warsaw-based designer Łukasz Dziedzic (“Lato” means “Summer” in Polish). In December 2010 the Lato family was published under the open-source Open Font License by his foundry tyPoland, with support from Google.
In 2013 – 2014, the family was greatly extended to cover 3000+ glyphs per style. The Lato 2.010 family now supports 100+ Latin-based languages, 50+ Cyrillic-based languages as well as Greek and IPA phonetics. In the process, the metrics and kerning of the family have been revised and four additional weights were created.
Support further development of Lato through a donation!<br>
Lato is a sanserif typeface family designed in the Summer 2010 by Warsaw-based designer Łukasz Dziedzic (“Lato” means “Summer” in Polish). In December 2010 the Lato family was published under the open-source Open Font License by his foundry tyPoland, with support from Google.
In 2013 – 2014, the family was greatly extended to cover 3000+ glyphs per style. The Lato 2.010 family now supports 100+ Latin-based languages, 50+ Cyrillic-based languages as well as Greek and IPA phonetics. In the process, the metrics and kerning of the family have been revised and four additional weights were created.
Support further development of Lato through a donation!</div>
现在你只有两个部分,红色部分处于固定位置,所以绿色将覆盖身体并使绿色上升,你需要在体内添加一些空间以向上滚动绿色。现在我已经添加了足够的滚动余量。