伙计们，我有这支笔，在桌面上工作正常，但是当我在移动设备中加载页面时，class='content' 的背景颜色:rgb(255,255,255,0.8) 不起作用。 我用的是chrome 63移动版。 这是笔:https://codepen.io/abhiramsanthosh/pen/yEKNOx 全 View :https://codepen.io/abhiramsanthosh/full/yEKNOx
* {
box-sizing: border-box;
}
body, html {
min-height: 100vh;
background-color: #000;
}
body {
margin: 0;
padding: 0;
background-image: url("joker-heath-ledger-monochrome-dark-wallpaper.jpg");
background-position: center;
background-size: cover;
-moz-background-size: cover;
background-repeat: no-repeat;
background-attachment: fixed;
}
div {
margin: 0;
}
.title {
min-height: 100vh;
background-image: url("heath-monochrome.jpg");
background-position: top center;
background-size: cover;
-moz-background-size: cover;
background-repeat: no-repeat;
}
h1 {
font-family: 'Montserrat', sans-serif;
font-weight: 700;
font-size: 15vw;
color: white;
padding-left: 20px;
padding-top: 70vh;
margin: 0;
}
.content {
min-width: 100%;
min-height: 100%;
background-color: rgb(255,255,255,0.8);
}
p {
font-family: 'Montserrat', sans-serif;
font-size: 5vw;
margin: 0;
padding: 30px;
}
.grid {
display: grid;
grid-template-columns: repeat(1,1fr);
}
p.quote {
font-style: italic;
}
.content p {
text-indent: 30%;
text-align: justify;
}
div.extLinks {
min-height: 100vh;
}
.extLinks p {
font-size: 4vw;
color: white;
padding-top: 90vh;
text-align: center;
}
a {
text-decoration: none;
}
a:link {
color: red;
}
a:visited {
color: green;
}
a:hover {
color: green;
}
a:active {
color: green;
}
@media only screen and (min-width: 768px) {
.grid {
grid-template-columns: repeat(2,1fr);
}
h1 {
font-size: 10vw;
padding-left: 30px;
padding-top: 70vh;
}
p {
font-size: 1.5vw;
}
.extLinks p {
font-size: 1.5vw;
}<html>
<body>
<div class="title">
<h1>HEATH LEDGER</h1>
</div>
<div class="content">
<p>Heath Ledger was an Academy Award-winning, Australian actor best known for his roles in Brokeback Mountain and The Dark Knight. Heath Ledger was born on April 4, 1979, in Perth, Australia. His breakout role was in the film 10 Things I Hate About You with Julia Stiles. Ledger received Academy Award and Golden Globe nominations for his role in Brokeback Mountain.
<br><br>In 2008, after completing filming on Christopher Nolan's The Dark Knight, Ledger died as the result of an accidental prescription drug overdose. He received a posthumous Best Actor Academy Award for his performance as "The Joker."</p>
<div class="grid">
<div>
<blockquote><p class="quote">"I've never felt as old as I did watching Heath explore his talents."</p>-Christopher Nolan</blockquote>
</div>
<div>
<blockquote><p class="quote">"Working with Heath was one of the purest joys of my life. He brought to the role of Ennis more than any of us could have imagined - a thirst for life, for love and for truth, and a vulnerability that made everyone who knew him love him."</p>-Ang Lee</blockquote>
</div>
<div>
<blockquote><p class="quote">"I have an impression, a strong impression, I would have liked him very much as a man if I had. I'd already marveled at some of his work, and had looked forward so much to seeing the work that he would do in the future."</p>-Daniel Day-Lewis</blockquote>
</div>
<div>
<blockquote><p class="quote">"I hope people remember what a good actor he was."</p>-Leonard Maltin</blockquote>
</div>
</div>
</div>
<div class="extLinks">
<p>To know more about this great actor check out his <a href="https://en.wikipedia.org/wiki/Heath_Ledger" target="_blank">wikipedia page</a></p>
</div>
</body>
</html>提前感谢您的帮助:)
最佳答案
替换
background-color: rgb(255,255,255,0.8)
与
background-color: rgba(255,255,255,0.8)
RGB 是一种 3 channel 格式，包含红色、绿色和蓝色数据。
RGBA 是一种 4 channel 格式，包含红色、绿色、蓝色和 Alpha 数据。
关于html - 背景颜色在 Chrome 移动浏览器中不起作用，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/50973919/