将标题(正确的位置)放在背景不透明的图像上方

我想在frontpage上的图像上方显示具有不透明背景的标题。php。我可以用边距：-#在顶部显示标题，并可以添加带有z索引和rgb不透明度的透明背景，但我有点困惑于如何获得不同长度（高度）的标题，以便所有标题都整齐地占据图像的底部。因为我只是用边距减号把标题往上拉，它们有时在图片的中间，有时太长，等等。

有人对此有办法吗？我希望标题在图片的底部，但在图片的顶部。

目前我的css是：

div.first-post {
    margin:10px; 
    float:left; 
    width:41%; 
    height:auto; 
    background-color:blue;
}
div.headline-container {
    margin-top:-50%; 
    background:transparent; 
    position:relative; z-index:2;
    /* Fallback for web browsers that don\'t support RGBa */
    background-color: rgb(0, 0, 0);
    /* RGBa with 0.6 opacity */
    background-color: rgba(0, 0, 0, 0.6);
    /* For IE 5.5 - 7*/     
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000, endColorstr=#99000000);
    /* For IE 8*/
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000, endColorstr=#99000000)";
}

适用于：

 <div class="first-post">
     <div class="first-container">
         <a href="<?php the_permalink() ?>" >
         <?php if ( has_post_thumbnail()) : the_post_thumbnail(\'columner-thumb\'); endif; ?>
             <div class="headline-container">
                <?php the_title(); ?>
             </div>
         </a>
     </div>
 </div>

在带有PHP的子主题中包含style.css

在里面https://codex.wordpress.org/Child_Themes 这是包含样式的最佳实践。css在子主题中，必须将下面的代码放入函数中。php的子主题，但将“父样式”替换为可以在函数中找到的父主题的参数。父主题的php。我在我的主题文件中找不到它，那里也没有多少代码。使用@import包含父主题样式表的方法不适用于我，放入文件的css不会在任何浏览器的站点上显示自己。function my_theme_enqueue_styles() { $parent_s

相关推荐

在带有PHP的子主题中包含style.css