hOW TO change background to a image
- vitinho444
- Posts: 2819
- Joined: Mon Mar 21, 2011 4:54 pm
hOW TO change background to a image
Hey guys, i want to make my game more pretty, how can i add a image to the background of all pages?
- rockinliam
- Posts: 466
- Joined: Sun Jun 07, 2009 11:26 am
Re: hOW TO change background to a image
Code: Select all
body{
background-image:url('image.jpg');
}
Skillset: C/C++, OpenGL, C#, Lua, PHP, MySql, Web Dev etc.
Website: https://liam-griffiths.co.uk/
Website: https://liam-griffiths.co.uk/
- vitinho444
- Posts: 2819
- Joined: Mon Mar 21, 2011 4:54 pm
Re: hOW TO change background to a image
i put that where?
- PaxBritannia
- Posts: 680
- Joined: Sun Apr 18, 2010 1:54 pm
Re: hOW TO change background to a image
Just in case you haven't realised, the snippet of code Vitinho444 gave you is CSS, so you'll probably want to put in in a CSS file.
Since you want it to appear in every page, I suggest linking to the CSS file from your connect.php, assuming you include connect.php in every page.
That should clear things up a bit. If you want me to clarify more, just ask.
pax.
Since you want it to appear in every page, I suggest linking to the CSS file from your connect.php, assuming you include connect.php in every page.
That should clear things up a bit. If you want me to clarify more, just ask.

pax.
- vitinho444
- Posts: 2819
- Joined: Mon Mar 21, 2011 4:54 pm
Re: hOW TO change background to a image
well, so i just need to add that to style.css?
then i need to make a include(style.css)?
If i make a background.css
then in there post that code.
How can i connect the css to Connect.php to open in every pages?
then i need to make a include(style.css)?
If i make a background.css
then in there post that code.
How can i connect the css to Connect.php to open in every pages?
-
- Posts: 261
- Joined: Wed Apr 28, 2010 8:35 am
Re: hOW TO change background to a image
Add the following into the head of your index file:
And inside your stylesheet file (style.css) add:
Code: Select all
<link href="style.css" rel="stylesheet" type="text/css">
Code: Select all
body{
background-image:url('image.jpg');
}
-
- Posts: 261
- Joined: Wed Apr 28, 2010 8:35 am
Re: hOW TO change background to a image
Short addendum to my last response:
You can also expand the background image properties to define the location on the page, for example:
background-position can be defined by either X,Y coordinates (eg. background-position: 45px -12px;) or by position indicators (eg. background-position: center top; <-- this obviously positions the image at the center of the page, at the very top.)
background-repeat simply indicates whether or not you want the background to repeat (eg. a tile background effect).
Hope this helps.
You can also expand the background image properties to define the location on the page, for example:
Code: Select all
body{
background-image:url('image.jpg'); background-position: center top; background-repeat: no-repeat;
}
background-repeat simply indicates whether or not you want the background to repeat (eg. a tile background effect).
Hope this helps.

- vitinho444
- Posts: 2819
- Joined: Mon Mar 21, 2011 4:54 pm
Re: hOW TO change background to a image

my style.css:
Code: Select all
body{background-image:url('background.png');
}
#login {
position:absolute;
left:0px;
top:0px;
width:800px;
height:150px;
z-index:1;
background-color: #7F5000;
}
#login2 {
position:absolute;
left:0px;
top:200px;
width:800px;
height:150px;
z-index:1;
}
#player {
position:absolute;
left:400px;
top:200px;
width:450px;
height:450px;
z-index:3;
}
#creature {
position:absolute;
left:400px;
top:400px;
width:450px;
height:650px;
z-index:3;
}
#logout {
position:absolute;
left:10px;
top:10px;
width:150px;
height:150px;
z-index:3;
}
#locations {
position:absolute;
left:400px;
top:100px;
width:450px;
height:450px;
z-index:3;
}
#gold {
position:absolute;
left:200px;
top:200px;
width:150px;
height:100px;
z-index:3;
}
#lpanel {
position:absolute;
left:10px;
top:100px;
width:100px;
height:200px;
z-index:3;
}
#hpointsback {
position:absolute;
left:10px;
top:204px;
width:100px;
height:15px;
z-index:1;
}
#hpoints {
position:absolute;
left:10px;
top:204px;
width:100px;
height:15px;
z-index:2;
text-align:left;
}
#spointsback {
position:absolute;
left:10px;
top:225px;
width:100px;
height:15px;
z-index:1;
}
#spoints {
position:absolute;
left:10px;
top:225px;
width:100px;
height:15px;
z-index:2;
text-align:left;
}
#table {
position:absolute;
left:200px;
top:105px;
width:500px;
height:900px;
z-index:2;
}
#magic {
position:absolute;
left:400px;
top:100px;
width:450px;
height:450px;
z-index:3;
}
Code: Select all
<link href="style.css" rel="stylesheet" type="text/css">
<style type="text/css"><?php include ("style.php") ?></style><center><title>
The Legend of Kanisys
</title>
<?php
include_once 'connect.php';
session_start();
$bypass = 0;
include_once 'logo.php';
?>
<link href="style.css" rel="stylesheet" type="text/css" />
<div id="login2" div align="center">
<?php
if (isset($_SESSION['player']))
{
$player=$_SESSION['player'];
}
else
{ echo "<h3>Welcome to The Legend of Kanisys</h3>";
echo "<br><a href='login.php?bg=7F5000'><img src='images/login.gif'></a><br>";
echo "<br><a href='register.php?bg=7F5000'><img src='images/register.gif'></a><br>";
//echo "<br><a href='lostpassword.php'><img src='images/lost.gif'></a><br>"; echo "<br><a href='story.php?bg=7F5000'><img src='images/story.gif'></a><br>";
echo "<br><br><br><h2>Please Support our Website:</h2>";
echo "<br><a href='http://2dfe5686.linkbucks.com'><h2>Support our Website for Free</a><br></h2>";
echo "<br><a href='http://www.linkbucks.com/referral/226894'><img src='http://www.linkbucks.com/tmpl/mint/img/468_60link_bucks.gif'></a><br>";
echo "<br><a href='http://adf.ly/15AfB'><img src='http://adf.ly/images/banners/adfly.728x90.1.gif'></a>";
exit;
}
?>
</div>
<?php
$playerinfo="SELECT * from players where name='$player'";
$playerinfo2=mysql_query($playerinfo) or die("could not get player stats!");
$playerinfo3=mysql_fetch_array($playerinfo2);
include_once 'statpanel.php';
?>
<div id ="locations">
<?php
$bypass;
$playerhp = $playerinfo3['hpoints'];
if ($playerhp < 1)
{
echo "You are dead!" ;
echo "<br><a href='inn.php>Visit Doctor";
exit;
}
if(isset($_GET['map']))
{
$bypass=1;
echo "<a href='index.php?mapchange=1&mapname=Kirmania'><img src='images/Kirmania.gif'></a><br><br>";
echo "<a href='index.php?mapchange=1&mapname=Zarton'><img src='images/Zarton.gif'></a><br><br>";
echo "<a href='index.php?mapchange=1&mapname=Brigan'><img src='images/Brigan.gif'></a><br><br>";
echo "<a href='index.php?mapchange=1&mapname=NewState'><img src='images/NewState.gif'></a><br><br>";
echo "<br><a href='index.php'>Never Mind</a><br>";
}
if(isset($_GET['mapchange']))
{
$bypass = 1;
$mapname = $_GET['mapname'];
$updateplayer="update players set location='$mapname' where name='$playerinfo3[name]'";
mysql_query($updateplayer) or die("Could not update player");
echo "You have traveled to " . $mapname . ".<br>";
echo "<a href='index.php'>To location</a><br>";
}
if($bypass != 1)
{
echo "You are in ";
echo "<b><big><u>" . $playerinfo3['location'] . "</u></big></b><br>";echo "<br><br><a href='equipment.php'><img src='images/bag.gif'></a><br>";
echo "<br><a href='store.php'><img src='images/store.gif'></a><br>";
echo "<br><a href='weaponshop.php'><img src='images/weaponshop.gif'></a><br>";
echo "<br><a href='armorshop.php'><img src='images/armorshop.gif'></a><br>";
echo "<br><a href='inn.php'><img src='images/doctor.gif'></a><br>";
echo "<br><a href='spelltrainer.php'><img src='images/spelltrainer.gif'></a><br>";
echo "<br><a href='battle.php'><img src='images/battlemonster.gif'></a><br>";
//LOAN
// echo "<a href='loan.php'>Loan Money</a><br>";
///////LOAN
//WORKING:
// echo "<a href='work.php'>Work at Farm</a><br>";
//WORKING:
echo "<br><a href='index.php?map=1'><img src='images/travel.gif'></a><br>";
echo "<br><br><br><a href='rank.php'><img src='images/rank.gif'></a><br>";$admin = $playerinfo3['admin'];if ($admin == 1){echo "<br><br><br><a href='admin.php'><img src='images/admin.gif'></a><br>";}
}
?>
</div>
<div id="logout">
<?php
echo "<br><a href='logout.php?bg=7F5000'><img src='images/logout.gif'></a>";
?>
</div>
</center>
-
- Posts: 261
- Joined: Wed Apr 28, 2010 8:35 am
Re: hOW TO change background to a image
What's style.php?<style type="text/css"><?php include ("style.php") ?></style><center><title>
You should include a semi-colon at the end of your include, btw. i.e:
Code: Select all
<?php include ("style.php"); ?>
- vitinho444
- Posts: 2819
- Joined: Mon Mar 21, 2011 4:54 pm
Re: hOW TO change background to a image
style.php is a file that i created to all pages of the game has a background color by adding ?bg=COLORCODE to the page.
i put the semi colon there but is the same...
i put the semi colon there but is the same...