Фоновое изображение наложения градиента не работает в WordPress

Я написал ниже html-код, чтобы сделать фоновое изображение с наложением градиента. Это работает отлично, как автономный, но когда я использовал в Wordpress сообщение, он не работает. Я вижу только пустое место.Фоновое изображение наложения градиента не работает в WordPress

Хостинг: Godaddy Managed WordPress Браузер: Google Chrome Я даже пробовал в Visual Composer -> Raw HTML. Ссылки:http://padals.com/t2/

<html> 
<head><style> 
.bg-img { 
    width: 100%; 
    height: 100%; 
    background: #3e3e3e; 
    bottom: 0; 
    box-shadow: rgba(0,0,0,.07) 0 2px 0; 
    left: -34px; 
    overflow: hidden; 
    position: absolute; 
    right: -34px; 
    top: -100px; 
    -webkit-transform: translate3d(0,0,0); 
    -moz-transform: translate3d(0,0,0); 
    -ms-transform: translate3d(0,0,0); 
    transform: translate3d(0,0,0); 
    z-index: -1; 
    } 
    .bg-img:after { 
     background: rgba(0,0,0,.43); 
    background: -webkit-linear-gradient(top,rgba(0,0,0,.57) 0,rgba(0,0,0,.21) 100%); 
    background: -moz-linear-gradient(top,rgba(0,0,0,.57) 0,rgba(0,0,0,.21) 100%); 
    background: -ms-linear-gradient(top,rgba(0,0,0,.57) 0,rgba(0,0,0,.21) 100%); 
    background: linear-gradient(to bottom,rgba(0,0,0,.57) 0,rgba(0,0,0,.21) 100%); 
    box-shadow: inset rgba(0,0,0,.26) 0 3px 0,inset rgba(0,0,0,.21) 2px 0 0,inset rgba(0,0,0,.26) 0 -1px 0; 
    bottom: 0; 
    content: ''; 
    left: 0; 
    position: absolute; 
    right: 0; 
    top: 0; 
    z-index: 20; 
    } 
.bg-img img { 
    filter: blur(42px); 
    -webkit-filter: blur(42px); 
    -moz-filter: blur(42px); 
    -ms-filter: blur(42px); 
    filter: url(http://static.saavncdn.com/_i/3.0/blur.svg#blur); 
    left: 50%; 
    margin: -56% 0 0 -56%; 
    position: absolute; 
    top: 50%; 
    width: 112%; 
    z-index: 10; 
} 
img { 
    border: 0; 
    display: block; 
    margin: 0; 
} 
</style></head> 
<body> 

<div class="bg-img"><img src="http://padals.com/wp-content/uploads/2016/05/Baahubali_poster.jpg" alt="" /></div> 

</body> 
</html>

источник

2016-05-15 JAMUNARANI S

так что вы видите пустоту вместо изображения или получаете изображение, но градиент не работает? –

@Dhaval - только пустое пространство даже не изображение, вы можете увидеть его в вышеупомянутой ссылке. –

попробовать н использовать этот код и посмотреть, если вы получаете изображение первым, а затем вы можете беспокоиться о градиентной работе или нет ..

<img src="<?php echo content_url('/uploads/2016/05/my_photo.jpg'); ?>" alt="My Picture">

источник

2016-05-15 12:00:59

FYI-php-код не будет работать на странице WordPress, и если я удалю таблицу стилей (CSS), тогда я смогу увидеть изображение. –

PHP-коды будут работать на странице Wordpress, чтобы получить правильное изображение из папки uploads, и теперь, когда вы сказали, что проблема в свойствах стилей и градиентов используется, и нам придется диагностировать это и посмотреть, что может быть проблемой здесь –

style.css : 446-449:

.td-main-content-wrap, 
.td-category-grid { 
    background-color: #fff; 
}

стиль .css: 13850-13852:

.post { 
    background-color: #fff; 
}

Удалить background-color: #fff; определение из .td-main-content-wrap и от .post.

У вас есть отрицательное z-index на качестве absolute элемента и что положить вот оно за .post и td-main-content-wrap.

источник

2016-05-15 12:18:32 aifrim

Фоновое изображение наложения градиента не работает в WordPress

ответ

Смежные вопросы