wordpress文章中表格增加CSS样式效果

今天遇到一个小伙伴,买到的主题呢发布的表格模式,没有样式,来找到了我,为此我弄了下给大家看看方案;

wordpress增加表格CSS样式效果应该怎么弄比较好,

一、增加表格样式

如果在wordrpess中没有表格样式,就需要自己增加一个样式到 style.css 当中了:(以下内容增加到主题的样式文件: style.css )

.table{width:100%;border-top:1px solid #d8d8d8;border-left:1px solid #d8d8d8;margin-bottom:20px}
.table th{text-align:center;background-color:#f6f5f2;font-weight:normal}
.table td,.table th{text-align:center;padding:10px 15px;font-size:14px;border-right:1px solid #d8d8d8;border-bottom:1px solid #d8d8d8}

要使以上样式生效,需要在 <table> 标签中增加 class="table":

<table class="table">

实际效果:

方法 属性 方法
实例方法 调用 实例属性 $this->pu_shuxing
实例方法 调用 静态属性 self::$jing_shuxing;
静态方法 调用 实例属性 $this->pu_shuxing; 错误!
静态方法 调用 静态属性 self::$jing_shuxing;

后台样式:

wordpress文章中表格增加CSS样式效果

 

效果截图:

wordpress文章中表格增加CSS样式效果

二、自动生成 class=”table”

当然,如果是和我一样懒到一定境界,不愿意进入wordpress后台修改的话,可以增加以下代码至 functions.php ,自动将所有 <table> 变成 <table class=”table”>:(以下内容增加到主题的样式文件: functions.php )

// 所有 <table> 变成 <table class="table">
function wp_replace_text($text_wp){
$replace = array(
// '原始文字' => '替换为这些'
'<table>' => '<table class="table">',
);
$text_wp = str_replace(array_keys($replace), $replace, $text_wp);
return $text_wp;
}
add_filter('the_content', 'wp_replace_text'); //正文

以上就是”怎么给wordpress增加表格CSS样式效果教程“的介绍。

如需购买虚拟主机,推荐酷番云,共享虚拟主机、独享虚拟主机齐备,各类配置均有,最低只需要9/月,满足不同网站建设需求,低成本建站;价格实惠;同时提供快速0元备案,让你快速运营。

购买地址:

https://www.kufanyun.com/host/buy.html

图片来源于AI模型,如侵权请联系管理员。作者:酷小编,如若转载,请注明出处:https://www.kufanyun.com/ask/708.html

(0)
上一篇 2020年4月20日 23:47
下一篇 2020年6月15日 00:53

相关推荐

  • 安全大数据监管台账如何实现高效管理与风险预警?

    安全大数据监管台账的内涵与价值安全大数据监管台账,是指依托大数据技术,对安全生产领域的各类数据信息进行系统性采集、整合、分析与应用的动态管理工具,它突破了传统台账“记录分散、更新滞后、分析粗放”的局限,通过数字化手段实现安全数据的全生命周期管理,成为提升监管效能、防范化解重大风险的核心载体,其核心价值体现在三个……

    2025年11月25日
    04130
  • h3c配置镜像端口,h3c交换机端口镜像配置教程

    H3C配置镜像端口:实现网络流量深度监控与故障排查的核心方案在构建高可用、高安全性的企业级网络架构中,镜像端口(Mirror Port)技术是网络运维人员不可或缺的核心工具,它通过将指定源端口的流量完整复制并转发至监控端口,使得安全设备、流量分析系统或抓包工具能够“旁路”监听网络数据,而无需中断业务连接,核心结……

    2026年6月10日
    01304
  • react webpack配置如何优化项目性能与加载速度?30字疑问长尾标题,React项目Webpack配置技巧探讨与性能提升策略?

    React Webpack配置详解简介Webpack是一个现代JavaScript应用的静态模块打包器,在React项目中,Webpack用于将JavaScript代码、样式表、图片等资源打包成一个或多个bundle文件,合理的Webpack配置能够提高项目的构建速度和运行效率,本文将详细介绍React项目的W……

    2025年12月2日
    02510
    • 服务器间歇性无响应是什么原因?如何排查解决?

      根源分析、排查逻辑与解决方案服务器间歇性无响应是IT运维中常见的复杂问题,指服务器在特定场景下(如高并发时段、特定操作触发时)出现短暂无响应、延迟或服务中断,而非持续性的宕机,这类问题对业务连续性、用户体验和系统稳定性构成直接威胁,需结合多维度因素深入排查与解决,常见原因分析:从硬件到软件的多维溯源服务器间歇性……

      2026年1月10日
      020
  • 爱心众筹系统源码怎么开发?爱心众筹系统源码开发公司哪家好

    构建安全、高效、可信赖的公益数字化平台在公益数字化转型加速的背景下,爱心众筹系统源码开发已从“技术实现”升级为“信任基础设施建设”,一个成熟的系统不仅需满足基础筹款功能,更需在资金透明、合规风控、用户运营和可持续性方面具备专业能力,本文基于酷番云服务300+公益机构的实战经验,系统梳理源码开发的核心逻辑与落地策……

    2026年4月17日
    01714

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注