-3

I have this CSS for FULL Background image. Now i want to pass PHP variable to this URL to change the background image dynamically. Plz let me know . my codes are..

.imgback {
padding-top:140px;
height:100vh;
min-height:400px;
background-size:cover;
background-image:url("../img/picmax/6.jpg");
}

<section class="imgback"> 
<div class="container"> 
<h1 class="text-center">Traveller's Zone.</h1>
</div>
</section>
0

3 Answers 3

0

You can use Inline or internal css as follow:

Internal

<style>
  div { background-image: url(<?php echo $imageURL;?>); }
</style>

Inline

<div style="background-image:url(<?php echo $imageUrl?>) no-repeat center center fixed">
</div>

Reference from Change css background-image with php

Sign up to request clarification or add additional context in comments.

Comments

0

you can use php variable in your style code but must need to write css code after php variable . something like this

<?php
$bg_image = '../img/picmax/6.jpg'; // this is static value for test
?>
<section class="imgback">
    <div class="container">
        <h1 class="text-center">Traveller's Zone.</h1>
    </div>
</section>

and add style after define php value then you can use this code

<style>
        .imgback {
            padding-top: 140px;
            height: 100vh;
            min-height: 400px;
            background-size: cover;
            background-image: url("<?=$bg_image?>");
        }
    </style>

of you can use this php value in your html code

<?php
$bg_image = '../img/picmax/6.jpg';
?>
<section class="imgback" style="background-image: url('<?php echo $bg_image ?>')">
    <div class="container">
        <h1 class="text-center">Traveller's Zone.</h1>
    </div>
</section>

hope it will help you.

Comments

0

You can simply load a data from database and place it inside everywhere you like.

`<?php
$a = "6.jpg";
?>`

then insert it into your css

.imgback {
padding-top:140px;
height:100vh;
min-height:400px;
background-size:cover;
background-image:url("../img/picmax/");
}

<section class="imgback"> 
<div class="container"> 
<h1 class="text-center">Traveller's Zone.</h1>
</div>
</section>

But that won't be good enough because php only runs once on every refresh or load. (you can use jQuery) or you better use JavaScript for these type of works as because they are triggered by events so you can change images without refreshing the page

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.