Question

我正在尝试学习如何创建tumblr主题，但这很困难。我正在制作一个主题，当您通过创建叠加层悬停在每个照片帖子上时显示社交媒体按钮。我还没能找到为每个帖子做正确的方法。这是我为照片发布的代码：

{block:Posts} 
    {block:Photo}
        <div class="post photo smallbox" id="post-{PostID}">
         <img src="{PhotoURL-500}" alt="{PhotoAlt}" id="photo"/>
         <div class="wrapper">
             <div class="content">
                 <div class="likebutton">
                 {LikeButton size="100"}  
                 </div>
                 <div class="repostbutton">
                 {ReblogButton size="100"}   
                 </div>
                 <div class="line"></div>
                 <div class="shareBoxBtn">
                     <a href="http://twitter.com/intent/tweet?url={URLEncodedShortURL}" target="_blank">
                         <span class="shareBoxBtn share_twBtn" style="opacity: 1; -webkit-transform: matrix(1, 0, 0, 1, 0, 0);"></span>
                         <span class="shareBoxBtnHover share_twBtnHover" style="opacity: 0;"></span>
                     </a>
                     <a href="https://www.facebook.com/dialog/feed?app_id=221438161314294&link={URLEncodedPermalink}&redirect_uri={URLEncodedPermalink}" target="_blank">
                         <span class="shareBoxBtn share_fbBtn" style="opacity: 1; -webkit-transform: matrix(1, 0, 0, 1, 0, 0);"></span>
                         <span class="shareBoxBtnHover share_fbBtnHover" style="opacity: 0;"></span>
                     </a>
                     <a href="//pinterest.com/pin/create/button/?url={URLEncodedPermalink}&media={URLEncodedPhotoURL-500}" target="_blank">
                         <span class="shareBoxBtn share_pinBtn" style="opacity: 1; -webkit-transform: matrix(1, 0, 0, 1, 0, 0);"></span>
                         <span class="shareBoxBtnHover share_pinBtnHover" style="opacity: 0;"></span>
                     </a>
                 </div>   
             </div>
         </div>
        </div>
    {/block:Photo}
{/block:Posts}

Answer 1

试试这个css：

#photo{position:relative}
.wrapper{position:absolute}

在tumblr上创建叠加帖子

1 个答案: