小沨的天空

  • 首页
  • Code
  • Dns
  • 图床
  • 店铺
私人小天地
谈天说地,学习笔记
  1. 首页
  2. 教程学习
  3. 正文

在 WordPress 中如何实现在图片上添加文字(转)

2019年03月02日 1905点热度 0人点赞 0条评论

转蒋老师文章在 WordPress 中实现图片上加文字。这样的话,可以避免每次都要用工具处理图片再上传,也能减少空间的压力,加快浏览速度。本文介绍的就是在图片上添加文字的办法。

  先看演示效果:

<div style="background-image: url('https://images.havetosay.com/5G-stn-2019.jpg'); background-repeat: no-repeat; height: 100%; width: 100%; margin-top: 20px;">
<h1 style="color: white; width: 90%; padding: 50px 0px 50px 50px;">据人民网山东频道报道称:</h1>
<p style="color: yellow; width: 90%; padding: 50px 0px 50px 50px; font-size: 150%;">
1 月 31 日下午,中国电信在深圳圆满完成央视春晚特别节目现场连线直播。
这是走过 36 年的央视春晚,第一次实现 VR 超高清视频内容的 5G 传输,也是央视第一次用 5G 网络进行 VR 春晚节目直播。
</p>
<p style="color: white; width: 90%; padding: 50px 0px 50px 50px; text-align: center; font-size: 150%;">
根据实测结果,端到端时延小于 50 毫秒,远远优于测试指标要求。
</p>
</div>

代码使用说明:
  1. 先上传一张背景图片,然后把图片的地址粘贴在上面的代码中,替代示例中的图片链接。
  2. h1 的代码,是第一部分文字,文字居左,我直接用 WordPress 的标题来处理。你也可以依样画葫芦,输入您的标题。如果没有文字,可以删除这一行的文字,将其设置为空行。
  3. 第一个 p 段:是第二部分的文字,文字居左,我把它处理为段落字段。文字设置为:黄色(yellow)。你可以根据背景图将其修改为其他颜色。里面的 padding 代码,是指文字的上下左右的间距。这里我设置为:上:50px,右:0px,下:50px,左:50px。php 代码对位置的设置的规则是:上-右-下-左,每个设置空一格。字体大小我设置为原来字体的 150%,即:比原来字体大一半。
  4. 第二个 p 段:是第三部分的文字,文字居中,我把它处理为段落字段。文字居中的代码是:text-align,设置为 center。也就是居中。如果你要让它居右,可以把 center 改为 right。当然,如果要居左,就改为 left。也可以不写,就算你把整个 text-align 删除也可以。不写的话是不会设置的,这里会依照原来的设定:居左。文字设置为:白色(white)。你也可以随意修改你喜欢的颜色。
  5. 代码里的 width,是指宽度,你也可以根据需要调整。
  6. 如果还需要添加段落,可以依样画葫芦,复制整段 p 段代码(p 是字段的开始。/p 是字段的结束)即可,然后填上你要的文字或者字段。

标签: wordpress 图片 文字
最后更新:2019年04月24日

小沨

一个网络白痴,爱好网络生活和技术。 梦想成为一个网络糕手.喜欢简单的一个80后男人! Life is better when shared !

打赏 点赞
< 上一篇
下一篇 >

文章评论

您需要 登录 之后才可以评论

小沨

一个网络白痴,爱好网络生活和技术。 梦想成为一个网络糕手.喜欢简单的一个80后男人! Life is better when shared !

小程序
广告
最新 热点 随机
最新 热点 随机
Server酱和Qmsg酱两个好用的推送服务 linux的ssh服务升级后无法启动修复 linux服务器的硬盘使用时间查询 启用chrome浏览器内置的二维码生成插件 宝塔面板或者LNMP下安装php的mongodb扩展 ShareX 对接tu.my图床实现截图和图片自动上传 帝国CMS的sitemap.xml设置和生成 hetzner服务器购买和安装debian系统 使用nginx的stream模块实现端口转发和TCP流量 服务器装Proxmox VE/多IP设置和单IP设置Nat转发
linux的ssh服务升级后无法启动修复Server酱和Qmsg酱两个好用的推送服务
Vista,win7下的ipv6设置 linux架设gre tunnel/隧道 linux系统挂载数据盘到VPS自定义目录 各大银行可免年费的白金卡 免费的FTP服务器资源下载 nginx目录浏览配置第三方插件fancyindex 全球200多个域名后缀的域名扫描工具 百度网盘,免费获取100G容量活动. DirectAdmin下安装eaccelerator0.9.6.1 升级到Win10 Build 14316 中启用 Linux Bash 环境体验
标签聚合
升级 centos linux 系统 wordpress DirectAdmin ubuntu 免费 网盘 php 服务器 vps
开源相关
  • do mirrors
  • 阿里开源镜像站
  • centos vault
  • linode mirrors
  • fedoraproject
  • Debian Mirror
  • CentOS mirrors
  • Ubuntu Mirrors
  • RepoForge
  • elrepo.org
  • Packages Search
  • owncloud
友情链接
  • LiCEO
  • 2.int.ru
  • 我喔喔喔
  • 麦麦同学
  • vzone
  • 我的图库
  • 午夜客
  • 娃娃博客
  • 夜狐
  • 傻子-跸西的blog
  • QQPCC
  • 陈否否
  • 寥寥后花园
  • 撸羊毛
  • semnew
  • 豆博
  • 死老鬼
  • 朱志瑞
  • 天下无鱼
  • 李子博客
  • 回到未来博客
  • 轨迹博客
  • 爱购啦
  • 怪鸟博客

COPYRIGHT © 2020 小沨的天空. ALL RIGHTS RESERVED. @ 网站运行: @ 服务器运行状态

THEME KRATOS MADE BY VTROIS