-1

我在 html 标记中将背景图片添加到我的背景网站时遇到问题。问题在这里:

html{
background:url('assets/img/jp-logo.png'); /*background image*/
background-image:url('assets/img/jp-logo.png'); /*background image*/
-webkit-background-size: cover;
-moz-background-size: cover;
}

我同时放入背景和背景图像,因为我测试了其中任何一个是否可以与背景尺寸一起使用:封面但没有一个可以。我还检查了我的文件目录路径,这些也很好。我想知道为什么因为那不应该发生。我在单独的 html 和 css 测试表上对其进行了测试,并且它有效,但为什么不在这里对我来说是可疑的。完整代码在这里:http: //jsfiddle.net/TheAmazingKnight/kjLg8/

我制作的这个简短示例有效:

<!doctype html>
<html lang="en">
<head>
    <title>Test Page</title>
    <link rel="stylesheet" href="test.css" type="text/css" media="screen" /> <!--CSS for desktop screens-->
</head>
<body>
    <p>hello</p>
    <img src="jp-logo.png" alt="jp-logo.png" />
</body>
</html>

html{
background-image:url('assets/img/jp-logo.png');
}
4

4 回答 4

1

html没有语义价值。改为使用body。您可能想给您bodymargin:0;.

于 2013-09-07T23:31:09.213 回答
1

我更改了您的背景照片并像这样放置到 body 元素中:

body{

    background:url(http://technomarketer.typepad.com/technomarketer//Radiohead_wallpaper.jpg); /*background image*/

-webkit-background-size: cover;
-moz-background-size: cover;

它奏效了。

所以,也许你的照片路径(assets/img/jp-logo.png)是错误的。

你检查了吗?

于 2013-09-08T01:05:01.673 回答
0
html{
background:url("assets/img/jp-logo.png") no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}

我发现这段代码完美运行,并在应得的地方给予赞扬: http ://css-tricks.com/perfect-full-page-background-image/

于 2013-12-16T14:27:59.230 回答
-1

如果你想在 html 页面中编写 css 代码是这样的

<head>
<title>hello</title>
<style type="text/css">
html{
background: url(photo.jpg);
}
</style>
</head>

并且图片网址不在引号'image.jpg'之间
,最好使用body而不是html

于 2013-09-07T23:49:20.937 回答