簡體   English   中英

在Wordpress頁腳中添加自定義圖片作為分隔符

[英]Adding custom image as separator in wordpress footer

我想在wordpress頁腳中添加自定義分隔符圖像,這是我的functions.php代碼:

function advertica_lite_widgets_init() {
register_sidebar(array(
    'name' => 'Page Sidebar',
    'id' => 'page-sidebar',
    'before_widget' => '<li id="%1$s" class="ske-container %2$s">',
    'after_widget' => '</li>',
    'before_title' => '<h3 class="ske-title">',
    'after_title' => '</h3>',
));
register_sidebar(array(
    'name' => 'Blog Sidebar',
    'id' => 'blog-sidebar',
    'before_widget' => '<li id="%1$s" class="ske-container %2$s">',
    'after_widget' => '</li>',
    'before_title' => '<h3 class="ske-title">',
    'after_title' => '</h3>',
));
register_sidebar(array(
    'name' => 'Footer Sidebar',
    'id' => 'footer-sidebar',
    'before_widget' => '<div id="%1$s" class="ske-footer-container span3 ske-container %2$s">',
    'after_widget' => '</div>',
    'before_title' => '<h3 class="ske-title ske-footer-title">',
    'after_title' => '</h3>',
));  }

我想將圖像添加為所有3個塊之間的分隔符,我嘗試了幾個Google幫助,但沒有任何與我正在尋找的相關的幫助。 會有人可以協助我進行修改嗎?

我想要這樣的東西:

在此處輸入圖片說明

 .ske-container{ display: inline-block; padding: 0px 5px; width:30%; float:left; text-align:center; height:200px; background-image: url("https://i.stack.imgur.com/3vmnN.png"); background-repeat: no-repeat; background-position: right top; } .ske-container:last-child{ background-image: none; } 
 <div> <div class="ske-container"> Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. </div> <div class="ske-container"> Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. </div> <div class="ske-container"> Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. </div> </div> 

您能在當前主題style.css添加CSS以上嗎? 並檢查。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM