J'essaie de les fusionner dans la cellule afin qu'elle n'utilise qu'une seule image d'arrière-plan que j'ai essayée toute la journée sans succès. Est-ce que quelqu'un pourrait aider, je l'apprécierais beaucoup,

Le domaine racine est http://amalgamite.com afin que vous puissiez voir de quoi je parle des deux images.

<!DOCTYPE html>

<!--[if IE]><![endif]-->
<!--[if IE 8 ]><html dir="ltr" lang="en" class="ie8"><![endif]-->
<!--[if IE 9 ]><html dir="ltr" lang="en" class="ie9"><![endif]-->
<!--[if (gt IE 9)|!(IE)]><!-->
<html dir="ltr" lang="en">
<!--<![endif]-->
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>BBQ Grills & Supply</title>
<base href="http://amalgamite.com/" />
<meta name="description" content="BBQ Grills & Supply" />
<meta name="keywords" content= "BBQ Grills & Supply" />
<script src="catalog/view/javascript/jquery/jquery-2.1.1.min.js" type="text/javascript"></script>
<link href="catalog/view/javascript/bootstrap/css/bootstrap.min.css" rel="stylesheet" media="screen" />
<script src="catalog/view/javascript/bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
<link href="catalog/view/javascript/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css" />
<link href="//fonts.googleapis.com/css?family=Open+Sans:400,400i,300,700" rel="stylesheet" type="text/css" />
<link href="catalog/view/theme/Bearing Depot/stylesheet/stylesheet.css" rel="stylesheet">
<script src="catalog/view/javascript/common.js" type="text/javascript"></script>
<link href="http://amalgamite.com/" rel="canonical" />
</head>

<body oncontextmenu="return false;" class="common-home"> 
 <nav id="top">
  <div class="container"  style="background: url(http://amalgamite.com/pics/Header-Cell-BG.png);">
    <div class="row">

      <div id="logo">
                    <a href="http://amalgamite.com/index.php?route=common/home"><div class="HeaderTextLarge">BBQ Grills & Supply</div>
          <br /><div class="HeaderTextSmall">800 Lincoln Blvd. Plainfield PA</div></a>          

      <div id="top-links" class="nav pull-right" style="clear:bolth;">
       <ul class="list-inline">

        <li><a href="http://amalgamite.com/index.php?route=information/contact"><i class="fa fa-phone fa-Top"></i></a> <span class="hidden-xs hidden-sm hidden-md HeaderTextXSmall">732.563.2225</span></li>

        <li class="dropdown"><a href="http://amalgamite.com/index.php?route=account/account" title="My Account" class="dropdown-toggle" data-toggle="dropdown">
        <i class="fa fa-user fa-Top"></i> <span class="hidden-xs hidden-sm hidden-md HeaderTextXSmall">My Account</span> <span class="caret"></span></a>
          <ul class="dropdown-menu dropdown-menu-right HeaderTextXSmall">
                        <li><a href="http://amalgamite.com/index.php?route=account/register">Register</a></li>
            <li><a href="http://amalgamite.com/index.php?route=account/login">Login</a></li>
                      </ul>
        </li>

        <li><a href="http://amalgamite.com/index.php?route=checkout/cart" title="Shopping Cart"><i class="fa fa-shopping-cart fa-Top"></i> <span class="hidden-xs hidden-sm hidden-md HeaderTextXSmall">Shopping Cart</span></a></li>
        <li><a href="http://amalgamite.com/index.php?route=checkout/checkout" title="Checkout"><i class="fa fa-share fa-Top"></i> <span class="hidden-xs hidden-sm hidden-md HeaderTextXSmall">Checkout</span></a></li>
      </ul>  </div>
      </div>
    </div>
  </div>
</nav>

<header>
  <div class="container"  style="background: url(http://amalgamite.com/pics/Header-Cell-BG.png);">
    <div class="row">
      <div class="col-sm-4">&nbsp;</div>
      <div class="col-sm-5"><div id="search" class="input-group">
  <input type="text" name="search" value="" placeholder="Search" class="form-control input-lg" />
  <span class="input-group-btn">
    <button type="button" class="btn btn-default btn-lg"><i class="fa fa-search"></i></button>
  </span>
</div></div>
      <div class="col-sm-3"><div id="cart" class="btn-group btn-block">
  <button type="button" data-toggle="dropdown" data-loading-text="Loading..." class="btn btn-inverse btn-block btn-lg dropdown-toggle"><i class="fa fa-shopping-cart"></i> <span id="cart-total">0 item(s) - $0.00</span></button>
  <ul class="dropdown-menu pull-right">
        <li>
      <p class="text-center">Your shopping cart is empty!</p>
    </li>
      </ul>
</div>
</div>
    </div>
  </div>
</header>
0
Blnukem 5 janv. 2016 à 00:09

3 réponses

Meilleure réponse

Extraire l'en-tête ci-dessous et le mettre dans le dernier div dans la barre de navigation et définir l'arrière-plan comme transparent

  <header>
  <div class="container"  style="background:transparent">
    <div class="row">
      <div class="col-sm-4">&nbsp;</div>
      <div class="col-sm-5"><div id="search" class="input-group">
  <input type="text" name="search" value="" placeholder="Search" class="form-control input-lg" />
  <span class="input-group-btn">
    <button type="button" class="btn btn-default btn-lg"><i class="fa fa-search"></i></button>
  </span>
</div></div>
      <div class="col-sm-3"><div id="cart" class="btn-group btn-block">
  <button type="button" data-toggle="dropdown" data-loading-text="Loading..." class="btn btn-inverse btn-block btn-lg dropdown-toggle"><i class="fa fa-shopping-cart"></i> <span id="cart-total">0 item(s) - $0.00</span></button>
  <ul class="dropdown-menu pull-right">
        <li>
      <p class="text-center">Your shopping cart is empty!</p>
    </li>
      </ul>
</div>
</div>
    </div>
  </div>
</header>

------ SNIPPET ICI --------------------

<title>Bearing Depot &amp; Supply</title>
<base href="http://amalgamite.com/" />
<meta name="description" content="BBQ Grills & Supply" />
<meta name="keywords" content= "BBQ Grills & Supply" />
<script src="catalog/view/javascript/jquery/jquery-2.1.1.min.js" type="text/javascript"></script>
<link href="catalog/view/javascript/bootstrap/css/bootstrap.min.css" rel="stylesheet" media="screen" />
<script src="catalog/view/javascript/bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
<link href="catalog/view/javascript/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css" />
<link href="//fonts.googleapis.com/css?family=Open+Sans:400,400i,300,700" rel="stylesheet" type="text/css" />
<link href="catalog/view/theme/Bearing Depot/stylesheet/stylesheet.css" rel="stylesheet">
<script src="catalog/view/javascript/common.js" type="text/javascript"></script>
<link href="http://amalgamite.com/" rel="canonical" />

