简体   繁体   English

Wordpress模板文件中的中心文本全屏图片(php)

[英]Full Screen Picture with Centered Text in a Wordpress Template File (php)

This is my current page: http://www.texaspaceauthority.org/travis-county/ 这是我目前的页面: http//www.texaspaceauthority.org/travis-county/

I would like the title at the top ("Travis County") to be white text centered on a full width photo, such as that found at: http://www.pelotonu.org/ 我希望顶部的标题(“特拉维斯县”)是以全宽照片为中心的白色文字,例如: http//www.pelotonu.org/

I am editing from a template file, relevant code: 我正在编辑模板文件,相关代码:

<div class="state-page-content container" id="state-page-container">
    <div class="row">
        <div class="row">
            <!--// PAGE TITLE --> 
            <h1><? the_title()?></h1>

Is this possible to accomplish directly in the php? 这有可能直接在PHP中完成吗? Or is there a better method? 还是有更好的方法? I run a nonprofit pretty budget constrained, and so I have to do most of my coding myself. 我经营一个非营利性的预算限制,所以我必须自己做大部分编码。

In Sum, the questions: -How do I add a full width photo? 总而言之,问题是: - 如何添加全宽照片? -How do I then paste text over it? - 然后如何在其上粘贴文字?

Thanks for any help! 谢谢你的帮助!

I'm not sure to have understood your question but you can do something like: 我不确定是否理解了你的问题,但你可以这样做:

<div class="state-page-content container" id="state-page-container">
    <div class="row">
        <div class="row">
            <!--// PAGE TITLE --> 
            <h1 style="text-align:center;"><? echo get_the_title()?></h1>

The change should be made in your CSS file not the php. 应该在你的CSS文件而不是php中进行更改。 Im on mobile so i cant inspect it but its generally a simple text align / position change. 我在移动设备上,所以我无法检查它,但它通常是一个简单的文本对齐/位置更改。 You can do a relative position based on Your image container and use a "vw" text size to make it responsive 您可以根据您的图像容器执行相对位置,并使用“vw”文本大小使其具有响应性

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM