CSS Background Images in WordPress

Question

Is it possible to get the background image in CSS, as usual, in HTML when working with WordPress. I tried to do this, but it did not work.

background-image: url("<?php bloginfo('template_directory'); ?>/images/parallax_image.jpg ");

Answer 1

PHP code cannot work in a .cssfile, however you can use the inline style, for example:

<div style="background-image: url("<?php //url ?>");">

or

<style>
  .class-name {
    background-image: url("<?php //url ?>");
  }
</style>

The above would be useful when working with custom fields for dynamic image paths.

, PHP , , /theme-name/images, /theme-name/style.css, css :

.class-name {
  background-image: url("images/file.jpg")
}

Answer 2

PHP , CSS , :

background-image: url("images/parallax_image.jpg");

.

Answer 3

, :

background-image: url("/wp-content/themes/themeNameHere/images/parallax_image.jpg ");

Answer 4

css.

<div style="background-image: url("<?php bloginfo('template_directory'); ?>/images/parallax_image.jpg ");">
Your other html here
</div>

Answer 5

css , . .class { : URL ( "/ .. /" ); // , background-image: url ( "../../images-directory-02/images/file-name" ); // , }

Answer 6

, Underscores, , :

background: url('assets/img/tile.jpg') top left repeat;

:

background: url('/wp-content/themes/underscores/assets/img/tile.jpg');

.

Answer 7

: PHP CSS. , <rel> /images/parralax_iamge.jpg.

Answer 8

(, ) / CSS , , "customCSS" .

Answer 9

CSS PHP, bloginfo(). index.php, ...

<style>
  .some-element { 
    background-image: url("<?php bloginfo('template_directory'); ?>/images/parallax_image.jpg ");
  }
</style>

Answer 10

php- .css . , php, . this.

Answer 11

php .css ext, .

php - , , , .php

customestyles.php

<?php
    header("Content-type: text/css; charset: UTF-8");
   $sectionImage = bloginfo('template_directory')."/images/parallax_image.jpg";

?>
<style type="text/css">

    .selector{

        background-image: url(<?php echo "$sectionImage";?>);
    }
</style>

Answer 12

, CSS- background-image .

URL-, , .

, , "".

, "":

URL , :

2. ""
3. ,
4. URL URL, (, domain-name.com)
5. URL background-image

URL ( , ), - , URL .

, URL : https://example.com/wp-content/uploads/2018/06/<Name of the Image>.jpeg, /wp-content/uploads/2018/06/<Name of the Image>.jpeg .

, CSS :

background-image: url("/wp-content/uploads/2018/06/<Name of the Image>.jpeg");

, URL /wp-content/... wp-content/...

Answer 13

div , div

<div style="background-image: url('<?= get_the_post_thumbnail_url();?>');">

The reason it doesn't work in the first divis because the parser thinks that the first block of text ends where the second happens ".