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

(0)
小编小编
上一篇 2020年4月20日 下午11:47
下一篇 2020年6月15日 上午12:53

相关文章

  • 云服务器_虚拟主机域名解析具体怎么操作?

      云服务器是云计算服务的重要组成部分。它可以为互联网用户提供全方位的服务。同时,它还集成了Internet的三大元素,即存储、计算和网络。它已成为高端用户和中小企业的首选产品。 一些曾经使用过云服务器的网站管理员知道,云服务器解析完域名后,网站就可以正式上线, 那么云服务器如何解析域名呢?步骤是什么?现在酷番云给你一个详细的分析。 1丶云服务器解…

    网站教程 2018年12月24日
  • 10元虚拟主机哪里有 10元主机空间哪里好?

    在这里呢有些小伙伴估计不知道? 什么是虚拟主机 下面就给大家简单的讲讲 云虚拟主机也可以被称为虚拟服务器或虚拟私有服务器。是通过互联网上的云计算平台构建,托管和交付的逻辑服务器。一般用于web运营的比较多。如放置企业网站丶搭建电商平台丶数据存储、共享。 酷番云虚拟主机,架设于纯SSD架构的高性能云服务器之上,具有高在线率、高安全性、高稳定性等多项优势。基于自…

    虚拟主机 2019年1月18日
  • 使用CentOS 7系统如何安装Rstudio-server

    很多小伙伴再使用CentOS 7系统不知道如何配置,今天介绍一下CentOS 7系统如何安装Rstudio-server: 安装R Ubuntu系统中安装R比较麻烦相反在RHEL 7中安装要容易很多,并且Ubuntu安装r-base并不是最新版本的,但在RHEL 7中,只需添加epel的源并通过yum即可安装最新版的。 yum install -y epel…

    2021年11月15日
  • 百度云CDN加速出现522怎么处理?

      百度云加速是专注于为各类网站提供访问加速、安全防护以及流量优化的建站工具,为网站提供包括网站安全检测、免费CDN加速、CC攻击防护、sql注入及xss攻击防护、网站提交等方便越来越方便,更多的站长选择了百度云CDN加速,在使用中不免出现各种各样的问题,今天就给大家讲讲百度云CDN加速出现522是什么情况,或者怎么处理?   如图所示,…

    2020年2月24日
  • Ubuntu怎样才能开启SSH?

    很多小伙伴提出ubuntu18.04默认安装不带ssh,需要安装,安装后怎样才能开启SSH?今天就为大家解答一下: ubuntu18.04默认安装不带ssh,需要安装,安装如下: apt-get install openssh-serve 开启ssh systemctl start sshd systemctl enable sshd 查看 lsof -i:…

    2022年4月8日
  • 安装宝塔面板无法访问此网站怎么解决?

    今天有个小伙伴在搭建酷番云面板(宝塔面板)的时候安装好以后出现“无法访问此网站”拒绝了我们的连接,遇到这种问题我们应该怎么处理呢? 下面就来讲大家方法。 类似于图中显示,其实很简单。 按照以下方法排查即可。 ①:服务器环境是否配置无错; ②:服务器安全组(端口)是否开通;最重要!!! ③:以上两种方法都没有问题,就看下内部防火墙是否开通,不过这个…

    2020年4月5日