gpt4 book ai didi

javascript - 我的 HTML 页面上的白点

转载 作者:太空宇宙 更新时间:2023-11-04 09:40:50 26 4
gpt4 key购买 nike

我正在制作一个随机网站,但我的问题是页面顶部有一个白点,它也干扰了背景的外观。为什么会这样?我找不到任何导致这种情况发生的原因。下面的代码如下。 JS > CSS > HTML。

感谢您花时间阅读。

JS > CSS > HTML 是怎样的

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script>
<script type="text/javascript">

$(document).ready(function() {
$(".pull-me").click(function() {
$(".panel").slideToggle("slow");
});
});

$(document).ready(function() {
$(".pull-me2").click(function() {
$(".panel2").slideToggle("slow");
});
});
 <style type="text/css">
html {
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
background-image: url("http://i64.tinypic.com/2jdn8lw.jpg");
}

#mainHeader {
text-shadow: -14px 3px 10px;
font-size: 85px;
font-family: cursive;
}

.1 {
height: 10px;
}

.panel {
text-align: center;
display: none;
}

.panel2 {
text-align: center;
display: none;
}

.pull-me {
text-align: center;
font-family: sans-serif;
font-size: 30px;
color: black;
}

.pull-me2 {
text-align: center;
font-family: sans-serif;
font-size: 30px;
}

.pull-me3 {
text-align: center;
font-family: sans-serif;
font-size: 30px;
}

#ig {
height: 30px;
}

.menu {
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
background-image: url("http://i64.tinypic.com/2hozok4.jp");
background-repeat: no-repeat;
font-family: cursive;
width: -500px;
}

</style>
 <header>
<h1 class="text-center" id="mainHeader">Random Website</h1>
<a href="https://www.instagram.com/piccolo_villagio/" ><img id="ig" src="http://www.logosurfer.com/sites/default/files/styles/large/public/instagram-logo_0.png?itok=ujucvqfJ" height = "20px"></a>

<div class="panel">
<img class="1 img-responsive" src="http://i64.tinypic.com/scrp6h.jpg" width="324"></a>
<h3>500</h3>
<img class="1 img-responsive" src="http://i68.tinypic.com/2h7qbn4.jpg" width="324"></a>
<br/>
<br/>
</div>
<div class="pull-me">Scroll Menu 1</div>
</header>
<!--
Entering body below
-->
<body>
<div class="panel2">
<div class="menu">

</div>
<br/>
<br/>
</div>
<div class="pull-me2">Scroll Menu 2</div>
</body>

Screenshot of HTML page

最佳答案

由于bootstrap.css,背景是白色的。

只需注释掉 background-color: #fff scaffolding.less 文件中的行

body {
font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
font-size: 14px;
line-height: 1.42857143;
color: #333;
/* background-color: #fff; */
}

或者您可以将下面的代码添加到您的 .css 文件中

body {
background-color: transparent!important;
}

这是更新版本:https://jsfiddle.net/oj91Lb1d/2/

顺便说一下,<header>标签应该在 <body> 内标签。您很可能将它与 <head> 混淆了标签。除此之外,还有两个 </a>标签,应该包括 <img/>标签,但没有开口 <a href="#">标签。

关于javascript - 我的 HTML 页面上的白点,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39936474/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com