<blockquote> 的大小

Posted

技术标签:

【中文标题】<blockquote> 的大小【英文标题】:Size of <blockquote> 【发布时间】:2017-07-22 17:31:14 【问题描述】:
%  for post in post_list %
        <div class="row"> 
               <div class="col-md-4 col-md-offset-4">  
                   <div class="homepost">
                        <blockquote>                                                   
                            <a class="h3" href="%  url 'posts:detail' post.id %"> post.title </a>
                            <footer>By  post.user </footer>
                        </blockquote>
                        <p> post.content|lower|truncatechars:"15" </p>
                        <ul class="list-group">
                            <li class="list-group-item-text"> post.likes  people like this</li>
                            <li class="list-group-item-text"> post.comments.count  Comments </li>
                        </ul>
                    </div>
                </div>
        </div>
% endfor%

这是我的代码,问题是我的块引用大小与我的实际文章大小不同。

这样,

问题是每个帖子块的左上角都有一个空白,这是在我使用块引用之后出现的。就像在第一篇文章中一样,

测试帖 - 通过 luvpreet

它的左边有一个白色的矩形,为什么会这样?

它的解决方案是什么?

【问题讨论】:

真的不清楚你在问什么。您能否更新您的问题以更清楚地解释您所看到的与您期望/希望看到的有何不同? 现在看看,什么? 【参考方案1】:

与左侧齐平的浅灰色框是引导程序样式&lt;blockquote&gt;

见documentation。

如果你不喜欢这种风格,你有两种选择:

    用您自己的 CSS 覆盖原生引导样式。 不要使用blockquote标签

对我来说,你并没有真正使用 blockquote 标签,因为它是 semantically intended。

blockquote 元素表示引用的部分 另一个来源。

可能是这样的:

<div>                                                   
        <h3><a class="h3" href="%  url 'posts:detail' post.id %"> post.title </a></h3>
        <p>By  post.user </footer></p>
</div>

【讨论】:

以上是关于<blockquote> 的大小的主要内容,如果未能解决你的问题,请参考以下文章

微信小程序自定义导航栏兼容适配所有机型

<q>、<blockquote> 和 <cite> 的有效使用

以缩小的字体大小显示容器

正确使用 Blockquote、q 和 cite?

用 <blockquote> 做大引号

吴裕雄 Bootstrap 前端框架开发——Bootstrap 排版:引用(Blockquote)