<body oncontextmenu="return false;" class="common-home"> 
 <nav id="top">
  <div class="container"  style="background: url(http://amalgamite.com/pics/Header-Cell-BG.png);">
    <div class="row">
            
      <div id="logo">
                    <a href="http://amalgamite.com/index.php?route=common/home"><div class="HeaderTextLarge">BBQ Grills & Supply</div>
          <br /><div class="HeaderTextSmall">800 Lincoln Blvd. Plainfield PA</div></a>          
                              
      <div id="top-links" class="nav pull-right" style="clear:bolth;">
       <ul class="list-inline">
        
        <li><a href="http://amalgamite.com/index.php?route=information/contact"><i class="fa fa-phone fa-Top"></i></a> <span class="hidden-xs hidden-sm hidden-md HeaderTextXSmall">732.563.2225</span></li>
        
        <li class="dropdown"><a href="http://amalgamite.com/index.php?route=account/account" title="My Account" class="dropdown-toggle" data-toggle="dropdown">
        <i class="fa fa-user fa-Top"></i> <span class="hidden-xs hidden-sm hidden-md HeaderTextXSmall">My Account</span> <span class="caret"></span></a>
          <ul class="dropdown-menu dropdown-menu-right HeaderTextXSmall">
                        <li><a href="http://amalgamite.com/index.php?route=account/register">Register</a></li>
            <li><a href="http://amalgamite.com/index.php?route=account/login">Login</a></li>
                      </ul>
        </li>

        <li><a href="http://amalgamite.com/index.php?route=checkout/cart" title="Shopping Cart"><i class="fa fa-shopping-cart fa-Top"></i> <span class="hidden-xs hidden-sm hidden-md HeaderTextXSmall">Shopping Cart</span></a></li>
        <li><a href="http://amalgamite.com/index.php?route=checkout/checkout" title="Checkout"><i class="fa fa-share fa-Top"></i> <span class="hidden-xs hidden-sm hidden-md HeaderTextXSmall">Checkout</span></a></li>
      </ul>  </div>
      </div>
    </div>
      <header>
  <div class="container"  style="background:transparent">
    <div class="row">
      <div class="col-sm-4">&nbsp;</div>
      <div class="col-sm-5"><div id="search" class="input-group">
  <input type="text" name="search" value="" placeholder="Search" class="form-control input-lg" />
  <span class="input-group-btn">
    <button type="button" class="btn btn-default btn-lg"><i class="fa fa-search"></i></button>
  </span>
</div></div>
      <div class="col-sm-3"><div id="cart" class="btn-group btn-block">
  <button type="button" data-toggle="dropdown" data-loading-text="Loading..." class="btn btn-inverse btn-block btn-lg dropdown-toggle"><i class="fa fa-shopping-cart"></i> <span id="cart-total">0 item(s) - $0.00</span></button>
  <ul class="dropdown-menu pull-right">
        <li>
      <p class="text-center">Your shopping cart is empty!</p>
    </li>
      </ul>
</div>
</div>
    </div>
  </div>
</header>
  </div>

</nav>
1
repzero 4 janv. 2016 à 22:47

Vous devrez peut-être travailler avec les images elles-mêmes pour les voir de plus près comme vous le souhaitez.

Quel que soit le niveau de codage, vous pouvez avoir l'une des images au lieu de deux. Appliquez cette image à la propriété background de la balise <body> ou d'un nouveau <div> qui englobe tous les éléments sur lesquels vous souhaitez avoir l'image d'arrière-plan.

