如何在帖子边界内的tumblr文本帖子中保留照片?

时间:2016-11-14 09:47:10

标签: html css tumblr

如何确保添加到tumblr文字帖子的照片不会超出帖子的背景? 我想确保无论照片在reblog链中的哪个地方,照片仍然会在背景中。

我的文章的html是:

{block:Text}
        <div class="text">
            {block:Title}
                <h3>
                    <a href="{Permalink}">{Title}</a>
                </h3>
            {/block:Title}
            {Body}
            <ul class="like-reblog">
                <li>{LikeButton color="white"}</li>
                <li>{ReblogButton color="white"}</li>
                <li>{block:NoteCount}<a href="{Permalink}#notes">{NoteCountWithLabel}</a>{/block:NoteCount}</li>
                <li>{block:Date}<a href="{Permalink}">{Month} {DayOfMonth}</a>{/block:Date}</li>
            </ul>
            <ul class="tags">
                <li>{block:HasTags}{block:Tags}<a href="{TagURL}">{Tag}</a>{/block:Tags}{/block:HasTags}
            </ul>

        </div>
        {block:PostNotes}{PostNotes}{/block:PostNotes}
        {/block:Text}

我的文章帖子的css是:

.text {
        background: rgba(251, 230, 202, 1);
        margin: 40px auto;
        padding: 20px;
        width: 500px;
        border: 2px solid #fff;
        background-position:center;
    }
    .text a {
        font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
        font-weight: normal;
        color: rgb(52, 47, 20);
        text-decoration: none;
    }
    .text img {
        max-width: 400px;
        height: auto;
}
    .text blockquote{
        border-left: 3px solid #fff;
        padding: 0px 10px;

1 个答案:

答案 0 :(得分:1)

.text img {
    max-width: 100%;
    height: auto;}

这应该解决它。图像将缩小以适应reblog块引用。