我在 Wordpress 3.9.2 的自定义皮肤上向 style.css 文件添加了自定义 CSS。除了我添加的新类(class)外,所有类(class)似乎都运行良好。
.frontpage_tile {
width: 270px;
float: left;
min-height: 1px;
margin-left: 30px;
}
.block {
display: block;
position: relative;
}
.block img {
display: block;
border: 1px solid rgba(53, 53, 53, 0.65);
box-sizing: border-box;
border-radius: 3px;
}
.block .caption {
font-size: 13px;
font-weight: normal;
line-height: 1.2em;
padding: 10px;
margin: 0px;
position: absolute;
bottom: 1px;
left: 1px;
right: 1px;
color: #FFF;
background: none repeat scroll 0% 0% rgba(0, 0, 0, 0.6);
text-shadow: 0px 0px 20px #000, 0px 0px 10px #000;
z-index: 1;
}
上面的代码只是被所有浏览器忽略了。它不会出现在页面上,也不会出现在浏览器的“检查元素”上。有任何想法吗?这是我在模板上使用的代码,我在自定义页面上调用它。
<div class="frontpage_tile">
<a class="block" href="<?php echo get_permalink(); ?>" data-icon="">
<?php the_post_thumbnail('home-thumb'); ?>
<span class="caption">
<?php the_title(); ?>
</span>
</a>
</div>
最佳答案
为此,我刚刚使用 wpscan 扫描了您的网站,这是您的问题:
[+] Interesting header: CF-RAY: 15644be6d86308d8-LHR
[+] Interesting header: SERVER: cloudflare-nginx
[+] Interesting header: X-CF-POWERED-BY: WP 1.3.14
[+] Interesting header: X-POWERED-BY: PHP/5.5.14
您正在使用 Cloudflare :),只需登录到您的控制面板并启用开发模式。
我会在下面保留旧答案,以防万一有人发现这个问题并想知道如何进行一些故障排除:
如果您转到样式表的顶部,您会看到以下注释:
/*
Theme Name: Twenty Ten
Theme URI: http://wordpress.org/
Author: the WordPress team
[...]
Version: 1.4
[...]
*/
只需更改您的版本号,Wordpress 现在将提供具有新版本号的样式表,强制您的浏览器重新下载它,否则在开发过程中您可以以这种方式注册您的 CSS(这非常方便):
wp_enqueue_style( 'main-style', get_stylesheet_uri(), array(), time() );
这强制在 CSS 上附加一个时间戳作为查询变量,因此您的浏览器认为这是一个新文件,并且每次刷新页面时都会下载新的新鲜 CSS。
通常 CTRL/CMD + SHIFT + R
可以正常工作,如果您仍然看到旧的 CSS,即使进行了这些更改,其中一个可能是导致问题的原因:
- 您的网站正在使用 Cloudflare,但您忘记启用开发模式
- 您的 wordpress 正在运行缓存插件
- 您将文件上传到错误的位置
干杯
关于php - 自定义 CSS 类不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25185250/