Par exemple, en plaçant l'image d'arrière-plan sur l'élément <body> uniquement:

  1. Supprimez tous les attributs background des .container, #top .container et #top (et partout ailleurs nécessaires).
  2. Ajoutez background: url(http://amalgamite.com/pics/Header-Cell-BG.png); à votre <body>.

Cela devrait aider à clarifier l'apparence et la sensation.

Clause de non-responsabilité: La mise en œuvre dépend à 100% de vous, soyez créatif!

0
AGE 4 janv. 2016 à 21:24

Essaye ça :

<!DOCTYPE html>

<!--[if IE]><![endif]-->
<!--[if IE 8 ]><html dir="ltr" lang="en" class="ie8"><![endif]-->
<!--[if IE 9 ]><html dir="ltr" lang="en" class="ie9"><![endif]-->
<!--[if (gt IE 9)|!(IE)]><!-->
<html dir="ltr" lang="en">
<!--<![endif]-->
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>BBQ Grills & Supply</title>
<base href="http://amalgamite.com/" />
<meta name="description" content="BBQ Grills & Supply" />
<meta name="keywords" content= "BBQ Grills & Supply" />
<script src="catalog/view/javascript/jquery/jquery-2.1.1.min.js" type="text/javascript"></script>
<link href="catalog/view/javascript/bootstrap/css/bootstrap.min.css" rel="stylesheet" media="screen" />
<script src="catalog/view/javascript/bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
<link href="catalog/view/javascript/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css" />
<link href="//fonts.googleapis.com/css?family=Open+Sans:400,400i,300,700" rel="stylesheet" type="text/css" />
<link href="catalog/view/theme/Bearing Depot/stylesheet/stylesheet.css" rel="stylesheet">
<script src="catalog/view/javascript/common.js" type="text/javascript"></script>
<link href="http://amalgamite.com/" rel="canonical" />
</head>

<body oncontextmenu="return false;" class="common-home"> 


<header style="background: url(http://amalgamite.com/pics/Header-Cell-BG.png);">
<nav id="top">
  <div class="container">
    <div class="row">

      <div id="logo">
                    <a href="http://amalgamite.com/index.php?route=common/home"><div class="HeaderTextLarge">BBQ Grills & Supply</div>
          <br /><div class="HeaderTextSmall">800 Lincoln Blvd. Plainfield PA</div></a>          

      <div id="top-links" class="nav pull-right" style="clear:bolth;">
       <ul class="list-inline">

        <li><a href="http://amalgamite.com/index.php?route=information/contact"><i class="fa fa-phone fa-Top"></i></a> <span class="hidden-xs hidden-sm hidden-md HeaderTextXSmall">732.563.2225</span></li>

        <li class="dropdown"><a href="http://amalgamite.com/index.php?route=account/account" title="My Account" class="dropdown-toggle" data-toggle="dropdown">
        <i class="fa fa-user fa-Top"></i> <span class="hidden-xs hidden-sm hidden-md HeaderTextXSmall">My Account</span> <span class="caret"></span></a>
          <ul class="dropdown-menu dropdown-menu-right HeaderTextXSmall">
                        <li><a href="http://amalgamite.com/index.php?route=account/register">Register</a></li>
            <li><a href="http://amalgamite.com/index.php?route=account/login">Login</a></li>
                      </ul>
        </li>

        <li><a href="http://amalgamite.com/index.php?route=checkout/cart" title="Shopping Cart"><i class="fa fa-shopping-cart fa-Top"></i> <span class="hidden-xs hidden-sm hidden-md HeaderTextXSmall">Shopping Cart</span></a></li>
        <li><a href="http://amalgamite.com/index.php?route=checkout/checkout" title="Checkout"><i class="fa fa-share fa-Top"></i> <span class="hidden-xs hidden-sm hidden-md HeaderTextXSmall">Checkout</span></a></li>
      </ul>  </div>
      </div>
    </div>
  </div>
</nav>
  <div class="container">
    <div class="row">
      <div class="col-sm-4">&nbsp;</div>
      <div class="col-sm-5"><div id="search" class="input-group">
  <input type="text" name="search" value="" placeholder="Search" class="form-control input-lg" />
  <span class="input-group-btn">
    <button type="button" class="btn btn-default btn-lg"><i class="fa fa-search"></i></button>
  </span>
</div></div>
      <div class="col-sm-3"><div id="cart" class="btn-group btn-block">
  <button type="button" data-toggle="dropdown" data-loading-text="Loading..." class="btn btn-inverse btn-block btn-lg dropdown-toggle"><i class="fa fa-shopping-cart"></i> <span id="cart-total">0 item(s) - $0.00</span></button>
  <ul class="dropdown-menu pull-right">
        <li>
      <p class="text-center">Your shopping cart is empty!</p>
    </li>
      </ul>
</div>
</div>
    </div>
  </div>
</header>
<div id="content">
<h2> your content here</h2>
</div>
</body>

Est-ce ce que vous essayez d'accomplir? Sur une note latérale, vous devez mettre votre style dans un fichier .css.

0
Laurent Fauvel 4 janv. 2016 à 22:05