CSS背景图片涵盖标题和文本

Question

Any ideas on why my external css sheet won't cooperate? 关于为什么我的外部CSS表单无法配合的任何想法？ I need the content of my page to rest below the background image. 我需要页面的内容位于背景图片之下。 Here is my html code...I will place the external css snippet below: 这是我的HTML代码...我将在下面放置外部CSS代码段：

<!DOCTYPE html>
<html>
    <head>
    <link rel="stylesheet" type="text/css" href="AlbumPage.css">
    <link <link href="https://fonts.googleapis.com/css?family=IM+Fell+English" rel="stylesheet">
        <title>Album Page </title>
    </head>
    <body>
    <div class="Album Art"> 
    </div>
    <span style="margin-top: 500px">
            <h1>Captain Fantastic and the Brown Dirt Cowboy</h1>
        <center><a href="http://ultimateclassicrock.com/elton-john-captain-fantastic/" target"_blank">Elton John</a>
        <p>May, 1975</center></p></center>
        <table border="1" width="100%"></table>
        <h2><bold><center>Band Members and Producers</center></bold></h2>


css:
body{background-image: url("Captain Fantastic Full Album Art.jpg"); 
    background-repeat: no-repeat;
    background-position: center top;
    height: 200px
    width:350px;}

h1 {font-family: 'IM Fell English', serif; text-align: center; }
h2 {font-family: 'IM Fell English', serif; text-align: center;}

Answer 1

Put the background image inside a div. 将背景图像放入div中。 If it's in the body it will cover the entire page. 如果在正文中，它将覆盖整个页面。

<body>
    <div class="album-art"></div>
    <h1>Captain Fantastic and the Brown Dirt Cowboy</h1>
    <center><a href="http://ultimateclassicrock.com/elton-john-captain-fantastic/" target"_blank">Elton John</a>
    <p>May, 1975</center></p></center>
    <table border="1" width="100%"></table>
    <h2><bold><center>Band Members and Producers</center></bold></h2>
</body>

<!--Style-->
<style>
    .album-art {
        background-image: url("Captain Fantastic Full Album Art.jpg"); 
        background-repeat: no-repeat;
        background-position: center top;
        height: 200px
        width:350px;
    }
    h1 {
        font-family: 'IM Fell English', serif; 
        text-align: center; 
    }
    h2 {
        font-family: 'IM Fell English', serif; 
        text-align: center;
    }
</style>

CSS背景图片涵盖标题和文本

问题描述

1 个解决方案

解决方案1
0 2017-01-04 22:09:51

CSS背景图片涵盖标题和文本

问题描述

1 个解决方案

解决方案1 0 2017-01-04 22:09:51

解决方案1
0 2017-01-04 22:09:51