jquery – background-image：url(“images / plaid.jpg”)no-repeat;不会出现

我似乎无法在我的任何页面上制作我的plaid.jpg背景,更不用说所有这些了,我已经尝试通过body,html,*,“home”的具体ID来选择它.什么都行不通图像为300 x 421像素.我不需要它显示漂亮,我只是希望它出现在一切背后.我的css怎么看这个？ plaid.jpg图片位于我的images文件夹中与index.html文件位于同一目录中.此链接位于index.html文件的顶部.我的样式表位于名为mystyles.css的样式表文件夹中.

<link rel="stylesheet" type="text/css" href="stylesheets/mystyles.css">

在我看来,我试图以可想象的方式改变我的.CSS文件.前30个谷歌搜索结果“背景图像没有显示”,但没有一个工作.我知道这可能很简单.

mystyles.css是最基本的形式,没有选择器.

background-image: url("images/plaid.jpg") no-repeat;

的index.html

<body>
        <!-- Page: home -->
            <div id="home"
                data-role="page"
                data-title="Home">
                <div data-role="header"
                    data-position="fixed"
                    data-theme="b">
                    <h1>Home</h1>
                    <a href="#info"
                        data-icon="info"
                        data-iconpos="notext"
                        data-rel="dialog"
                        class="ui-btn-right"
                        >Info</a>
                </div><!-- header -->
                <div data-role="content">
 
                <div data-role="controlgroup" data-theme="e">
                    <a href="#blog" 
                        data-role="button"
                        data-icon="arrow-r"
                         data-theme="e"
                    >Blog</a>
                    <a href="#videos" 
                        data-role="button"
                        data-icon="arrow-r"
                         data-theme="e"
                    >Videos</a>
                    <a href="#photos" 
                        data-role="button"
                        data-icon="arrow-r"
                         data-theme="e"
                    >Photos</a>
                    <a href="#tweets" 
                        data-role="button"
                        data-icon="arrow-r"
                         data-theme="e"
                    >Tweets</a>
                </div><!-- links -->
                </div> <!-- content -->
            </div><!-- page -->

这不成功

body {
    background-image: url("/images/plaid.jpg");
    background-repeat: no-repeat;
}

这也是我的意思

<head>
    <Meta charset="utf-8" />
    <title>Mob App</title>
    <head>
    <Meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1" />
 
    <link rel="shortcut icon" href="images/favicon.ico" /> 
 
    <!--<link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" />-->
    <script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
    <script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>
 
    <script src="javascripts/myscript.js"></script>
    <link rel="stylesheet" type="text/css" href="stylesheets/mystyles.css" />
    </head>

解决方法

你要么使用：

background-image: url("images/plaid.jpg");
background-repeat: no-repeat;

… 要么

background: transparent url("images/plaid.jpg") top left no-repeat;

……但最终没有

background-image: url("images/plaid.jpg") no-repeat;

编辑：使用绝对路径在JSFIDDLE进行演示(如果您在使用相对路径引用图像时遇到麻烦).

jquery – background-image：url(“images / plaid.jpg”)no-repeat;不会出现

解决方法

猜你在找的jQuery相关文章