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

相关推荐

  • tomcat 配置 log4j 怎么配置?tomcat 配置 log4j 详细步骤

    Tomcat 配置 Log4j 核心结论与最佳实践在 Java Web 应用架构中,Tomcat 作为核心容器,其日志系统的稳定性直接决定了故障排查的效率与生产环境的可观测性,配置 Log4j 并非简单的文件替换,而是一场涉及类加载机制、日志级别控制、异步写入性能以及安全漏洞防御的系统工程,核心结论在于:必须将……

    2026年5月1日
    0404
  • 分布式边缘云运维如何高效管理多节点资源?

    分布式边缘云运维的核心架构分布式边缘云运维的基础在于构建层次化、模块化的技术架构,其核心可分为三层:边缘节点层、管控编排层和统一运维层,边缘节点层是基础设施的“神经末梢”,部署在靠近用户的物理位置,包含服务器、存储、网络设备及边缘计算单元,负责实时数据处理和本地化服务响应,为保障节点稳定性,需通过硬件冗余设计……

    2025年12月14日
    01540
  • 三星S6 Edge配置全面解析,是否仍值得选购?30字长尾疑问标题

    三星S6 Edge 配置详解外观设计三星S6 Edge以其独特的曲面屏设计在市场上独树一帜,这款手机的正面和侧面均采用了曲面屏幕,使得用户在观看视频或玩游戏时拥有更加沉浸的体验,以下是三星S6 Edge的外观设计详细配置:尺寸:144.8 x 71.4 x 7.0 mm重量:132克颜色:白、黑、金、蓝、粉材质……

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

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

      2026年1月10日
      020
  • 企业搭建分布式数据处理系统的详细步骤和核心技术要点有哪些?

    分布式数据处理系统的搭建是一个涉及架构设计、技术选型、环境配置和运维优化的系统性工程,其核心目标是高效处理海量数据,确保系统的高可用性、可扩展性和容错能力,以下从需求分析到部署运维,分步骤阐述分布式数据处理的搭建流程,需求分析与架构设计搭建前需明确业务场景与核心需求:是离线批处理(如日志分析)、实时流处理(如实……

    2025年12月30日
    01950

发表回复

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