Jump to content
  • Checkout
  • Login
  • Get in touch

osCommerce

The e-commerce.

Background image help


Guest

Recommended Posts

Hi, can someone please walk me through setting a background image to my store...this is the code below it is a contribution that centered my store....how do I add a background...Help Please...

 

 

/*

 

$Id: stylesheet.css,v 1.56 2003/06/30 20:04:02 hpdl Exp $

 

 

 

osCommerce, Open Source E-Commerce Solutions

 

http://www.oscommerce.com

 

 

 

Copyright © 2003 osCommerce

 

 

 

Released under the GNU General Public License

 

*/

 

 

 

.boxText { font-family: Verdana, Arial, sans-serif; font-size: 10px; }

 

.errorBox { font-family : Verdana, Arial, sans-serif; font-size : 10px; background: #ffb3b5; font-weight: bold; }

 

.stockWarning { font-family : Verdana, Arial, sans-serif; font-size : 10px; color: #cc0033; }

 

.productsNotifications { background: #f2fff7; }

 

.orderEdit { font-family : Verdana, Arial, sans-serif; font-size : 10px; color: #70d250; text-decoration: underline; }

 

 

 

BODY {

 

text-align: center;

 

background: #ffffff;

 

color: #000000;

 

margin: 0px;

 

}

 

 

 

.fixcenter {

 

width: 778px;

 

border: solid; border-width: 1px;

 

background: #ffffff;

 

color: #000000;

 

margin: auto;

 

margin-top: 20px;

 

text-align: left;

 

}

 

 

 

A {

 

color: #000000;

 

text-decoration: none;

 

}

 

 

 

A:hover {

 

color: #AABBDD;

 

text-decoration: underline;

 

}

 

 

 

FORM {

 

display: inline;

 

}

 

 

 

TR.header {

 

background: #ffffff;

 

}

 

 

 

TR.headerNavigation {

 

background: #bbc3d3;

 

}

 

 

 

TD.headerNavigation {

 

font-family: Verdana, Arial, sans-serif;

 

font-size: 10px;

 

background: #bbc3d3;

 

color: #ffffff;

 

font-weight : bold;

 

}

 

 

 

A.headerNavigation {

 

color: #FFFFFF;

 

}

 

 

 

A.headerNavigation:hover {

 

color: #ffffff;

 

}

 

 

 

TR.headerError {

 

background: #ff0000;

 

}

 

 

 

TD.headerError {

 

font-family: Tahoma, Verdana, Arial, sans-serif;

 

font-size: 12px;

 

background: #ff0000;

 

color: #ffffff;

 

font-weight : bold;

 

text-align : center;

 

}

 

 

 

TR.headerInfo {

 

background: #00ff00;

 

}

 

 

 

TD.headerInfo {

 

font-family: Tahoma, Verdana, Arial, sans-serif;

 

font-size: 12px;

 

background: #00ff00;

 

color: #ffffff;

 

font-weight: bold;

 

text-align: center;

 

}

 

 

 

TR.footer {

 

background: #bbc3d3;

 

}

 

 

 

TD.footer {

 

font-family: Verdana, Arial, sans-serif;

 

font-size: 10px;

 

background: #bbc3d3;

 

color: #ffffff;

 

font-weight: bold;

 

}

 

 

 

.infoBox {

 

background: #b6b7cb;

 

}

 

 

 

.infoBoxContents {

 

background: #f8f8f9;

 

font-family: Verdana, Arial, sans-serif;

 

font-size: 10px;

 

}

 

 

 

.infoBoxNotice {

 

background: #FF8E90;

 

}

 

 

 

.infoBoxNoticeContents {

 

background: #FFE6E6;

 

font-family: Verdana, Arial, sans-serif;

 

font-size: 10px;

 

}

 

 

 

TD.infoBoxHeading {

 

font-family: Verdana, Arial, sans-serif;

 

font-size: 10px;

 

font-weight: bold;

 

background: #bbc3d3;

 

color: #ffffff;

 

}

 

 

 

TD.infoBox, SPAN.infoBox {

 

font-family: Verdana, Arial, sans-serif;

 

font-size: 10px;

 

}

 

 

 

.contentBox {

 

background: #b6b7cb;

 

}

 

 

 

TD.contentBoxHeading {

 

font-family: Verdana, Arial, sans-serif;

 

font-size: 10px;

 

font-weight: bold;

 

background: #b6b7cb;

 

color: #ffffff;

 

}

 

 

 

.contentBoxContents {

 

background: #f8f8f9;

 

font-family: Verdana, Arial, sans-serif;

 

font-size: 10px;

 

}

 

 

 

 

 

.BestSellersBox {

 

background: #b6b7cb;

 

}

 

TD.BestSellersBoxHeading {

 

font-family: Verdana, Arial, sans-serif;

 

font-size: 10px;

 

font-weight: bold;

 

background: #b6b7cb;

 

color: #ffffff;

 

}

 

.BestSellersBoxContents {

 

background: #f8f8f9;

 

font-family: Verdana, Arial, sans-serif;

 

font-size: 10px;

 

}

 

 

 

 

 

.CategoriesBox {

 

background: #b6b7cb;

 

}

 

TD.CategoriesBoxHeading {

 

font-family: Verdana, Arial, sans-serif;

 

font-size: 10px;

 

font-weight: bold;

 

background: #b6b7cb;

 

color: #ffffff;

 

}

 

.CategoriesBoxContents {

 

background: #f8f8f9;

 

font-family: Verdana, Arial, sans-serif;

 

font-size: 10px;

 

}

 

 

 

 

 

.CurrenciesBox {

 

background: #b6b7cb;

 

}

 

TD.CurrenciesBoxHeading {

 

font-family: Verdana, Arial, sans-serif;

 

font-size: 10px;

 

font-weight: bold;

 

background: #b6b7cb;

 

color: #ffffff;

 

}

 

.CurrenciesBoxContents {

 

background: #f8f8f9;

 

font-family: Verdana, Arial, sans-serif;

 

font-size: 10px;

 

}

 

 

 

 

 

.InformationBox {

 

background: #b6b7cb;

 

}

 

TD.InformationBoxHeading {

 

font-family: Verdana, Arial, sans-serif;

 

font-size: 10px;

 

font-weight: bold;

 

background: #b6b7cb;

 

color: #ffffff;

 

}

 

.InformationBoxContents {

 

background: #f8f8f9;

 

font-family: Verdana, Arial, sans-serif;

 

font-size: 10px;

 

}

 

 

 

 

 

.LanguagesBox {

 

background: #b6b7cb;

 

}

 

TD.LanguagesBoxHeading {

 

font-family: Verdana, Arial, sans-serif;

 

font-size: 10px;

 

font-weight: bold;

 

background: #b6b7cb;

 

color: #ffffff;

 

}

 

.LanguagesBoxContents {

 

background: #f8f8f9;

 

font-family: Verdana, Arial, sans-serif;

 

font-size: 10px;

 

}

 

 

 

 

 

.ManufacturerInfoBox {

 

background: #b6b7cb;

 

}

 

TD.ManufacturerInfoBoxHeading {

 

font-family: Verdana, Arial, sans-serif;

 

font-size: 10px;

 

font-weight: bold;

 

background: #b6b7cb;

 

color: #ffffff;

 

}

 

.ManufacturerInfoBoxContents {

 

background: #f8f8f9;

 

font-family: Verdana, Arial, sans-serif;

 

font-size: 10px;

 

}

 

 

 

 

 

.ManufacturersBox {

 

background: #b6b7cb;

 

}

 

TD.ManufacturersBoxHeading {

 

font-family: Verdana, Arial, sans-serif;

 

font-size: 10px;

 

font-weight: bold;

 

background: #b6b7cb;

 

color: #ffffff;

 

}

 

.ManufacturersBoxContents {

 

background: #f8f8f9;

 

font-family: Verdana, Arial, sans-serif;

 

font-size: 10px;

 

}

 

 

 

 

 

.OrderHistoryBox {

 

background: #b6b7cb;

 

}

 

TD.OrderHistoryBoxHeading {

 

font-family: Verdana, Arial, sans-serif;

 

font-size: 10px;

 

font-weight: bold;

 

background: #b6b7cb;

 

color: #ffffff;

 

}

 

.OrderHistoryBoxContents {

 

background: #f8f8f9;

 

font-family: Verdana, Arial, sans-serif;

 

font-size: 10px;

 

}

 

 

 

 

 

.ProductNotificationsBox {

 

background: #b6b7cb;

 

}

 

TD.ProductNotificationsBoxHeading {

 

font-family: Verdana, Arial, sans-serif;

 

font-size: 10px;

 

font-weight: bold;

 

background: #b6b7cb;

 

color: #ffffff;

 

}

 

.ProductNotificationsBoxContents {

 

background: #f8f8f9;

 

font-family: Verdana, Arial, sans-serif;

 

font-size: 10px;

 

}

 

 

 

 

 

.ReviewsBox {

 

background: #b6b7cb;

 

}

 

TD.ReviewsBoxHeading {

 

font-family: Verdana, Arial, sans-serif;

 

font-size: 10px;

 

font-weight: bold;

 

background: #b6b7cb;

 

color: #ffffff;

 

}

 

.ReviewsBoxContents {

 

background: #f8f8f9;

 

font-family: Verdana, Arial, sans-serif;

 

font-size: 10px;

 

}

 

 

 

 

 

.SearchBox {

 

background: #b6b7cb;

 

}

 

TD.SearchBoxHeading {

 

font-family: Verdana, Arial, sans-serif;

 

font-size: 10px;

 

font-weight: bold;

 

background: #b6b7cb;

 

color: #ffffff;

 

}

 

.SearchBoxContents {

 

background: #f8f8f9;

 

font-family: Verdana, Arial, sans-serif;

 

font-size: 10px;

 

}

 

 

 

 

 

.ShoppingCartBox {

 

background: #b6b7cb;

 

}

 

TD.ShoppingCartBoxHeading {

 

font-family: Verdana, Arial, sans-serif;

 

font-size: 10px;

 

font-weight: bold;

 

background: #b6b7cb;

 

color: #ffffff;

 

}

 

.ShoppingCartBoxContents {

 

background: #f8f8f9;

 

font-family: Verdana, Arial, sans-serif;

 

font-size: 10px;

 

}

 

 

 

 

 

.SpecialsBox {

 

background: #b6b7cb;

 

}

 

TD.SpecialsBoxHeading {

 

font-family: Verdana, Arial, sans-serif;

 

font-size: 10px;

 

font-weight: bold;

 

background: #b6b7cb;

 

color: #ffffff;

 

}

 

.SpecialsBoxContents {

 

background: #f8f8f9;

 

font-family: Verdana, Arial, sans-serif;

 

font-size: 10px;

 

}

 

 

 

 

 

.TellaFriendBox {

 

background: #b6b7cb;

 

}

 

TD.TellaFriendBoxHeading {

 

font-family: Verdana, Arial, sans-serif;

 

font-size: 10px;

 

font-weight: bold;

 

background: #b6b7cb;

 

color: #ffffff;

 

}

 

.TellaFriendBoxContents {

 

background: #f8f8f9;

 

font-family: Verdana, Arial, sans-serif;

 

font-size: 10px;

 

}

 

 

 

 

 

.WhatsNewBox {

 

background: #b6b7cb;

 

}

 

TD.WhatsNewBoxHeading {

 

font-family: Verdana, Arial, sans-serif;

 

font-size: 10px;

 

font-weight: bold;

 

background: #b6b7cb;

 

color: #ffffff;

 

}

 

.WhatsNewBoxContents {

 

background: #f8f8f9;

 

font-family: Verdana, Arial, sans-serif;

 

font-size: 10px;

 

}

 

 

 

TR.accountHistory-odd, TR.addressBook-odd, TR.alsoPurchased-odd, TR.payment-odd, TR.productListing-odd, TR.productReviews-odd, TR.upcomingProducts-odd, TR.shippingOptions-odd {

 

background: #f8f8f9;

 

}

 

 

 

TR.accountHistory-even, TR.addressBook-even, TR.alsoPurchased-even, TR.payment-even, TR.productListing-even, TR.productReviews-even, TR.upcomingProducts-even, TR.shippingOptions-even {

 

background: #f8f8f9;

 

}

 

 

 

TABLE.productListing {

 

border: 1px;

 

border-style: solid;

 

border-color: #b6b7cb;

 

border-spacing: 1px;

 

}

 

 

 

.productListing-heading {

 

font-family: Verdana, Arial, sans-serif;

 

font-size: 10px;

 

background: #b6b7cb;

 

color: #FFFFFF;

 

font-weight: bold;

 

}

 

 

 

TD.productListing-data {

 

font-family: Verdana, Arial, sans-serif;

 

font-size: 10px;

 

}

 

 

 

A.pageResults {

 

color: #0000FF;

 

}

 

 

 

A.pageResults:hover {

 

color: #0000FF;

 

background: #FFFF33;

 

}

 

 

 

TD.pageHeading, DIV.pageHeading {

 

font-family: Verdana, Arial, sans-serif;

 

font-size: 20px;

 

font-weight: bold;

 

color: #9a9a9a;

 

}

 

 

 

TR.subBar {

 

background: #f4f7fd;

 

}

 

 

 

TD.subBar {

 

font-family: Verdana, Arial, sans-serif;

 

font-size: 10px;

 

color: #000000;

 

}

 

 

 

TD.main, P.main {

 

font-family: Verdana, Arial, sans-serif;

 

font-size: 11px;

 

line-height: 1.5;

 

}

 

 

 

TD.smallText, SPAN.smallText, P.smallText {

 

font-family: Verdana, Arial, sans-serif;

 

font-size: 10px;

 

}

 

 

 

TD.accountCategory {

 

font-family: Verdana, Arial, sans-serif;

 

font-size: 13px;

 

color: #aabbdd;

 

}

 

 

 

TD.fieldKey {

 

font-family: Verdana, Arial, sans-serif;

 

font-size: 12px;

 

font-weight: bold;

 

}

 

 

 

TD.fieldValue {

 

font-family: Verdana, Arial, sans-serif;

 

font-size: 12px;

 

}

 

 

 

TD.tableHeading {

 

font-family: Verdana, Arial, sans-serif;

 

font-size: 12px;

 

font-weight: bold;

 

}

 

 

 

SPAN.newItemInCart {

 

font-family: Verdana, Arial, sans-serif;

 

font-size: 10px;

 

color: #ff0000;

 

}

 

 

 

CHECKBOX, INPUT, RADIO, SELECT {

 

font-family: Verdana, Arial, sans-serif;

 

font-size: 11px;

 

}

 

 

 

TEXTAREA {

 

width: 100%;

 

font-family: Verdana, Arial, sans-serif;

 

font-size: 11px;

 

}

 

 

 

SPAN.greetUser {

 

font-family: Verdana, Arial, sans-serif;

 

font-size: 12px;

 

color: #f0a480;

 

font-weight: bold;

 

}

 

 

 

TABLE.formArea {

 

background: #f1f9fe;

 

border-color: #7b9ebd;

 

border-style: solid;

 

border-width: 1px;

 

}

 

 

 

TD.formAreaTitle {

 

font-family: Tahoma, Verdana, Arial, sans-serif;

 

font-size: 12px;

 

font-weight: bold;

 

}

 

 

 

SPAN.markProductOutOfStock {

 

font-family: Tahoma, Verdana, Arial, sans-serif;

 

font-size: 12px;

 

color: #c76170;

 

font-weight: bold;

 

}

 

 

 

SPAN.productSpecialPrice {

 

font-family: Verdana, Arial, sans-serif;

 

color: #ff0000;

 

}

 

 

 

SPAN.errorText {

 

font-family: Verdana, Arial, sans-serif;

 

color: #ff0000;

 

}

 

 

 

.moduleRow { }

 

.moduleRowOver { background-color: #D7E9F7; cursor: pointer; cursor: hand; }

 

.moduleRowSelected { background-color: #E9F4FC; }

 

 

 

.checkoutBarFrom, .checkoutBarTo { font-family: Verdana, Arial, sans-serif; font-size: 10px; color: #8c8c8c; }

 

.checkoutBarCurrent { font-family: Verdana, Arial, sans-serif; font-size: 10px; color: #000000; }

 

 

 

/* message box */

 

 

 

.messageBox { font-family: Verdana, Arial, sans-serif; font-size: 10px; }

 

.messageStackError, .messageStackWarning { font-family: Verdana, Arial, sans-serif; font-size: 10px; background-color: #ffb3b5; }

 

.messageStackSuccess { font-family: Verdana, Arial, sans-serif; font-size: 10px; background-color: #99ff00; }

 

 

 

/* input requirement */

 

 

 

.inputRequirement { font-family: Verdana, Arial, sans-serif; font-size: 10px; color: #ff0000; }

 

 

 

.cssButton {

 

background: #f0f0ff;

 

color: #000080;

 

height: 20px;

 

vertical-align: top;

 

font-weight: normal;

 

font-family: Tahoma, Verdana, Arial, sans-serif;

 

font-size: 12px;

 

cursor: pointer;

 

text-align: center;

 

text-decoration: none;

 

border: 1px;

 

border-style: solid;

 

border-color: #000080;

 

border-spacing: 1px;

 

line-height: 22px;

 

}

 

 

 

#thecategories a:hover {

 

background-color: #eeeeee;

 

color: #000000;

 

}

 

 

 

.catwithsubs, .catwithnosubs {

 

padding-right: 5px;

 

}

 

 

 

#thecategories {

 

position: relative;

 

top: -9px;

 

margin-bottom: -16px;

 

width: 140px;

 

}

 

 

 

.activelink {

 

display: block;

 

font-weight: bold;

 

}

 

 

 

#thecategories a {

 

display: block;

 

padding-bottom: 7px;

 

padding-top: 3px;

 

width: 100%;

 

}

 

 

 

/*mozilla fix*/

 

html>body #thecategories a {

 

width: auto;

 

}

 

/*end of mozilla fix*/

 

 

 

#topcat a {

 

padding-left: 5px;

 

}

 

 

 

#secondcat a {

 

padding-left: 20px;

 

}

 

 

 

#thirdcat a {

 

padding-left: 35px;

 

}

 

 

 

#fourthcat a {

 

padding-left: 50px;

 

}

 

 

 

#fifthcat a {

 

padding-left: 65px;

 

}

Link to comment
Share on other sites

I really dont know where to input none of the code where would I put the code at...and what code would I input to have make background image???

Link to comment
Share on other sites

I really dont know where to input none of the code where would I put the code at...and what code would I input to have make background image???

 

it's hard for us to answer that question, since we don't know *exactly* what you need.

 

as far as where to put it - you want to change the body of your web document, so it needs to go into the 'body' class. look in your stylesheet for the following:

 

BODY {
text-align: center;
background: #ffffff;
color: #000000;
margin: 0px;
}

 

it will be added in here, between the braces ( { and } ).

 

now for what to add, go to the web site that fene suggested. that describes how to specify a background-image value. you'll need to specify in the url() portion of the definition the file name to the image you want. then, you may also need some of the background-repeat descriptors, etc. play with the settings until you have what you want.

 

you may feel somewhat frustrated in not being given a 'straight answer' to your question, but part of what we try do here is help you learn how to help yourself. if someone gives you exactly what you want, you will not learn the process of how to solve these problems yourself. if we guide you to your own answer, you'll be able to help yourself in the future - as well as others in the forums.

 

i hope this helps.

Link to comment
Share on other sites

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...