小编Tom*_*m25的帖子

使用 SVG 制作 WordPress 徽标

我正在尝试使用 SVG 文件作为 Wordpress 中网站的徽标,正如您从下面的代码中看到的那样,我尝试在 .svg 文件中调用此方法。不幸的是,我无法让它发挥作用......

//* Add support for custom header
add_theme_support( 'custom-header', array(
    'header_image'    => '/images/tgoc.svg',
    'header-selector' => '.site-title a',
    'header-text'     => false,
    'height'          => 110,
    'width'           => 320,
) );
Run Code Online (Sandbox Code Playgroud)

我还在 funtions.php 中执行了以下操作:

//* Enable SVG file upload
function custom_mtypes( $m ){
    $m['svg'] = 'image/svg+xml';
    $m['svgz'] = 'image/svg+xml';
    return $m;
}
add_filter( 'upload_mimes', 'custom_mtypes' );
Run Code Online (Sandbox Code Playgroud)

我知道您也可以插入 svg 代码,但我的主要问题是在哪里插入此代码?我也想尝试使用 Modernizr 进行备份。

这是CSS:

/* Logo, hide text */

.header-image .title-area {
    padding: 0;
    width: 340px;
    height: 340px;
    background: …
Run Code Online (Sandbox Code Playgroud)

css php wordpress svg genesis

5
推荐指数
1
解决办法
6231
查看次数

背景色色调效果应用于背景图像

我尝试将透明度的彩色叠加应用于背景图像,背景图像正在显示,希望代码可以正常使用,但如果有人有更有效的方法,请分享.

当我尝试使用rgba值和透明度应用背景颜色时,没有任何显示...

有什么建议?

.call-to-action {
color: #fff;
background: url(images/cta-bg.jpg) no-repeat center center fixed;
background-color: rgba(255, 255, 255, 0.5) !important;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
font-size: 18px;
padding: 48px 12px;
text-align: center;
}
Run Code Online (Sandbox Code Playgroud)

http://i.stack.imgur.com/8iNun.png

css wordpress transparency background-image background-color

3
推荐指数
1
解决办法
7738
查看次数

定位a:选择器之前

添加:before选择器时,在这种情况下,我试图插入一个电话图标显示在.front-page-contactdiv 上方.理想情况下,它将居中于.front-page-contactdiv中的文本上方.

我怎么能定位这个选择器来实现上面提到的结果?

 .front-page-contact .widget:nth-of-type(1) {
    text-align: center;
 }

.front-page-contact {
    background-color: #00AFBE;
    padding: 20px 0;
}

.front-page-contact h2 {
    font-size: 26px;
    color: #fff;
    margin: 0;
    position: relative;
}

.front-page-contact h2:before {
    font-family: Ionicons;
    content: "\f4b8";
    font-size: 40px;
    background-color: tomato;
    border-radius: 50%;
    width: 40px;
    height: 40px;
    padding: 20px;
    display: block;
    position: relative;
    line-height: 1em;
    margin: 0 auto;
}
Run Code Online (Sandbox Code Playgroud)

截图: 伪元素的当前位置

css icons css3 pseudo-element

3
推荐指数
1
解决办法
892
查看次数